@font-face { font-family: "Barlow Fallback"; src: local("Arial"), local("Roboto"); font-weight: 100 600; size-adjust: 91%; ascent-override: 110%; descent-override: 22%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Roboto Bold"); font-weight: 700 900; size-adjust: 91.5%; ascent-override: 110%; descent-override: 22%; line-gap-override: 0%; }

:root {
  --brand: #ffb600;
  --brand-dark: #e0a000;
  --ink: #1b1b1b;
  --ink-2: #252525;
  --muted: #6f6f6f;
  --paper: #f7f6f2;
  --shadow: 0 12px 34px rgba(27, 27, 27, 0.09);
  --ease: cubic-bezier(0.65, 0, 0.35, 1);
}

body { font-size: 16px; color: #5d5d5d; }
h1, h2, h3, h4, h5, h6 { letter-spacing: 0.2px; text-transform: none; }

img[width][height] { height: auto; }
.ts-service-image-wrapper img,
.page-slider:not(.small-bg) .item img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }

.into-sub-title, .column-title, .service-box-title, .banner-title,
.action-title, .ts-facts-title, .border-title, .widget-title { text-transform: none; }
.column-title, .into-sub-title { font-weight: 800; }
.solid-bg { background: var(--paper); }

.subscribe-call-to-acton h3, .subscribe-call-to-acton h4, .subscribe-call-to-acton h4 a { color: var(--ink) !important; }
.accordion-group .card-header .btn[aria-expanded=true] { color: #8a6100; box-shadow: inset 3px 0 0 var(--brand); }
.quote-author { color: #8a6100; }
.btn-primary:not(.border):not(:hover) { color: var(--ink); }
#back-to-top .btn.btn-primary { color: var(--brand); }

.no-aos [data-aos] { opacity: 1 !important; transform: none !important; }

.top-bar { background: var(--ink); color: #cfcfcf; }
ul.top-info li i, .top-social ul li a { color: var(--brand); }
.top-social ul li a:hover { color: #fff; }

.footer-logo { width: 200px; height: auto; }

.btn-primary:not(.border), .btn-dark {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
  position: relative;
  overflow: hidden;
}
.btn-primary:not(.border)::after, .btn-dark::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, 0.35) 50%, transparent 70%);
  transform: translateX(-120%);
  transition: transform 0.7s var(--ease);
}
.btn-primary:not(.border):hover::after, .btn-dark:hover::after { transform: translateX(120%); }

.heading-block { position: relative; margin: 0 auto 55px; max-width: 760px; }
.heading-block.text-left { margin-left: 0; }
.heading-title { margin: 0; font: 800 clamp(32px, 4.2vw, 50px)/1.1 "Barlow", "Barlow Fallback", sans-serif; letter-spacing: -0.3px; color: var(--ink); }
.heading-divider {
  display: block;
  width: 84px;
  height: 4px;
  margin: 20px auto 0;
  background: linear-gradient(90deg, var(--brand) 0 62px, transparent 62px 70px, var(--ink) 70px);
}
.dark-bg .heading-divider { background: linear-gradient(90deg, var(--brand) 0 62px, transparent 62px 70px, #fff 70px); }
.heading-block.text-left .heading-divider { margin-left: 0; }
.heading-block.aos-animate .heading-divider { animation: grow-divider 0.9s 0.25s var(--ease) both; }
.heading-lead { margin: 18px auto 0; max-width: 580px; color: var(--muted); font-size: 16.5px; line-height: 1.7; }
.dark-bg .heading-title { color: #fff; }

.heading-eyebrow { display: inline-block; margin-bottom: 4px; font: 700 13px/1 "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 3px; text-transform: uppercase; color: #946800; }
@keyframes grow-divider { from { width: 0; } to { width: 84px; } }

.line-icon { display: inline-block; flex: none; color: var(--brand); vertical-align: middle; }
.js .draw :is(path, rect, circle, line, polyline, ellipse), .js .draw-group :is(path, rect, circle, line, polyline, ellipse) {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  transition: stroke-dashoffset 1.6s var(--ease);
}
.js .draw.is-drawn :is(path, rect, circle, line, polyline, ellipse), .js .draw-group.is-drawn :is(path, rect, circle, line, polyline, ellipse) { stroke-dashoffset: 0; }
.js .draw-group .ill-dark { transition-duration: 3s; }
.js .draw-group .ill-accent { transition-duration: 2.4s; transition-delay: 1.4s; }
@keyframes redraw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

.ts-service-box-img .line-icon, .ts-facts-img .line-icon { color: var(--brand); }
.ts-service-icon.svg-icon { float: left; }
.ts-service-icon.svg-icon .line-icon { width: 40px; height: 40px; }
.ts-service-box:hover .ts-service-box-img .draw :is(path, rect, circle, line, polyline, ellipse),
.ts-service-box:hover .ts-service-box-img .line-icon :is(path, rect, circle, line, polyline, ellipse) { animation: redraw 1s var(--ease); }

.illustration-wrap { max-width: 380px; margin: 0 auto; }
.illustration { width: 100%; height: auto; display: block; }

.js .draw .idle :is(path, rect, circle), .js .draw-group .idle :is(path, rect, circle) {
  stroke-dasharray: none; stroke-dashoffset: 0; transition: none;
}
.js .draw .idle, .js .draw-group .idle { opacity: 0; }
.line-icon g, .line-icon path, .illustration g, .illustration path { transform-box: view-box; }

.draw.is-drawn .idle-steam { animation: idle-steam 2.6s 1.7s ease-out infinite; }
.draw.is-drawn .idle-drip { animation: idle-drip 1.8s 1.7s ease-in infinite; }
.draw.is-drawn .m-tap { transform-origin: 54px 5px; animation: idle-tap 2.8s 1.7s ease-in-out infinite; }
.draw.is-drawn .m-hammer { transform-origin: 40px 21px; animation: idle-tap 2.8s 1.7s ease-in-out infinite; }
.draw.is-drawn .m-slide { animation: idle-slide 3.2s 1.7s ease-in-out infinite; }
.draw.is-drawn .m-bob { animation: idle-bob 2.4s 1.7s ease-in-out infinite; }
.draw.is-drawn .m-swing { animation: idle-swing 3.2s 1.7s ease-in-out infinite; }
.m-swing-medal { transform-origin: 32px 9px; }
.m-swing-tag { transform-origin: 46px 16px; }
.draw.is-drawn .m-spin { transform-origin: 32px 35px; animation: idle-spin 6s 1.7s linear infinite; }
.draw.is-drawn .m-redraw { animation: idle-redraw 5s 2.4s ease-in-out infinite; }
.draw.is-drawn .m-redraw-2 { animation-delay: 3s; }

.draw-group.is-drawn .idle { animation: idle-in 0.8s 3.8s forwards; }
.ill-lights .win-light { opacity: 0; animation: idle-window 7s ease-in-out infinite; }
.cloud-1 { animation: idle-drift 42s linear infinite; }
.cloud-2 { animation: idle-drift 58s -24s linear infinite; }
.ill-hat path { animation: idle-bob 2.6s ease-in-out infinite; }
.hoist-bucket { animation: idle-hoist 7s ease-in-out infinite alternate; }
.hoist-rope { transform-origin: 374px 176px; animation: idle-rope 7s ease-in-out infinite alternate; }

.footer-skyline-wrap { opacity: 0.45; }
.sky-window { opacity: 0.12; animation: idle-twinkle 6s ease-in-out infinite; }
.sky-star { opacity: 0.2; animation: idle-twinkle 4s ease-in-out infinite; }
.sky-car { transform-box: view-box; animation: idle-car 10s linear infinite; }
.sky-car-2 { animation-duration: 13s; animation-delay: -5s; animation-direction: reverse; }
.sky-car-3 { animation-duration: 11s; animation-delay: -8s; }

@keyframes idle-in { to { opacity: 1; } }
@keyframes idle-steam { 0% { opacity: 0; transform: translateY(3px); } 35% { opacity: 1; } 100% { opacity: 0; transform: translateY(-6px); } }
@keyframes idle-drip { 0% { opacity: 0; transform: translateY(-3px); } 25% { opacity: 1; } 100% { opacity: 0; transform: translateY(7px); } }
@keyframes idle-tap { 0%, 55%, 100% { transform: rotate(0); } 65% { transform: rotate(-16deg); } 75% { transform: rotate(5deg); } 85% { transform: rotate(-6deg); } }
@keyframes idle-slide { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes idle-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes idle-swing { 0%, 100% { transform: rotate(-7deg); } 50% { transform: rotate(7deg); } }
@keyframes idle-spin { to { transform: rotate(360deg); } }
@keyframes idle-redraw { 0%, 60% { stroke-dashoffset: 0; } 72% { stroke-dashoffset: 1; } 74% { stroke-dashoffset: 1; } 90%, 100% { stroke-dashoffset: 0; } }
@keyframes idle-window { 0%, 100% { opacity: 0; } 20%, 55% { opacity: 0.45; } 70% { opacity: 0; } }
@keyframes idle-drift { from { transform: translateX(-70px); } to { transform: translateX(440px); } }
@keyframes idle-hoist { 0%, 8% { transform: translateY(0); } 92%, 100% { transform: translateY(160px); } }
@keyframes idle-rope { 0%, 8% { transform: scaleY(1); } 92%, 100% { transform: scaleY(5); } }
@keyframes idle-twinkle { 0%, 100% { opacity: 0.12; } 50% { opacity: 1; } }
@keyframes idle-car { from { transform: translateX(0); } to { transform: translateX(580px); } }

.anim-paused, .anim-paused * { animation-play-state: paused !important; }

.js .page-slider:not(.slick-initialized) > :not(:first-child) { display: none; }
.typed-words { color: var(--brand); white-space: nowrap; }
.typed-cursor { color: var(--brand); font-weight: 300; }

.banner-area--angled {
  min-height: 380px;
  clip-path: polygon(0 0, 100% 0, 100% 84%, 0 100%);
}
.banner-pattern {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 182, 0, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 182, 0, 0.07) 1px, transparent 1px);
  background-size: 36px 36px;
  mask-image: linear-gradient(90deg, transparent, #000 30%, #000 70%, transparent);
}
.banner-area--angled .banner-text { margin-top: -18px; }
.banner-title { font-weight: 800; letter-spacing: 0.5px; }
.breadcrumb {
  display: inline-flex;
  padding: 8px 18px;
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(3px);
}

.ts-service-area {
  background-image:
    linear-gradient(rgba(255, 182, 0, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 182, 0, 0.06) 1px, transparent 1px);
  background-size: 34px 34px;
  padding-bottom: 60px !important;
}

.subscribe-icon { float: left; margin: 0 16px 0 0; }
.subscribe-icon .line-icon { color: var(--ink); }

.why-us.dark-bg {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 110px 0 100px;
  background: linear-gradient(180deg, #121212 0%, #1a1a1a 55%, #141414 100%);
}

.why-us::before, .why-us::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  z-index: 2;
  height: 6px;
  background: repeating-linear-gradient(-45deg, var(--brand) 0 14px, #121212 14px 28px);
}
.why-us::before { top: 0; }
.why-us::after { bottom: 0; }

.why-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.why-grid-lines {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px) 0 0 / 160px 160px,
    linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px) 0 0 / 160px 160px,
    linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px) 0 0 / 32px 32px;
  -webkit-mask-image: radial-gradient(ellipse 75% 70% at 50% 45%, #000 30%, transparent 100%);
  mask-image: radial-gradient(ellipse 75% 70% at 50% 45%, #000 30%, transparent 100%);
}
.why-glow { position: absolute; border-radius: 50%; filter: blur(20px); }
.why-glow-a { top: -180px; left: -160px; width: 560px; height: 560px; background: radial-gradient(circle, rgba(255, 182, 0, 0.16), transparent 65%); }
.why-glow-b { right: -200px; bottom: -220px; width: 640px; height: 640px; background: radial-gradient(circle, rgba(255, 182, 0, 0.12), transparent 65%); }
.why-blueprint {
  position: absolute;
  right: -30px;
  bottom: 40px;
  width: 400px;
  height: auto;
  color: var(--brand);
  opacity: 0.16;
}
.why-blueprint .why-blueprint-labels { fill: currentColor; stroke: none; font: 600 13px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 1px; opacity: 0; transition: opacity 1s 2.4s; }
.why-blueprint.is-drawn .why-blueprint-labels { opacity: 1; }

.why-us .heading-lead { color: #a8a8a8; }

.why-grid { row-gap: 30px; }
.why-card {
  --mx: 50%;
  --my: 0%;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  width: 100%;
  padding: 38px 32px 40px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.015) 60%);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  transition: transform 0.45s var(--ease), border-color 0.45s, box-shadow 0.45s;
}
.why-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(420px circle at var(--mx) var(--my), rgba(255, 182, 0, 0.14), transparent 45%);
  opacity: 0;
  transition: opacity 0.4s;
}

.why-card::after {
  content: "";
  position: absolute;
  inset: 10px;
  pointer-events: none;
  background:
    linear-gradient(var(--brand), var(--brand)) top left / 22px 2px,
    linear-gradient(var(--brand), var(--brand)) top left / 2px 22px,
    linear-gradient(var(--brand), var(--brand)) bottom right / 22px 2px,
    linear-gradient(var(--brand), var(--brand)) bottom right / 2px 22px;
  background-repeat: no-repeat;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity 0.4s, transform 0.45s var(--ease);
}
.why-card:hover {
  transform: translateY(-8px);
  border-color: rgba(255, 182, 0, 0.45);
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.45);
}
.why-card:hover::before, .why-card:hover::after { opacity: 1; }
.why-card:hover::after { transform: none; }

.why-num {
  position: absolute;
  top: 18px;
  right: 24px;
  font: 800 64px/1 "Barlow", "Barlow Fallback", sans-serif;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.14);
  transition: -webkit-text-stroke-color 0.4s, transform 0.45s var(--ease);
}
.why-card:hover .why-num { -webkit-text-stroke-color: rgba(255, 182, 0, 0.7); transform: translateY(-4px); }

.why-icon {
  display: grid;
  place-items: center;
  width: 78px;
  height: 78px;
  margin-bottom: 26px;
  border: 1px solid rgba(255, 182, 0, 0.45);
  background: rgba(255, 182, 0, 0.06);
  color: var(--brand);
  transition: background 0.35s, transform 0.45s var(--ease);
}
.why-icon .line-icon { width: 46px; height: 46px; }
.why-card:hover .why-icon { background: var(--brand); transform: rotate(-4deg); }
.why-card:hover .why-icon .line-icon { color: var(--ink); }
.why-card:hover .why-icon :is(path, rect, circle, line, polyline, ellipse) { animation: redraw 1s var(--ease); }

.why-card h3 { margin: 0 0 12px; font: 700 23px/1.25 "Barlow", "Barlow Fallback", sans-serif; color: #fff; }
.why-card p { margin: 0; color: #a8a8a8; line-height: 1.75; }
.why-card-line {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: var(--brand);
  transform: scaleX(0.12);
  transform-origin: left;
  transition: transform 0.6s var(--ease);
}
.why-card:hover .why-card-line { transform: scaleX(1); }

@media (max-width: 1199px) {
  .why-blueprint { width: 320px; opacity: 0.1; }
}
@media (max-width: 991px) {
  .why-us.dark-bg { padding: 80px 0 70px; }

}
@media (max-width: 575px) {
  .why-us.dark-bg { padding: 70px 0 60px; }
  .why-grid { row-gap: 18px; }
  .why-card { padding: 28px 22px 30px; }
  .why-num { top: 16px; right: 18px; font-size: 46px; }
  .why-icon { width: 64px; height: 64px; margin-bottom: 20px; }
  .why-icon .line-icon { width: 38px; height: 38px; }
  .why-card h3 { font-size: 21px; }

  .why-blueprint { width: 260px; right: -60px; opacity: 0.08; }

}

.process-stepper { position: relative; max-width: 980px; margin: 0 auto; }
.stepper-track { position: absolute; left: 12.5%; right: 12.5%; top: 46px; height: 3px; background: #e7e4dc; }
.stepper-progress { display: block; height: 100%; width: 0; background: var(--brand); transition: width 0.6s var(--ease); }
.stepper-steps { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; margin: 0; padding: 0; }
.stepper-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 0 8px;
  border: 0;
  background: none;
  cursor: pointer;
  font-family: "Barlow", "Barlow Fallback", sans-serif;
}
.stepper-icon {
  display: grid;
  place-items: center;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: #fff;
  border: 3px solid #e7e4dc;
  transition: border-color 0.3s, background 0.3s, transform 0.3s var(--ease);
}
.stepper-step.is-active .stepper-icon, .stepper-step.is-done .stepper-icon { border-color: var(--brand); }
.stepper-step.is-active .stepper-icon { background: var(--brand); transform: scale(1.06); }
.stepper-step.is-active .line-icon { color: var(--ink); }
.stepper-num { margin-top: 14px; font-weight: 800; font-size: 14px; letter-spacing: 2px; color: var(--brand-dark); }
.stepper-label { font-weight: 700; font-size: 19px; color: var(--ink); line-height: 1.25; }
.stepper-step:focus-visible { outline: 2px dashed var(--brand); outline-offset: 6px; }
.stepper-panels { margin-top: 40px; }
.stepper-panel {
  max-width: 700px;
  margin: 0 auto;
  padding: 34px 38px;
  background: var(--paper);
  border-left: 4px solid var(--brand);
  animation: panel-in 0.5s var(--ease);
}
.stepper-panel h3 { margin: 4px 0 10px; font: 800 26px "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.stepper-panel p { margin: 0; }
.stepper-panel-num { font: 700 13px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 2px; text-transform: uppercase; color: var(--brand-dark); }
@keyframes panel-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

.project-img-container { overflow: hidden; }
.project-img-container img { transition: transform 0.7s var(--ease); }
.project-img-container:hover img { transform: scale(1.07); }
.project-item-title a { color: #fff; }
.filter-count {
  display: inline-grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  margin-left: 4px;
  padding: 0 5px;
  border-radius: 10px;
  background: rgba(27, 27, 27, 0.08);
  font-size: 11px;
  line-height: 1;
}
.shuffle-btn-group label.active .filter-count { background: rgba(255, 255, 255, 0.3); }
@media (max-width: 767px) {

  .shuffle-btn-group {
    display: flex;
    margin: 10px 0 30px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .shuffle-btn-group::-webkit-scrollbar { display: none; }
  .shuffle-btn-group label { flex: none; padding: 10px 16px 8px; white-space: nowrap; scroll-snap-align: start; }
}

@media (hover: none) {
  .shuffle-item .project-img-container::after { opacity: 1; background: linear-gradient(0deg, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0) 50%); pointer-events: none; }
  .shuffle-item .project-img-container .project-item-info { top: auto; bottom: 0; margin: 0; padding: 0 18px 14px; pointer-events: none; }
  .shuffle-item .project-img-container .project-item-info-content { opacity: 1; transform: none; }
  .shuffle-item .project-img-container .project-item-info-content .project-item-title { margin-bottom: 6px; font-size: 19px; }
  .shuffle-item .project-img-container .project-item-title a { pointer-events: auto; }
  .shuffle-item .project-img-container .project-cat { margin: 0; }
  .shuffle-item .project-img-container .gallery-popup .gallery-icon { opacity: 1; transform: none; }
}

.newsletter-form .btn { width: 100%; padding: 14px 20px; }

.svc-intro { padding: 90px 0; }
.svc-chips { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; margin: 24px 0 30px; padding: 0; list-style: none; }
.svc-chips li { display: flex; align-items: center; gap: 10px; font: 600 15.5px/1.3 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.svc-chips i {
  display: grid;
  place-items: center;
  flex: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--brand);
  color: var(--ink);
  font-size: 11px;
}
.svc-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }
a.svc-call { display: flex; align-items: center; gap: 10px; color: var(--ink); font: 700 19px "Barlow", "Barlow Fallback", sans-serif; }
.svc-call .line-icon { color: var(--brand-dark); }
a.svc-call:hover { color: var(--brand-dark); text-decoration: none; }

.svc-media { position: relative; padding: 0 0 26px 26px; }
.svc-media::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 70%;
  height: 72%;
  border: 3px solid var(--brand);
}
.svc-media .page-slider { position: relative; z-index: 1; box-shadow: 0 24px 50px rgba(27, 27, 27, 0.16); }
.svc-media .page-slider .item img { aspect-ratio: 4 / 3; }

.svc-offers, .svc-faq { padding: 90px 0; }
.svc-grid { row-gap: 26px; }

.svc-card {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
  border: 1px solid #ececec;
  background: #fff;
  box-shadow: 0 10px 30px rgba(27, 27, 27, 0.05);
  transition: transform 0.45s var(--ease), box-shadow 0.45s, border-color 0.45s;
}
.svc-card::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: var(--brand);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s var(--ease);
}
.svc-card-media { position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: #eceae4; }
.svc-card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 16, 28, 0) 55%, rgba(10, 16, 28, 0.35)); pointer-events: none; }
.svc-card .svc-card-media img.svc-card-img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s var(--ease); }
.svc-card-num {
  position: absolute;
  z-index: 1;
  left: 0;
  bottom: 0;
  padding: 7px 14px 6px;
  background: var(--brand);
  font: 800 15px/1 "Barlow", "Barlow Fallback", sans-serif;
  letter-spacing: 1px;
  color: var(--ink);
}
.svc-card-body { flex: 1; padding: 22px 26px 28px; }
.svc-card h3 { margin: 0 0 8px; font: 700 21px/1.25 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); transition: color 0.3s; }
.svc-card p { margin: 0; color: var(--muted); line-height: 1.7; }
.svc-card:hover { transform: translateY(-6px); border-color: transparent; box-shadow: 0 24px 50px rgba(27, 27, 27, 0.14); }
.svc-card:hover::after { transform: scaleX(1); }
.svc-card:hover .svc-card-media img.svc-card-img { transform: scale(1.07); }
.svc-card:hover h3 { color: #8a6100; }

.svc-process {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 100px 0 90px;
  background: linear-gradient(180deg, #131313, #1a1a1a);
}
.svc-process::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 182, 0, 0.14), transparent 40%),
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px) 0 0 / 40px 40px,
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px) 0 0 / 40px 40px;
  -webkit-mask-image: radial-gradient(ellipse 80% 75% at 50% 40%, #000 35%, transparent 100%);
  mask-image: radial-gradient(ellipse 80% 75% at 50% 40%, #000 35%, transparent 100%);
}
.svc-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 34px 28px; margin: 0; padding: 0; list-style: none; }
.svc-steps:has(> li:nth-child(5)) { grid-template-columns: repeat(3, 1fr); }
.svc-step { position: relative; }
.svc-step:not(:last-child)::before {
  content: "";
  position: absolute;
  top: 29px;
  left: 72px;
  right: -16px;
  border-top: 2px dashed rgba(255, 182, 0, 0.35);
}
@media (min-width: 992px) {
  .svc-steps:has(> li:nth-child(5)) > .svc-step:nth-child(3n)::before { display: none; }
}
.svc-step-num {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin-bottom: 22px;
  border: 2px solid var(--brand);
  border-radius: 50%;
  background: #161616;
  font: 800 18px/1 "Barlow", "Barlow Fallback", sans-serif;
  color: var(--brand);
  transition: background 0.35s, color 0.35s, box-shadow 0.35s;
}
.svc-step:hover .svc-step-num { background: var(--brand); color: var(--ink); box-shadow: 0 0 0 8px rgba(255, 182, 0, 0.15); }
.svc-step h3 { margin: 0 0 8px; font: 700 21px/1.25 "Barlow", "Barlow Fallback", sans-serif; color: #fff; }
.svc-step p { margin: 0; color: #a8a8a8; line-height: 1.7; }

.svc-side-title { margin: 0; font: 800 26px/1.2 "Barlow", "Barlow Fallback", sans-serif; color: #fff; }

@media (max-width: 991px) {
  .svc-intro, .svc-offers, .svc-faq { padding: 70px 0; }
  .svc-process { padding: 80px 0 70px; }
  .svc-steps, .svc-steps:has(> li:nth-child(5)) { grid-template-columns: repeat(2, 1fr); }
  .svc-step::before { display: none; }
}
@media (max-width: 575px) {
  .svc-intro, .svc-offers, .svc-faq { padding: 60px 0; }
  .svc-chips { grid-template-columns: 1fr; }

  .svc-grid { row-gap: 14px; }
  .svc-card { flex-direction: row; align-items: stretch; }
  .svc-card-media { flex: 0 0 118px; aspect-ratio: auto; min-height: 118px; }
  .svc-card-num { padding: 5px 9px 4px; font-size: 12px; }
  .svc-card-body { padding: 16px 16px 18px; }
  .svc-card h3 { margin-bottom: 4px; font-size: 18px; }
  .svc-card p { font-size: 14.5px; line-height: 1.55; }
  .svc-media { padding: 0 0 18px 18px; }

  .svc-steps, .svc-steps:has(> li:nth-child(5)) { grid-template-columns: 1fr 1fr; gap: 12px; }
  .svc-step { padding: 16px 14px 18px; border: 1px solid rgba(255, 255, 255, 0.08); border-top: 2px solid var(--brand); background: rgba(255, 255, 255, 0.04); }
  .svc-step::before { display: none !important; }
  .svc-step-num { width: 38px; height: 38px; margin-bottom: 12px; font-size: 14px; }
  .svc-step h3 { margin-bottom: 6px; font-size: 16.5px; line-height: 1.25; }
  .svc-step p { font-size: 14px; line-height: 1.55; }

}

.sidebar .widget .info-list li { margin-bottom: 12px; }
.sidebar .widget .info-list i { color: var(--brand); width: 20px; }
.ts-service-box .ts-service-box-img .line-icon { color: var(--brand); }

.contact-section { padding: 90px 0 100px; }
.contact-section .row { align-items: stretch; }

.contact-panel {
  position: relative;
  overflow: hidden;
  height: 100%;
  padding: 44px 40px 40px;
  background:
    linear-gradient(rgba(156, 196, 238, 0.07) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(90deg, rgba(156, 196, 238, 0.07) 1px, transparent 1px) 0 0 / 24px 24px,
    radial-gradient(ellipse at 0% 0%, #13386a, #0a2242 70%);
  color: #d4dbe5;
}
.contact-panel::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: repeating-linear-gradient(-45deg, var(--brand) 0 12px, #0a2242 12px 24px); }
.contact-panel-title { margin: 0 0 12px; font: 800 clamp(28px, 3vw, 36px)/1.15 "Barlow", "Barlow Fallback", sans-serif; color: #fff; }
.contact-panel-lead { margin-bottom: 30px; line-height: 1.7; }
.contact-list { display: grid; gap: 18px; margin: 0 0 30px; padding: 0; list-style: none; }
.contact-list li { display: flex; align-items: center; gap: 16px; }
.contact-list-icon { display: grid; place-items: center; flex: none; width: 54px; height: 54px; background: var(--brand); transition: transform 0.35s var(--ease); }
.contact-list-icon .line-icon { color: var(--ink); }
.contact-list li:hover .contact-list-icon { transform: rotate(-6deg); }
.contact-list-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.contact-list-text small { font: 700 12px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 1.5px; text-transform: uppercase; color: #8fa6c2; }
.contact-list-text, .contact-list-text a { font: 700 18px/1.35 "Barlow", "Barlow Fallback", sans-serif; color: #fff; overflow-wrap: anywhere; }
.contact-list-text a:hover { color: var(--brand); text-decoration: none; }
.contact-badges { display: grid; gap: 8px; margin-bottom: 30px; padding: 18px 0; border-top: 1px dashed rgba(255, 255, 255, 0.18); border-bottom: 1px dashed rgba(255, 255, 255, 0.18); }
.contact-badges span { display: flex; align-items: center; gap: 10px; font-size: 15px; }
.contact-badges i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: rgba(255, 182, 0, 0.18); color: var(--brand); font-size: 10px; }
.contact-panel { display: flex; flex-direction: column; }
.contact-social { display: flex; align-items: center; gap: 10px; }
.contact-social span { margin-right: 6px; font: 700 13px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 1px; text-transform: uppercase; color: #8fa6c2; }
.contact-social a { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(255, 255, 255, 0.2); color: #fff; transition: background 0.25s, border-color 0.25s, color 0.25s; }
.contact-social a:hover { border-color: var(--brand); background: var(--brand); color: var(--ink); }

.quote-card { height: 100%; padding: 44px 44px 36px; border-top: 4px solid var(--brand); background: #fff; box-shadow: 0 24px 60px rgba(27, 27, 27, 0.1); scroll-margin-top: 110px; }
.quote-card-title { margin: 0 0 8px; font: 800 clamp(28px, 3vw, 36px)/1.15 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.quote-card-lead { margin-bottom: 26px; color: var(--muted); }
.quote-services { min-width: 0; margin: 0 0 24px; padding: 0; border: 0; }
.quote-services legend { margin-bottom: 12px; font: 700 15px "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.svc-chip-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.svc-chip { margin: 0; cursor: pointer; }
.svc-chip input { position: absolute; opacity: 0; pointer-events: none; }
.svc-chip span {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 100%;
  padding: 9px 12px 9px 10px;
  border: 1px solid #e3ded3;
  background: #fbfaf7;
  font: 700 14px/1.2 "Barlow", "Barlow Fallback", sans-serif;
  color: var(--ink);
  transition: background 0.2s, border-color 0.2s, transform 0.2s var(--ease);
}
.svc-chip .line-icon { color: #c98f00; transition: color 0.2s; }
.svc-chip:hover span { border-color: var(--brand); transform: translateY(-2px); }
.svc-chip input:checked + span { border-color: var(--brand); background: var(--brand); }
.svc-chip input:checked + span .line-icon { color: var(--ink); }
.svc-chip input:focus-visible + span { outline: 2px dashed var(--ink); outline-offset: 2px; }

.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.field { position: relative; }
.field--wide { grid-column: 1 / -1; }
.field input, .field textarea, .field select {
  display: block;
  width: 100%;
  padding: 24px 16px 8px;
  border: 1px solid #e3ded3;
  border-radius: 0;
  background-color: #fbfaf7;
  font-size: 16px;
  color: var(--ink);
  transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
  appearance: none;
}
.field textarea { min-height: 140px; resize: vertical; }
.field select { padding-right: 40px; cursor: pointer; background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(-45deg, transparent 50%, var(--ink) 50%); background-position: calc(100% - 22px) 26px, calc(100% - 16px) 26px; background-size: 6px 6px; background-repeat: no-repeat; }
.field label {
  position: absolute;
  top: 16px;
  left: 17px;
  margin: 0;
  font-size: 15px;
  color: var(--muted);
  pointer-events: none;
  transform-origin: left top;
  transition: transform 0.2s var(--ease), color 0.2s;
}
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--brand); background-color: #fff; box-shadow: 0 0 0 3px rgba(255, 182, 0, 0.2); outline: none; }
.field input:focus + label, .field input:not(:placeholder-shown) + label,
.field textarea:focus + label, .field textarea:not(:placeholder-shown) + label,
.field--select label { color: #8a6100; font-weight: 700; transform: translateY(-9px) scale(0.78); }
.field input:user-invalid { border-color: #c62828; }
.quote-submit { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 22px; padding: 17px 24px; font-size: 16px; }
.quote-submit i { transition: transform 0.3s var(--ease); }
.quote-submit:hover i { transform: translateX(5px); }
.quote-note { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 14px 0 0; font-size: 13.5px; color: var(--muted); }
.quote-note i { color: #c98f00; }
.form-status { margin: 16px 0 0; font-weight: 600; }
.form-status:empty { display: none; }
.form-status.is-success { padding: 14px 16px; border-left: 4px solid #1b7f3b; background: #eef8f1; color: #1b7f3b; }
.form-status.is-error { padding: 14px 16px; border-left: 4px solid #c62828; background: #fdeeee; color: #c62828; }
.hp-field { position: absolute; left: -9999px; }

.contact-map { position: relative; }
.contact-map iframe { display: block; width: 100%; height: 480px; border: 0; filter: grayscale(0.35) contrast(1.05); }
.contact-map .container { position: absolute; inset: 0; pointer-events: none; display: flex; align-items: center; }
.map-card { display: flex; gap: 18px; max-width: 380px; padding: 28px 30px; border-left: 5px solid var(--brand); background: #fff; box-shadow: 0 24px 50px rgba(0, 0, 0, 0.18); pointer-events: auto; }
.map-card-icon { display: grid; place-items: center; flex: none; width: 56px; height: 56px; background: #fff5dc; }
.map-card-icon .line-icon { color: #c98f00; }
.map-card h3 { margin: 6px 0 6px; font: 800 22px "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.map-card p { margin-bottom: 16px; color: var(--muted); line-height: 1.6; }

@media (max-width: 991px) {
  .contact-section { padding: 60px 0 70px; }
  .contact-map .container { position: static; display: block; pointer-events: auto; }
  .map-card { max-width: none; margin: -60px 0 0; position: relative; }
}
@media (max-width: 575px) {
  .contact-panel, .quote-card { padding: 32px 22px 30px; }
  .contact-list li { gap: 14px; }
  .contact-list-icon { width: 48px; height: 48px; }
  .contact-list-text, .contact-list-text a { font-size: 16.5px; }
  .field-grid { grid-template-columns: 1fr; }
  .svc-chip-list { grid-template-columns: 1fr 1fr; }
  .contact-map iframe { height: 340px; }
}

.faq-search { position: relative; margin-bottom: 30px; }
.faq-search i { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); color: var(--brand-dark); }
.faq-search input { height: 56px; padding-left: 48px; border: 2px solid #ebebeb; border-radius: 0; font-size: 16px; color: #303030; }
.faq-search input:focus { border-color: var(--brand); box-shadow: none; }
.faq-search input::placeholder { color: #6b6b6b; opacity: 1; }
.faq-group-title { font-size: 24px; line-height: 1.2; margin-bottom: 20px; }
.faq-empty { padding: 18px 20px; background: var(--paper); border-left: 4px solid var(--brand); }
mark.faq-hit { background: rgba(255, 182, 0, 0.35); padding: 0 2px; }

.footer { position: relative; }
.footer-skyline-wrap { position: relative; z-index: 1; line-height: 0; color: var(--brand); opacity: 0.35; padding-top: 30px; }
.footer-skyline { display: block; width: 100%; height: 110px; }
.hazard-stripe {
  position: relative;
  z-index: 1;
  height: 8px;
  background: repeating-linear-gradient(-45deg, var(--brand) 0 14px, var(--ink) 14px 28px);
}
@media (max-width: 767px) {
  .footer-skyline { height: 80px; }
  .copyright { padding: 20px 0 18px; }
  .copyright-info { margin-bottom: 10px; text-align: center; line-height: 1.6; }
  .footer-menu ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; margin: 0; }
  .footer-menu ul li { padding: 0; line-height: 1.6; }
}

.scroll-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 10001; pointer-events: none; }
.scroll-progress span { display: block; height: 100%; background: var(--brand); transform-origin: 0 50%; transform: scaleX(0); }
#back-to-top .btn.btn-primary {
  position: relative;
  width: 48px;
  height: 48px;
  line-height: 48px;
  border-radius: 50%;
  clip-path: none;
}
#back-to-top .btn.btn-primary::after { display: none; }
.progress-ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.progress-ring circle {
  fill: none;
  stroke: var(--brand);
  stroke-width: 3;
  stroke-dasharray: 1;
  stroke-dashoffset: var(--progress-offset, 1);
}

@media (prefers-reduced-motion: reduce) {
  .js .draw :is(path, rect, circle, line, polyline, ellipse), .js .draw-group :is(path, rect, circle, line, polyline, ellipse) { stroke-dashoffset: 0; transition: none; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }

  .idle, .idle *, .m-tap, .m-hammer, .m-slide, .m-bob, .m-swing, .m-spin, .m-redraw, .cloud, .win-light,
  .hoist-bucket, .hoist-rope, .sky-window, .sky-star, .sky-car { animation: none !important; }
  .js .draw .idle, .js .draw-group .idle { opacity: 1; }
}

@media (max-width: 991px) {
  .stepper-track { display: none; }
  .stepper-steps { grid-template-columns: repeat(2, 1fr); row-gap: 24px; }
}
@media (max-width: 767px) {
  .heading-block { margin-bottom: 40px; }
  .banner-area--angled { min-height: 300px; clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%); }
  .stepper-panel { padding: 24px; }

  #back-to-top .btn.btn-primary { width: 44px; height: 44px; line-height: 44px; }
}
@media (max-width: 575px) {

  .heading-lead { font-size: 15.5px; }
}

.draw.is-drawn .idle-pulse { transform-origin: 32px 44px; animation: idle-pulse 2.4s 1.7s ease-in-out infinite; }
.draw.is-drawn .m-bob-late { animation-delay: 2.5s; }
.draw.is-drawn .m-wiggle { transform-origin: 32px 24px; animation: idle-wiggle 3s 1.7s ease-in-out infinite; }
.draw.is-drawn .idle-rays, .draw.is-drawn .idle-ring { animation: idle-blink 1.6s 1.7s ease-in-out infinite; }
.draw.is-drawn .m-flip { transform-origin: 32px 32px; animation: idle-flip 3.2s 1.7s ease-in-out infinite; }
.draw.is-drawn .m-hammer { transform-origin: 54px 20px; animation: idle-hammer 1.6s 1.7s ease-in infinite; }
.draw.is-drawn .m-shake { transform-origin: 32px 32px; animation: idle-shake 3s 1.7s ease-in-out infinite; }
.draw.is-drawn .m-bounce { animation: idle-bounce 1.8s 1.7s ease-in-out infinite; }
.draw.is-drawn .idle-shadow { transform-origin: 32px 59px; animation: idle-shadow 1.8s 1.7s ease-in-out infinite; }
@keyframes idle-pulse { 0%, 100% { opacity: 0; transform: scale(0.6); } 40%, 70% { opacity: 1; transform: scale(1); } }
@keyframes idle-wiggle { 0%, 70%, 100% { transform: rotate(0); } 78% { transform: rotate(-8deg); } 86% { transform: rotate(6deg); } 94% { transform: rotate(-3deg); } }
@keyframes idle-blink { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }
@keyframes idle-flip { 0%, 60%, 100% { transform: scaleX(1); } 70%, 90% { transform: scaleX(0.1); } 80% { transform: scaleX(1); } }
@keyframes idle-hammer { 0%, 100% { transform: rotate(0); } 30% { transform: rotate(-24deg); } 45% { transform: rotate(6deg); } 55% { transform: rotate(0); } }
@keyframes idle-shake { 0%, 64%, 100% { transform: rotate(0); } 68%, 76%, 84% { transform: rotate(-10deg); } 72%, 80%, 88% { transform: rotate(10deg); } }
@keyframes idle-bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes idle-shadow { 0%, 100% { opacity: 0.7; transform: scaleX(1); } 50% { opacity: 0.4; transform: scaleX(0.55); } }

.subscribe-icon .line-icon { color: var(--ink); }

.banner-crane-wrap { position: absolute; right: 4%; bottom: 0; height: 96%; color: var(--brand); opacity: 0.55; pointer-events: none; }
.banner-crane { display: block; height: 100%; width: auto; overflow: visible; }
.crane-trolley { animation: crane-trolley 10s ease-in-out infinite alternate; }
.crane-hook { transform-box: view-box; transform-origin: 245px 90px; animation: crane-swing 2.6s ease-in-out infinite alternate; }
@keyframes crane-trolley { from { transform: translateX(0); } to { transform: translateX(-140px); } }
@keyframes crane-swing { from { transform: rotate(-5deg); } to { transform: rotate(5deg); } }

.marquee-band { position: relative; padding: 80px 0; overflow: hidden; background: #fff; }

@keyframes marquee { to { transform: translateX(-50%); } }

.room-designer { padding: 100px 0; }
.room { max-width: 980px; margin: 0 auto; }
.room-stage {
  position: relative;
  overflow: hidden;
  border: 3px solid var(--ink);
  background: #fff;
  box-shadow: var(--shadow);
  cursor: ew-resize;
  touch-action: pan-y;
  user-select: none;
}
.room-svg { display: block; width: 100%; height: auto; }

.room-canvas { position: absolute; inset: 0; }
.room-canvas canvas { display: block; width: 100% !important; height: 100% !important; }
.room.is-3d .room-svg { visibility: hidden; }
.room.is-3d .room-svg * { animation: none !important; }
.room-svg .wall { fill: var(--wall-color); transition: fill 0.5s; }
.room[data-floor="hardwood"] .floor:not(.floor-hardwood),
.room[data-floor="tile"] .floor:not(.floor-tile),
.room[data-floor="stone"] .floor:not(.floor-stone) { display: none; }
.room-svg :is(.room-glow, .room-fire, .room-plant) { transform-box: view-box; }
.room-glow { opacity: 0.22; transform-origin: 400px 96px; animation: room-glow 3s ease-in-out infinite; }
.room-fire { transform-origin: 520px 318px; animation: room-fire 0.9s ease-in-out infinite alternate; }
.room-plant { transform-origin: 705px 405px; animation: room-plant 4.5s ease-in-out infinite; }
.room-dust circle { animation: room-dust 6s ease-in-out infinite; }
.room-dust circle:nth-child(2n) { animation-delay: -2s; }
.room-dust circle:nth-child(3n) { animation-delay: -4s; }
@keyframes room-glow { 0%, 100% { opacity: 0.08; transform: scale(0.85); } 50% { opacity: 0.18; transform: scale(1.04); } }
@keyframes room-fire { from { transform: scaleY(0.88) skewX(-4deg); } to { transform: scaleY(1.12) skewX(4deg); } }
@keyframes room-plant { 0%, 100% { transform: rotate(-2deg); } 50% { transform: rotate(2.5deg); } }
@keyframes room-dust { 0%, 100% { transform: translateY(0); opacity: 0.2; } 50% { transform: translateY(-14px); opacity: 0.9; } }

.room-handle { position: absolute; top: 0; bottom: 0; left: 50%; width: 4px; margin-left: -2px; background: var(--brand); outline: none; }
.room-handle-knob {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border: 3px solid var(--ink);
  border-radius: 50%;
  background: var(--brand);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
  transform: translate(-50%, -50%);
}
.room-handle-knob .line-icon { color: var(--ink); }
.room:not(.is-touched) .room-handle-knob { animation: knob-hint 2.4s ease-in-out infinite; }
.room-handle:focus-visible .room-handle-knob { outline: 3px dashed var(--ink); outline-offset: 4px; }
@keyframes knob-hint { 0%, 100% { transform: translate(-50%, -50%); } 30% { transform: translate(-80%, -50%); } 60% { transform: translate(-20%, -50%); } }
.room-tag {
  position: absolute;
  top: 14px;
  padding: 5px 12px;
  background: var(--ink);
  color: #fff;
  font: 700 12px/1.2 "Barlow", "Barlow Fallback", sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  pointer-events: none;
}
.room-tag-after { left: 14px; background: var(--brand); color: var(--ink); }
.room-tag-before { right: 14px; }
.room-controls { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px; margin-top: 24px; }
.room-control-label { display: block; margin-bottom: 8px; font: 700 14px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 1px; text-transform: uppercase; color: var(--ink); }
.room-control-label strong { color: #8a6100; }
.swatches, .floor-options { display: flex; flex-wrap: wrap; gap: 10px; }
.swatch {
  width: 36px;
  height: 36px;
  padding: 0;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--c);
  box-shadow: 0 0 0 1px #d6d1c4;
  cursor: pointer;
  transition: transform 0.2s var(--ease), box-shadow 0.2s;
}
.swatch:hover { transform: scale(1.12); }
.swatch[aria-checked="true"] { box-shadow: 0 0 0 3px var(--ink); transform: scale(1.12); }
.floor-option { padding: 8px 16px; border: 2px solid #ddd; background: #fff; color: var(--ink); font: 700 14px "Barlow", "Barlow Fallback", sans-serif; cursor: pointer; }
.floor-option[aria-checked="true"] { border-color: var(--ink); background: var(--ink); color: #fff; }

.explore-3d { padding: 100px 0; background: radial-gradient(ellipse at 40% 45%, #fff8e6 0%, #fff 62%); }
.house3d {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 11;
  border: 3px solid var(--ink);
  background:
    linear-gradient(rgba(255, 182, 0, 0.08) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(90deg, rgba(255, 182, 0, 0.08) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(#fbfaf6, #efece4);
  box-shadow: var(--shadow);
}

.house3d::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(1.5px 1.5px at 8% 14%, #fff 50%, transparent 52%), radial-gradient(1px 1px at 22% 30%, #fff 50%, transparent 52%),
    radial-gradient(1.5px 1.5px at 37% 9%, #fff 50%, transparent 52%), radial-gradient(1px 1px at 55% 22%, #fff 50%, transparent 52%),
    radial-gradient(1.5px 1.5px at 71% 12%, #fff 50%, transparent 52%), radial-gradient(1px 1px at 86% 26%, #fff 50%, transparent 52%),
    radial-gradient(1px 1px at 93% 8%, #fff 50%, transparent 52%), radial-gradient(1px 1px at 63% 36%, #fff 50%, transparent 52%),
    radial-gradient(circle at 82% 16%, rgba(255, 244, 214, 0.9) 0 18px, rgba(255, 244, 214, 0.12) 19px 60px, transparent 61px),
    linear-gradient(#0b1630, #1b2a4a 60%, #2c3346);
  opacity: 0;
  transition: opacity 1.4s;
  pointer-events: none;
}
.house3d.is-night::before { opacity: 1; }
.house3d-canvas { position: absolute; inset: 0; }
.house3d-canvas canvas { display: block; width: 100% !important; height: 100% !important; cursor: grab; }
.house3d-canvas canvas:active { cursor: grabbing; }
.house3d-hotspots { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity 0.6s; }
.house3d-hotspots.is-ready { opacity: 1; }
.house3d-hotspot {
  position: absolute;
  left: 0;
  top: 0;
  width: 22px;
  height: 22px;
  margin: -11px 0 0 -11px;
  padding: 0;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--brand);
  pointer-events: auto;
  cursor: pointer;
  animation: hotspot-pulse 2s infinite;
}
.house3d-hotspot.is-active { background: var(--ink); border-color: var(--brand); }
@keyframes hotspot-pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 182, 0, 0.7); } 70% { box-shadow: 0 0 0 14px rgba(255, 182, 0, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 182, 0, 0); } }
.house3d-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font: 700 15px "Barlow", "Barlow Fallback", sans-serif;
  color: var(--ink);
  transition: opacity 0.4s;
}
.house3d.is-loaded .house3d-loading { opacity: 0; pointer-events: none; }
.house3d-spinner { width: 22px; height: 22px; border: 3px solid var(--brand); border-top-color: transparent; border-radius: 50%; animation: idle-spin 0.8s linear infinite; }
.house3d-hint { position: absolute; left: 12px; bottom: 12px; padding: 6px 12px; background: rgba(27, 27, 27, 0.78); color: #fff; font: 600 13px "Barlow", "Barlow Fallback", sans-serif; pointer-events: none; }
.house3d-rebuild { position: absolute; right: 12px; bottom: 12px; padding: 7px 14px; border: 0; background: var(--ink); color: #fff; font: 700 13px "Barlow", "Barlow Fallback", sans-serif; cursor: pointer; }
.house3d-rebuild:hover { background: var(--brand); color: var(--ink); }
.house3d-toolbar { position: absolute; top: 12px; left: 12px; z-index: 3; display: flex; gap: 6px; opacity: 0; transform: translateY(-6px); transition: opacity 0.5s, transform 0.5s var(--ease); }
.house3d.is-loaded .house3d-toolbar { opacity: 1; transform: none; }
.house3d-tool {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 12px;
  border: 0;
  background: rgba(27, 27, 27, 0.82);
  color: #fff;
  font: 700 13px "Barlow", "Barlow Fallback", sans-serif;
  cursor: pointer;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  transition: background 0.25s, color 0.25s;
}
.house3d-tool i { color: var(--brand); transition: color 0.25s; }
.house3d-tool:hover { background: var(--ink); }
.house3d-tool[aria-pressed="true"] { background: var(--brand); color: var(--ink); }
.house3d-tool[aria-pressed="true"] i { color: var(--ink); }
.house3d-back { position: absolute; top: 12px; right: 12px; z-index: 3; padding: 7px 14px; border: 0; background: #fff; color: var(--ink); font: 700 13px "Barlow", "Barlow Fallback", sans-serif; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15); cursor: pointer; }
.house3d-back i { margin-right: 4px; color: var(--brand-dark); }
.house3d-back:hover { background: var(--brand); }
.house3d-back[hidden] { display: none; }
.house3d-state { position: absolute; top: 54px; left: 12px; z-index: 3; padding: 5px 10px; background: #c0392b; color: #fff; font: 700 11px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 1.5px; text-transform: uppercase; opacity: 0; transition: opacity 0.4s; pointer-events: none; }
.house3d.is-before .house3d-state { opacity: 1; }
.house3d.is-night .house3d-hint { background: rgba(255, 255, 255, 0.14); }
.house3d-fallback { display: none; }
.house3d.no-webgl .house3d-fallback { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 14px; align-items: center; justify-content: center; margin: 0; padding: 30px; text-align: center; }
.house3d-fallback-art { width: 34%; max-width: 220px; }
.house3d-fallback p { margin: 0; max-width: 420px; }
.house3d.no-webgl :is(.house3d-loading, .house3d-hint, .house3d-rebuild, .house3d-toolbar, .house3d-back) { display: none; }
.house3d-panel { padding: 30px; background: #fff; border-top: 4px solid var(--brand); box-shadow: var(--shadow); }
.house3d-info h3 { margin: 6px 0 10px; font: 800 26px/1.15 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.house3d-info .line-icon { color: var(--brand); }
.house3d-info:not([hidden]) { animation: panel-in 0.45s var(--ease); }
.house3d-links { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 16px; }
.house3d-links .btn { padding: 10px 18px; font-size: 13px; white-space: nowrap; }
.house3d-more { font-weight: 700; color: var(--ink); }
.house3d-parts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; padding-top: 20px; border-top: 1px dashed #ddd; }
.house3d-part { padding: 6px 12px; border: 2px solid #e5e1d8; background: #fff; color: var(--ink); font: 700 13px "Barlow", "Barlow Fallback", sans-serif; cursor: pointer; transition: background 0.2s, border-color 0.2s; }
.house3d-part:hover, .house3d-part[aria-pressed="true"] { border-color: var(--brand); background: var(--brand); }

.nail-game-section { padding: 90px 0; }
@media (max-width: 575px) {
  .error-page .error-code h2 { font-size: clamp(110px, 52vw, 200px); line-height: 1; }
  .nail-game-section { padding: 70px 0; }
}
.nail-game { max-width: 720px; margin: 0 auto; text-align: center; }
.nail-game-svg { width: 100%; height: auto; overflow: visible; user-select: none; }
.nail { cursor: pointer; outline: none; }
.nail.is-done { cursor: default; }
.nail-body { transition: transform 0.18s cubic-bezier(0.3, 1.6, 0.5, 1); }
.nail:focus-visible .nail-body path { stroke: var(--brand); stroke-width: 3; }
.hammer { opacity: 0; transition: opacity 0.3s 0.35s; pointer-events: none; }
.hammer.is-swinging { opacity: 1; transition: none; }
.hammer-swing { transform-box: fill-box; transform-origin: 100% 60%; }
.hammer.is-swinging .hammer-swing { animation: hammer-swing 0.28s ease-in both; }
.nail-game-svg.is-shaking { animation: board-shake 0.15s; }
@keyframes hammer-swing { 0% { transform: rotate(38deg); } 70% { transform: rotate(-4deg); } 100% { transform: rotate(0); } }
@keyframes board-shake { 50% { transform: translateY(2px); } }
.nail-score { margin-top: 16px; font: 700 18px "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.nail-win { margin-top: 10px; animation: panel-in 0.5s var(--ease); }
.nail-win h3 { font: 800 26px "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.nail-win .btn { margin: 6px; }
.confetti-piece {
  position: fixed;
  top: -16px;
  z-index: 10002;
  width: 8px;
  height: 14px;
  pointer-events: none;
  animation: confetti-fall 1.8s ease-in forwards;
}
@keyframes confetti-fall { to { transform: translate(var(--dx), 105vh) rotate(var(--rot)); } }

[data-tilt].tilt-on { position: relative; transition: transform 0.45s var(--ease); will-change: transform; }
[data-tilt].is-tilting { transition: transform 0.08s linear; z-index: 2; }
.tilt-glare {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: radial-gradient(circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, 0.4), transparent 55%);
  opacity: 0;
  transition: opacity 0.3s;
}
.is-tilting > .tilt-glare { opacity: 1; }

@media (max-width: 991px) {
  .banner-crane-wrap { display: none; }
  .house3d { aspect-ratio: 4 / 3; }

}
@media (max-width: 767px) {

  .room-designer, .explore-3d { padding: 70px 0; }
  .house3d { aspect-ratio: 1 / 1; }
  .house3d-tool { padding: 8px 10px; }
  .house3d-tool span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .room-handle-knob { width: 46px; height: 46px; }
  .room-controls { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .m-wiggle, .m-flip, .m-hammer, .m-shake, .m-bounce, .crane-trolley, .crane-hook, .marquee-track,
  .room-glow, .room-fire, .room-plant, .room-dust circle, .room-handle-knob, .house3d-hotspot { animation: none !important; }
}

.top-bar { padding: 7px 0; font-size: 13.5px; }
.top-bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.top-bar ul.top-info { display: flex; flex-wrap: wrap; gap: 4px 26px; margin: 0; padding: 0; list-style: none; }
.top-bar ul.top-info li { padding: 0; line-height: 1.6; }
.top-bar ul.top-info li i { font-size: 13px; top: 0; margin-right: 6px; }
.top-bar .info-text, .top-bar a.info-text { color: #cfcfcf; }
.top-bar a.info-text:hover { color: #fff; text-decoration: none; }
.top-bar .top-social { margin: 0; }
.top-bar .top-social a { padding: 4px 9px; color: var(--brand); font-size: 14px; }
.top-bar .top-social a:hover { color: #fff; }

.site-header { position: relative; z-index: 1000; background: #fff; }
.site-header .main-bar { background: #fff; border-bottom: 1px solid #eee; }
.site-header .navbar { min-height: 84px; }
.site-header .logo { margin: 0; padding: 0; }
.site-header .logo img { height: 46px; width: auto; transition: height 0.3s var(--ease); }

.site-header ul.navbar-nav > li { padding: 0 15px; }
.site-header ul.navbar-nav > li > a {
  position: relative;
  padding: 22px 0 !important;
  color: var(--ink) !important;
  font-size: 15px;
  line-height: 40px;
}
.site-header ul.navbar-nav > li > a::after {
  content: "";
  display: block !important;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 22px;
  height: 3px;
  background: var(--brand);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--ease);
}
.site-header ul.navbar-nav > li:hover > a::after,
.site-header ul.navbar-nav > li.active > a::after { transform: scaleX(1); }
.site-header ul.navbar-nav > li:hover > a,
.site-header ul.navbar-nav > li.active > a { color: var(--ink) !important; }
.site-header ul.navbar-nav > li > a i { color: var(--brand-dark); }
.site-header .dropdown-menu { margin-top: -6px; }

.header-cta { display: flex; align-items: center; gap: 22px; }
.header-call { display: flex; align-items: center; gap: 12px; color: var(--ink); }
.header-call:hover { color: var(--ink); text-decoration: none; }
.header-call-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #fff5dc;
  transition: background 0.3s;
}
.header-call:hover .header-call-icon { background: var(--brand); }
.header-call-icon .line-icon { color: var(--ink); }
.header-call-text { display: flex; flex-direction: column; line-height: 1.2; }
.header-call-text small { font-size: 12px; color: var(--muted); }
.header-call-text strong { font: 800 18px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 0.3px; color: var(--ink); }
.header-quote { padding: 13px 24px; font-size: 14px; }

.site-header.is-stuck .main-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  box-shadow: 0 10px 30px rgba(27, 27, 27, 0.1);
  animation: header-drop 0.35s var(--ease);
}
.site-header.is-stuck .navbar { min-height: 68px; }
.site-header.is-stuck .logo img { height: 38px; }
.site-header.is-stuck ul.navbar-nav > li > a { padding: 14px 0 !important; }
.site-header.is-stuck ul.navbar-nav > li > a::after { bottom: 14px; }
@keyframes header-drop { from { transform: translateY(-100%); } to { transform: none; } }

.scroll-progress { z-index: 10001; }

@media (max-width: 1199px) {
  .header-call-text { display: none; }
  .site-header ul.navbar-nav > li { padding: 0 10px; }
  .site-header .logo img { height: 40px; }
}
@media (max-width: 991px) {
  .site-header .navbar { min-height: 70px; flex-wrap: wrap; }
  .header-mobile-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
  .header-call-mobile {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff5dc;
  }
  .header-call-mobile .line-icon { color: var(--ink); }
  .site-header .navbar-toggler { margin: 0; padding: 7px; }
  .site-header .navbar-collapse { flex-basis: 100%; padding-bottom: 16px; }

  .site-header.is-stuck .navbar-collapse { max-height: calc(100vh - 68px); max-height: calc(100dvh - 68px); overflow-y: auto; overscroll-behavior: contain; }
  .site-header ul.navbar-nav > li { padding: 0; border-bottom: 1px solid #f0f0f0; }
  .site-header ul.navbar-nav > li > a { padding: 6px 0 !important; }
  .site-header ul.navbar-nav > li > a::after { display: none !important; }
  .site-header ul.navbar-nav > li > a i { background: var(--ink); color: var(--brand); }
  .header-cta { flex-direction: column; align-items: stretch; gap: 12px; margin-top: 14px; }
  .header-call-text { display: flex; }
  .header-quote { text-align: center; }
}
@media (max-width: 767px) {
  .site-header.is-stuck .navbar-collapse { max-height: calc(100vh - 124px); max-height: calc(100dvh - 124px); }
}
@media (max-width: 575px) {

  .top-bar { padding: 6px 0; }
  .top-bar-inner { gap: 10px; }
  .top-bar ul.top-info { flex-wrap: nowrap; min-width: 0; }
  .top-bar ul.top-info li { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12.5px; }
  .top-bar .top-social { flex: none; }
  .top-bar .top-social li { display: flex; }
  .top-bar .top-social a { padding: 4px 7px; }
  .site-header .logo img { height: 36px; }
}

.draw.is-drawn .m-spin-clock { transform-origin: 32px 32px; animation: idle-spin 8s 1.7s linear infinite; }
.draw.is-drawn .m-gear { transform-origin: 32px 41px; animation: idle-spin 14s 1.7s linear infinite; }
.ts-facts-img .line-icon { width: 64px; height: 64px; }
.ts-facts-title { text-transform: uppercase; letter-spacing: 0.4px; font-size: 16px; }
@media (max-width: 575px) {

  .facts-area .ts-facts { flex: 0 0 50%; max-width: 50%; padding: 0 8px; }
  .facts-area .ts-facts:nth-child(2) { margin-top: 0 !important; }
  .facts-area .ts-facts:nth-child(n+3) { margin-top: 40px !important; }
  .ts-facts-img .line-icon { width: 52px; height: 52px; }
  .ts-facts .ts-facts-content .ts-facts-num { margin: 16px 0 8px; font-size: 36px; }
  .ts-facts .ts-facts-content .ts-facts-title { font-size: 13.5px; line-height: 1.35; }
}
@media (prefers-reduced-motion: reduce) { .m-spin-clock, .m-gear { animation: none !important; } }

.about-home { position: relative; overflow: hidden; padding: 100px 0 90px; }
.about-dots {
  position: absolute;
  top: 40px;
  left: -40px;
  width: 260px;
  height: 260px;
  background: radial-gradient(rgba(255, 182, 0, 0.55) 1.6px, transparent 1.8px) 0 0 / 18px 18px;
  -webkit-mask-image: radial-gradient(circle at 30% 30%, #000 20%, transparent 70%);
  mask-image: radial-gradient(circle at 30% 30%, #000 20%, transparent 70%);
  pointer-events: none;
}
.about-title { margin: 0 0 22px; font: 800 clamp(30px, 3.6vw, 42px)/1.15 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.about-marker {
  background: linear-gradient(transparent 62%, rgba(255, 182, 0, 0.5) 62%, rgba(255, 182, 0, 0.5) 92%, transparent 92%) no-repeat 0 0 / 0 100%;
  transition: background-size 1s 0.4s var(--ease);
}
.about-intro.aos-animate .about-marker, .no-js .about-marker { background-size: 100% 100%; }
.about-areas { margin: -4px 0 0; padding-left: 21px; font-size: 15px; color: var(--muted); }
.about-lead {
  margin-bottom: 14px;
  padding-left: 18px;
  border-left: 3px solid var(--brand);
  font: 600 19px/1.55 "Barlow", "Barlow Fallback", sans-serif;
  color: var(--ink);
}
.about-copy p { margin: 0; color: var(--muted); line-height: 1.8; }
.about-copy strong { color: var(--ink); }

.about-point-icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 52px;
  height: 52px;
  background: #fff5dc;
  transition: background 0.35s;
}
.about-point-icon .line-icon { color: #c98f00; }

.about-point:hover .about-point-icon :is(path, rect, circle, line, polyline, ellipse) { animation: redraw 1s var(--ease); }

.about-foot { display: flex; align-items: center; gap: 28px; margin-top: 34px; }

.about-link { font: 700 15px "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); text-transform: uppercase; letter-spacing: 0.5px; }
.about-link i { margin-left: 6px; color: var(--brand-dark); transition: transform 0.3s var(--ease); }
.about-link:hover { color: var(--ink); text-decoration: none; }
.about-link:hover i { transform: translateX(5px); }

.process-panel {
  position: relative;
  overflow: hidden;
  padding: 44px 42px 30px;
  background: #fff;
  border-top: 4px solid var(--brand);
  box-shadow: 0 24px 60px rgba(27, 27, 27, 0.09);
}
.process-panel::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 220px;
  height: 180px;
  background:
    linear-gradient(rgba(27, 27, 27, 0.06) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(90deg, rgba(27, 27, 27, 0.06) 1px, transparent 1px) 0 0 / 22px 22px;
  -webkit-mask-image: radial-gradient(circle at 100% 0, #000 10%, transparent 70%);
  mask-image: radial-gradient(circle at 100% 0, #000 10%, transparent 70%);
  pointer-events: none;
}
.process-panel > * { position: relative; }
.process-panel-title { margin: 0 0 12px; font: 800 clamp(28px, 3vw, 36px)/1.15 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.process-panel-lead { margin-bottom: 26px; color: var(--muted); line-height: 1.75; }

.accordion-steps .card {
  position: relative;
  margin: 0;
  padding-left: 62px;
  overflow: visible;
  border: 0 !important;
  background: none;
}
.accordion-steps .card:not(:last-child)::before {
  content: "";
  position: absolute;
  top: 50px;
  bottom: 4px;
  left: 21px;
  border-left: 2px dashed #e2e2e2;
}
.accordion-steps .card-header { border: 0; }
.accordion-steps .card-header .btn {
  position: static;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid #efefef;
  font: 700 17px/1.3 "Barlow", "Barlow Fallback", sans-serif;
  letter-spacing: 0.4px;
  color: var(--ink);
  box-shadow: none !important;
}
.accordion-steps .card-header .btn:hover { color: #8a6100; }
.accordion-steps .card-header .btn[aria-expanded=true] { color: var(--ink); box-shadow: none; border-bottom-color: transparent; }
.acc-num {
  position: absolute;
  top: 6px;
  left: 0;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 2px solid #e2e2e2;
  border-radius: 50%;
  background: #fff;
  font: 800 15px/1 "Barlow", "Barlow Fallback", sans-serif;
  color: #9a9a9a;
  transition: background 0.35s, border-color 0.35s, color 0.35s, transform 0.35s var(--ease);
}
.btn[aria-expanded=true] .acc-num { background: var(--brand); border-color: var(--brand); color: var(--ink); transform: scale(1.08); box-shadow: 0 0 0 6px rgba(255, 182, 0, 0.18); }
.btn:hover .acc-num { border-color: var(--brand); color: var(--ink); }
.acc-toggle { position: relative; flex: none; width: 14px; height: 14px; }
.acc-toggle::before, .acc-toggle::after {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  width: 14px;
  height: 2px;
  background: currentColor;
  transition: transform 0.35s var(--ease);
}
.acc-toggle::after { transform: rotate(90deg); }
.btn[aria-expanded=true] .acc-toggle::after { transform: rotate(0deg); }
.btn[aria-expanded=true] .acc-toggle { color: var(--brand-dark); }
.accordion-steps .card-body { padding: 2px 0 20px; color: var(--muted); line-height: 1.75; }

@media (min-width: 992px) {
  .about-home .row > .col-lg-6:last-child { align-self: center; }
}
@media (max-width: 991px) {
  .about-home { padding: 70px 0 60px; }
}
@media (max-width: 575px) {

  .about-foot { flex-direction: column; align-items: flex-start; gap: 18px; }
  .process-panel { padding: 34px 22px 20px; }
  .accordion-steps .card { padding-left: 54px; }
  .accordion-steps .card:not(:last-child)::before { left: 19px; }
  .acc-num { width: 40px; height: 40px; }
}

.quote-body { display: block; }
.js .quote-body.is-clamped:not(.is-open) { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.read-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 0;
  border: 0;
  background: none;
  font: 700 13px/1 "Barlow", "Barlow Fallback", sans-serif;
  font-style: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #8a6100;
  cursor: pointer;
}
.read-more::after { content: ""; width: 7px; height: 7px; border: solid currentColor; border-width: 0 2px 2px 0; transform: translateY(-2px) rotate(45deg); transition: transform 0.3s; }
.read-more[aria-expanded="true"]::after { transform: translateY(2px) rotate(-135deg); }
.read-more:hover { color: var(--ink); }

.reviews-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px 40px;
  padding: 28px 36px;
  border-left: 6px solid var(--brand);
  background: var(--ink);
  color: #cfcfcf;
}
.reviews-score { display: grid; grid-template-columns: auto auto; align-items: center; column-gap: 16px; row-gap: 4px; }
.reviews-score strong { grid-row: span 2; font: 800 58px/1 "Barlow", "Barlow Fallback", sans-serif; color: #fff; }
.reviews-score small { font: 600 13px/1.3 "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 1px; text-transform: uppercase; color: #a8a8a8; }

.about-values { display: grid; gap: 14px; margin-top: 28px; }
.about-value {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 18px 14px 14px;
  border: 1px solid #ececec;
  background: #fff;
  transition: transform 0.35s var(--ease), box-shadow 0.35s, border-color 0.35s;
}
.about-value h3 { margin: 0 0 2px; font: 700 18px/1.3 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.about-value p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.5; }
.about-value:hover { transform: translateY(-3px); border-color: transparent; box-shadow: var(--shadow); }
.about-value:hover .about-point-icon { background: var(--brand); }
.about-value:hover .about-point-icon .line-icon { color: var(--ink); }

@media (max-width: 991px) {

  .reviews-summary { display: grid; grid-template-columns: auto 1fr 1fr; gap: 22px 32px; }

  .reviews-summary .btn { grid-column: 1 / -1; text-align: center; }
}
@media (max-width: 767px) {
  .reviews-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 24px 22px; }
  .reviews-score { grid-column: 1 / -1; }

  .reviews-summary .btn { grid-column: 1 / -1; text-align: center; }
}

.reviews-section { position: relative; overflow: hidden; padding: 100px 0 80px; background: #fff; }
.reviews-summary { margin-bottom: 46px; }

.review-marquee { display: grid; gap: 10px; }
.review-row {
  overflow: hidden;
  padding: 12px 0 26px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.review-track { display: flex; width: max-content; animation: review-glide var(--glide, 60s) linear infinite; }
.review-row--reverse .review-track { animation-direction: reverse; }
.review-row:hover .review-track, .review-row:focus-within .review-track, .review-row.is-paused .review-track { animation-play-state: paused; }
.review-set { display: flex; align-items: stretch; gap: 24px; padding-right: 24px; }
@keyframes review-glide { to { transform: translateX(-50%); } }

.review-card {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 360px;
  margin: 0;
  padding: 26px 26px 22px;
  border: 1px solid #ececec;
  background: #fff;
  box-shadow: 0 10px 30px rgba(27, 27, 27, 0.06);
  transition: transform 0.4s var(--ease), box-shadow 0.4s, border-color 0.4s;
}
.review-card::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  height: 3px;
  background: var(--brand);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s var(--ease);
}
.review-card:hover { transform: translateY(-6px); border-color: rgba(255, 182, 0, 0.5); box-shadow: 0 22px 44px rgba(27, 27, 27, 0.12); }
.review-card:hover::before { transform: scaleX(1); }
.review-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; }
.review-mark { height: 30px; font: 800 72px/0.85 Georgia, serif; color: var(--brand); opacity: 0.45; }
.review-text { flex: 1; margin: 0 0 20px; padding: 0; border: 0; background: none; font-size: 16px; font-style: normal; line-height: 1.7; color: #555; }
.review-text::before { content: none; }
.js .review-text .quote-body.is-clamped:not(.is-open) { -webkit-line-clamp: 6; }
.review-author { display: flex; align-items: center; gap: 14px; margin: 0; padding-top: 18px; border-top: 1px dashed #e2e2e2; }
.review-avatar { flex: none; width: 52px; height: 52px; border-radius: 50%; box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--brand); }
.review-who strong { display: block; font: 700 17px/1.25 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.review-who small { font-size: 13px; color: var(--muted); }

.review-stars {
  position: relative;
  display: inline-block;
  width: 100px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath fill='%23DADADA' d='M10 .8l2.7 5.5 6 .9-4.4 4.2 1 6L10 14.6l-5.3 2.8 1-6L1.3 7.2l6-.9z'/%3E%3C/svg%3E") repeat-x 0 0 / 20px 18px;
}
.review-stars::before {
  content: "";
  position: absolute;
  inset: 0;
  width: calc(var(--rating, 5) / 5 * 100%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath fill='%23FFB600' d='M10 .8l2.7 5.5 6 .9-4.4 4.2 1 6L10 14.6l-5.3 2.8 1-6L1.3 7.2l6-.9z'/%3E%3C/svg%3E") repeat-x 0 0 / 20px 18px;
}
.review-stars--lg { width: 130px; height: 23.4px; background-size: 26px 23.4px; }
.review-stars--lg::before { background-size: 26px 23.4px; }
.reviews-summary .review-stars { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath fill='%23444444' d='M10 .8l2.7 5.5 6 .9-4.4 4.2 1 6L10 14.6l-5.3 2.8 1-6L1.3 7.2l6-.9z'/%3E%3C/svg%3E"); }

.reviews-hint { margin: 18px 0 0; text-align: center; font-size: 14px; color: var(--muted); }

@media (max-width: 991px) {
  .reviews-section { padding: 70px 0 60px; }
}
@media (max-width: 575px) {
  .review-card { width: 290px; padding: 22px 20px 18px; }
  .review-set { gap: 16px; padding-right: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .review-track { animation: none; }
  .review-row { overflow-x: auto; scroll-snap-type: x mandatory; -webkit-mask-image: none; mask-image: none; }
  .review-set[aria-hidden] { display: none; }
  .review-card { scroll-snap-align: start; }
}

.svc-row-wrap { margin-bottom: 16px; }
.svc-row {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 18px 20px;
  border: 1px solid transparent;
  color: inherit;
  transition: background 0.3s, border-color 0.3s, box-shadow 0.3s, transform 0.35s var(--ease);
}

.svc-row { border-color: #ece7da; background: #fff; box-shadow: 0 8px 22px rgba(27, 27, 27, 0.05); }
.svc-row:hover, .svc-row:focus-visible, .svc-row.is-active {
  border-color: var(--brand);
  background: #fff;
  box-shadow: 0 18px 40px rgba(27, 27, 27, 0.11);
  transform: translateY(-3px);
  color: inherit;
  text-decoration: none;
}

.svc-row { gap: 20px; padding-left: 14px; padding-right: 14px; }

.svc-row-title { gap: 0; }
.svc-row-title i { flex: none; width: 0; margin-left: 6px; overflow: visible; }
.svc-row-thumb { position: relative; flex: none; width: 92px; height: 92px; margin: 2px 0 10px; }
.svc-row-thumb::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid var(--brand);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
  opacity: 0.55;
  transform: translate(8px, 8px);
  transition: opacity 0.35s, transform 0.45s var(--ease);
}
.svc-col--left .svc-row-thumb::before { transform: translate(-8px, 8px); }
.svc-row-photo {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
  background: #eceae4;
  box-shadow: 0 10px 24px rgba(27, 27, 27, 0.14);
}
.svc-row-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(255, 182, 0, 0) 55%, rgba(255, 182, 0, 0.28)); opacity: 0; transition: opacity 0.4s; }
.svc-row-photo img.svc-row-img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(0.8) contrast(1.02); transition: transform 0.8s var(--ease), filter 0.5s; }
.svc-row-badge {
  position: absolute;
  z-index: 2;
  right: -10px;
  bottom: -10px;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  background: var(--brand);
  box-shadow: 0 0 0 4px #fff, 0 8px 18px rgba(27, 27, 27, 0.18);
  transition: transform 0.4s var(--ease), background 0.3s;
}
.svc-col--left .svc-row-badge { right: auto; left: -10px; }
.svc-row-badge .line-icon { color: var(--ink); }
.svc-row:hover .svc-row-thumb::before, .svc-row.is-active .svc-row-thumb::before { opacity: 1; transform: none; }
.svc-row:hover .svc-row-img, .svc-row.is-active .svc-row-img { transform: scale(1.1); filter: none; }
.svc-row:hover .svc-row-photo::after, .svc-row.is-active .svc-row-photo::after { opacity: 1; }
.svc-row:hover .svc-row-badge, .svc-row.is-active .svc-row-badge { transform: rotate(-8deg) scale(1.06); background: var(--ink); }
.svc-row:hover .svc-row-badge .line-icon, .svc-row.is-active .svc-row-badge .line-icon { color: var(--brand); }
.svc-row-text { display: block; }
.svc-row-title { display: flex; align-items: center; gap: 8px; margin: 4px 0 6px; font: 700 19px/1.25 "Barlow", "Barlow Fallback", sans-serif; color: var(--ink); }
.svc-row-title i { font-size: 13px; color: var(--brand-dark); opacity: 0; transform: translateX(-6px); transition: opacity 0.3s, transform 0.3s var(--ease); }
.svc-row:hover .svc-row-title i, .svc-row.is-active .svc-row-title i { opacity: 1; transform: none; }
.svc-row-desc { display: block; font-size: 15px; line-height: 1.65; color: var(--muted); }

.svc-row::after { content: ""; position: absolute; top: 50%; width: 0; height: 2px; background: var(--brand); transition: width 0.4s var(--ease); }
.svc-col--left .svc-row::after { left: 100%; }
.svc-col--right .svc-row::after { right: 100%; }
@media (min-width: 992px) {
  .svc-col--left .svc-row { flex-direction: row-reverse; text-align: right; }
  .svc-col--left .svc-row-title { justify-content: flex-end; }
  .svc-row:hover::after, .svc-row.is-active::after { width: 26px; }
}
@media (min-width: 768px) and (max-width: 991px) {

  .svc-col--art { order: -1; margin-bottom: 30px; }
  .svc-col--art .illustration-wrap--crew { max-width: 330px; }
  .svc-col { flex: 0 0 50%; max-width: 50%; align-self: flex-start; }
  .svc-col--right { margin-top: 0 !important; }
}
@media (max-width: 575px) {
  .svc-row { gap: 16px; padding: 16px 14px; }
  .svc-row { gap: 20px; }
  .svc-row-thumb { width: 78px; height: 78px; }
  .svc-row-badge { width: 30px; height: 30px; right: -8px; bottom: -8px; }
  .svc-row-badge .line-icon { width: 18px; height: 18px; }
}

.illustration-wrap--crew { max-width: 410px; }
.illustration--crew { overflow: visible; }
.ill-crew .w-hammer { transform-origin: 124px 62px; animation: w-hammer 1.15s ease-in-out infinite; }
.ill-crew .w-impact { opacity: 0; animation: w-impact 1.15s linear infinite; }
.ill-crew .w-pull { transform-origin: 340px 135px; animation: w-pull 1.4s ease-in-out infinite; }
.ill-crew .w-roller { transform-origin: 340px 368px; animation: w-roller 2.4s ease-in-out infinite; }
.ill-crew .w-trowel { transform-origin: 340px 446px; animation: w-trowel 1.8s ease-in-out infinite; }
.ill-crew .w-climb { animation: w-climb 9s ease-in-out infinite; }
.ill-paint .w-brick { animation: w-brick 3.6s ease-in-out infinite; }
.crew-rope { transform-origin: 385px 100px; animation: crew-rope 7s ease-in-out infinite alternate; }
.crew-bucket { animation: idle-hoist 7s ease-in-out infinite alternate; }
.bird { animation: idle-drift 34s linear infinite; }
.bird-2 { animation-duration: 46s; animation-delay: -18s; }
.illustration .bird .wing { transform-box: fill-box; transform-origin: 50% 100%; animation: w-flap 0.45s ease-in-out infinite alternate; }

@keyframes w-hammer { 0%, 38% { transform: rotate(-68deg); } 52% { transform: rotate(3deg); } 60% { transform: rotate(-5deg); } 100% { transform: rotate(-68deg); } }
@keyframes w-impact { 0%, 50% { opacity: 0; } 54% { opacity: 1; } 68%, 100% { opacity: 0; } }
@keyframes w-pull { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(10deg) translateY(3px); } }
@keyframes w-roller { 0%, 100% { transform: rotate(-24deg); } 50% { transform: rotate(5deg); } }
@keyframes w-trowel { 0%, 100% { transform: rotate(-10deg); } 50% { transform: rotate(8deg); } }
@keyframes w-climb { 0%, 8% { transform: translate(0, 0); } 46%, 58% { transform: translate(16px, -105px); } 96%, 100% { transform: translate(0, 0); } }
@keyframes w-brick { 0%, 15% { opacity: 0; transform: translateY(-10px); } 35%, 85% { opacity: 1; transform: none; } 100% { opacity: 0; transform: none; } }
@keyframes crew-rope { 0%, 8% { transform: scaleY(1); } 92%, 100% { transform: scaleY(2.38); } }
@keyframes w-flap { from { transform: scaleY(1); } to { transform: scaleY(-0.5); } }

.svc-pin { cursor: pointer; outline: none; }
.svc-pin .pin-dot { fill: var(--brand); stroke: #fff; stroke-width: 2.5; transition: fill 0.25s, stroke 0.25s; }
.svc-pin .pin-pulse { fill: rgba(255, 182, 0, 0.35); transform-box: fill-box; transform-origin: center; animation: pin-pulse 2.4s ease-out infinite; }
.svc-pin .pin-label { opacity: 0; transform-box: fill-box; transform-origin: 50% 100%; transform: translateY(5px) scale(0.92); transition: opacity 0.25s, transform 0.3s var(--ease); pointer-events: none; }
.svc-pin .pin-label rect { fill: var(--ink); }
.svc-pin .pin-label text { fill: #fff; font: 700 12px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 0.3px; }
.svc-pin:hover .pin-label, .svc-pin:focus-visible .pin-label, .svc-pin.is-active .pin-label { opacity: 1; transform: none; }
.svc-pin:hover .pin-dot, .svc-pin:focus-visible .pin-dot, .svc-pin.is-active .pin-dot { fill: var(--ink); stroke: var(--brand); }
.svc-pin.is-active .pin-pulse { animation-duration: 1.2s; }
@keyframes pin-pulse { 0% { transform: scale(0.6); opacity: 1; } 100% { transform: scale(2.4); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  .ill-crew *, .ill-paint *, .crew-rope, .crew-bucket, .bird, .bird .wing, .svc-pin .pin-pulse { animation: none !important; }
  .ill-crew .w-impact { opacity: 0; }
}

.hero-bp {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: clamp(600px, 86vh, 820px);
  padding: 70px 0 120px;
  background: #0b2747;
  color: #fff;
}
.hero-visual, .hero-media, .hero-plan, .hero-plan-inner, .hero-shade { position: absolute; inset: 0; }
.hero-media { z-index: -1; }
.hero-photo, .hero-plan-ghost, .hero-plan-lines, .hero-annot { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-photo, .hero-plan-ghost, .hero-plan-lines { object-fit: cover; object-position: 60% 40%; }
.hero-bp .hero-media img { height: 100%; }

.hero-bp { cursor: ew-resize; touch-action: pan-y; }
.hero-bp .hero-media { pointer-events: none; }
.hero-bp .hero-media img { -webkit-user-drag: none; user-select: none; }
.hero-copy { cursor: auto; }
.hero-bp.is-dragging { cursor: grabbing; user-select: none; }
.hero-plan { overflow: hidden; transform: translateX(-43%); will-change: transform; }
.hero-plan-inner { background: radial-gradient(ellipse at 30% 40%, #10325a, #0a2242 70%); transform: translateX(43%); will-change: transform; }
.hero-plan-ghost { filter: grayscale(1) contrast(1.2) brightness(0.5); opacity: 0.32; mix-blend-mode: luminosity; }
.hero-plan-grid {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(156, 196, 238, 0.16) 1px, transparent 1px) 0 0 / 120px 120px,
    linear-gradient(90deg, rgba(156, 196, 238, 0.16) 1px, transparent 1px) 0 0 / 120px 120px,
    linear-gradient(rgba(156, 196, 238, 0.07) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(90deg, rgba(156, 196, 238, 0.07) 1px, transparent 1px) 0 0 / 24px 24px;
}
.hero-plan-lines { opacity: 0.9; }
.hero-annot .annot-lines path, .hero-annot .annot-lines circle { stroke-dasharray: 1; stroke-dashoffset: 1; animation: hero-draw 1.6s 0.8s var(--ease) forwards; }
.hero-annot .annot-text { font: 600 15px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 2px; opacity: 0; animation: hero-fade 0.8s 1.8s forwards; }
.hero-annot .annot-title { font-size: 24px; font-weight: 800; letter-spacing: 4px; }
.hero-shade {
  background:
    linear-gradient(90deg, rgba(5, 16, 30, 0.9) 0%, rgba(5, 16, 30, 0.72) 30%, rgba(5, 16, 30, 0.2) 55%, rgba(5, 16, 30, 0) 68%),
    linear-gradient(0deg, rgba(5, 16, 30, 0.6), rgba(5, 16, 30, 0) 30%);
}

.hero-scan { position: absolute; top: 0; bottom: 0; left: 0; z-index: 2; width: 0; transform: translateX(57vw); pointer-events: none; }
.hero-scan::before { content: ""; position: absolute; top: 0; bottom: 0; left: -1.5px; width: 3px; background: var(--brand); box-shadow: 0 0 16px 3px rgba(255, 182, 0, 0.6), 0 0 70px 12px rgba(255, 182, 0, 0.16); }
.hero-scan::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 140px; background: linear-gradient(90deg, rgba(255, 182, 0, 0), rgba(255, 182, 0, 0.12)); }
.hero-scan-tag { position: absolute; top: 16%; padding: 5px 11px; font: 700 11px/1.2 "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 2.5px; text-transform: uppercase; white-space: nowrap; }
.hero-scan-tag--plan { right: 16px; border: 1px solid rgba(207, 227, 255, 0.4); background: rgba(10, 34, 66, 0.85); color: #cfe3ff; }
.hero-scan-tag--real { left: 16px; background: var(--brand); color: var(--ink); }
.hero-scan-knob {
  position: absolute;
  top: 50%;
  left: 0;
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: -27px 0 0 -27px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--brand);
  color: var(--ink);
  font-size: 18px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  cursor: ew-resize;
  pointer-events: auto;
  touch-action: none;
  outline: none;
  transition: transform 0.25s var(--ease);
}
.hero-scan-knob:hover, .hero-scan-knob:focus-visible, .hero-bp.is-dragging .hero-scan-knob { transform: scale(1.12); }
.hero-scan-knob { cursor: grab; }
.hero-bp.is-dragging .hero-scan-knob { cursor: grabbing; }
.hero-scan-knob::before { content: ""; position: absolute; inset: -18px; border-radius: 50%; }
.hero-bp:not(.is-touched) .hero-scan-knob::after { content: ""; position: absolute; inset: -4px; border: 2px solid var(--brand); border-radius: 50%; animation: knob-ring 1.8s ease-out infinite; pointer-events: none; }
@keyframes knob-ring { from { transform: scale(1); opacity: 0.9; } to { transform: scale(1.8); opacity: 0; } }
.hero-scan-knob:focus-visible { box-shadow: 0 0 0 4px rgba(255, 182, 0, 0.45), 0 10px 30px rgba(0, 0, 0, 0.35); }

.hero-inner { position: relative; z-index: 3; }
.hero-copy { max-width: 680px; }
.hero-copy > * { animation: hero-in 0.9s var(--ease) both; }
.hero-copy > :nth-child(2) { animation-delay: 0.1s; }
.hero-copy > :nth-child(3) { animation-delay: 0.2s; }
.hero-copy > :nth-child(4) { animation-delay: 0.3s; }
.hero-copy > :nth-child(5) { animation-delay: 0.4s; }

.hero-kicker {
  position: relative;
  display: inline-flex;
  align-items: stretch;
  margin: 0 0 30px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(8, 24, 46, 0.55);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  font: 700 12.5px/1 "Barlow", "Barlow Fallback", sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.hero-kicker::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -12px;
  height: 8px;
  background:
    repeating-linear-gradient(90deg, rgba(255, 182, 0, 0.85) 0 1px, transparent 1px 40px) 0 0 / 100% 8px no-repeat,
    repeating-linear-gradient(90deg, rgba(255, 182, 0, 0.5) 0 1px, transparent 1px 8px) 0 4px / 100% 4px no-repeat;
  border-top: 1px solid rgba(255, 182, 0, 0.6);
}
.hero-kicker-badge { display: grid; place-items: center; width: 40px; background: var(--brand); }
.hero-kicker-badge .line-icon { color: var(--ink); }
.hero-kicker-text { display: flex; align-items: center; padding: 11px 16px; color: #fff; }
.hero-kicker-year { display: flex; align-items: center; padding: 11px 18px 11px 14px; border-left: 1px dashed rgba(255, 255, 255, 0.3); color: var(--brand); }
.hero-title { margin: 0 0 20px; font: 800 clamp(40px, 4vw, 64px)/1.04 "Barlow", "Barlow Fallback", sans-serif; letter-spacing: -0.5px; color: #fff; text-transform: none; }
.hero-hl { position: relative; display: inline-block; color: var(--brand); white-space: nowrap; }
.hero-underline { position: absolute; left: 0; bottom: -12px; width: 100%; height: 18px; overflow: visible; }
.hero-underline path { fill: none; stroke: var(--brand); stroke-width: 5; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: hero-draw 1.1s 0.8s var(--ease) forwards; }
.hero-lead { max-width: 530px; margin: 0 0 32px; font-size: 18px; line-height: 1.65; color: #d4dbe5; }
.hero-lead .typed-words { font-weight: 700; }
.hero-typed-line { display: block; height: 1.65em; white-space: nowrap; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-bottom: 36px; }
.hero-cta { padding: 16px 30px; font-size: 15px; }
.hero-link { display: inline-flex; align-items: center; gap: 12px; color: #fff; font: 700 15px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 0.5px; text-transform: uppercase; }
.hero-link-icon { display: grid; place-items: center; width: 48px; height: 48px; border: 2px solid rgba(255, 255, 255, 0.45); border-radius: 50%; font-size: 13px; transition: background 0.3s, border-color 0.3s, color 0.3s; }
.hero-link:hover { color: var(--brand); text-decoration: none; }
.hero-link:hover .hero-link-icon { border-color: var(--brand); background: var(--brand); color: var(--ink); }
.hero-trust { display: flex; align-items: center; gap: 14px; }
.hero-avatars { display: flex; }
.hero-avatars img { width: 40px; height: 40px; margin-left: -10px; border: 2px solid #0a2242; border-radius: 50%; }
.hero-avatars img:first-child { margin-left: 0; }
.hero-trust-text { display: flex; flex-direction: column; gap: 5px; }
.hero-trust-text small { font-size: 13.5px; color: #c4ccd8; }
.hero-trust-text strong { color: #fff; }
.hero-trust .review-stars { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath fill='%233a4a60' d='M10 .8l2.7 5.5 6 .9-4.4 4.2 1 6L10 14.6l-5.3 2.8 1-6L1.3 7.2l6-.9z'/%3E%3C/svg%3E"); }

@keyframes hero-in { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes hero-draw { to { stroke-dashoffset: 0; } }
@keyframes hero-fade { to { opacity: 0.85; } }
@keyframes hero-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

@media (min-width: 992px) {
  .hero-hl { display: table; }
}

@media (max-width: 991px) {

  .hero-bp {
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    padding: 48px 0 92px;
    background:
      linear-gradient(rgba(156, 196, 238, 0.12) 1px, transparent 1px) 0 0 / 24px 24px,
      linear-gradient(90deg, rgba(156, 196, 238, 0.12) 1px, transparent 1px) 0 0 / 24px 24px,
      radial-gradient(ellipse at 20% 0%, #13386a, #0a2242 70%);
  }
  .hero-inner { order: 1; }
  .hero-visual { position: relative; order: 2; align-self: center; width: calc(100% - 30px); max-width: 720px; height: clamp(250px, 64vw, 440px); margin-top: 32px; overflow: hidden; isolation: isolate; box-shadow: 0 0 0 3px rgba(255, 182, 0, 0.9), 0 24px 50px rgba(0, 0, 0, 0.35); }
  .hero-shade { background: linear-gradient(0deg, rgba(5, 16, 30, 0.35), rgba(5, 16, 30, 0) 40%); }
  .hero-annot { display: none; }
  .hero-scan-tag { top: 12px; }
}
@media (max-width: 575px) {
  .hero-photo, .hero-plan-ghost, .hero-plan-lines { object-position: 62% 40%; }
  .hero-lead { font-size: 16.5px; }
  .hero-kicker { font-size: 11px; letter-spacing: 1.2px; }
  .hero-kicker-text { padding: 10px 11px; }
  .hero-kicker-year { padding: 10px 11px; white-space: nowrap; }
  .hero-kicker-badge { width: 34px; }
  .hero-actions { flex-direction: column; align-items: flex-start; gap: 14px; }
  .hero-scan-knob { width: 46px; height: 46px; margin: -23px 0 0 -23px; font-size: 15px; }
  .hero-trust small { font-size: 12.5px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-copy > * { animation: none !important; }
  .hero-underline path, .hero-annot .annot-lines path, .hero-annot .annot-lines circle { animation: none; stroke-dashoffset: 0; }
  .hero-annot .annot-text { animation: none; opacity: 0.85; }
}

@media (min-width: 576px) and (max-width: 991px) {
  .svc-col { max-width: 600px; margin-left: auto; margin-right: auto; }
}
@media (max-width: 767px) {

  .top-bar .top-social a { display: inline-grid; place-items: center; min-width: 38px; min-height: 38px; }
  .footer-social ul li a, .footer-social a { display: inline-grid; place-items: center; min-width: 42px; min-height: 42px; }
  .footer-menu ul li a { display: inline-block; padding: 6px 2px; }
  .read-more { padding: 10px 0; margin-top: 2px; }
  .learn-more { display: inline-block; padding: 8px 0; }

  .shuffle-btn-group { -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); padding-right: 30px; }

  .house3d-hotspot { position: relative; }
  .house3d-hotspot::after { content: ""; position: absolute; inset: -12px; }
  a.svc-call, .subscribe-call-to-acton h4 a { display: inline-flex; padding: 10px 0; }
  .about-link { display: inline-block; padding: 10px 0; }

  input, select, textarea { font-size: 16px; }
}
@media (max-width: 400px) {
  .hero-title { font-size: 36px; }
  .hero-trust { flex-wrap: wrap; }
  .site-header .logo img { height: 32px; }
  .header-mobile-actions { gap: 8px; }
}

.footer-main { padding: 60px 0 56px; }
.footer-brand .footer-logo { width: 190px; margin-bottom: 18px; }
.footer-brand p { max-width: 380px; margin-bottom: 22px; font-size: 16px; line-height: 1.65; color: #b9b9b9; }
.footer-social { display: flex; gap: 10px; margin: 0; }
.footer-social a { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(255, 255, 255, 0.18); color: #fff; transition: background 0.25s, border-color 0.25s, color 0.25s; }
.footer-social a:hover { border-color: var(--brand); background: var(--brand); color: var(--ink); }
.footer-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 30px; margin: 0; padding: 0; list-style: none; }
.footer-contact li { display: flex; align-items: center; gap: 14px; min-width: 0; }
.footer-contact-icon { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border: 1px solid rgba(255, 182, 0, 0.45); background: rgba(255, 182, 0, 0.08); }
.footer-contact-icon .line-icon { color: var(--brand); }
.footer-contact li > span:last-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; font: 600 16px/1.35 "Barlow", "Barlow Fallback", sans-serif; color: #fff; overflow-wrap: anywhere; }
.footer-contact small { font: 700 11.5px "Barlow", "Barlow Fallback", sans-serif; letter-spacing: 1.5px; text-transform: uppercase; color: #8d8d8d; }
.footer-contact a { color: #fff; }
.footer-contact a:hover { color: var(--brand); text-decoration: none; }
.copyright-info, .footer-menu ul { margin: 0; }
@media (max-width: 575px) {
  .footer-main { padding: 48px 0 40px; }
  .footer-contact { grid-template-columns: 1fr; gap: 18px; }
}

.mobile-call-bar { display: none; }
@media (max-width: 767px) {
  .mobile-call-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    display: flex;
    padding-bottom: env(safe-area-inset-bottom);
    background: var(--ink);
    box-shadow: 0 -6px 20px rgba(0, 0, 0, 0.22);
  }
  .mobile-call-bar a {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 56px;
    font: 700 15px/1 "Barlow", "Barlow Fallback", sans-serif;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    text-decoration: none;
  }
  .mobile-call-bar a.mobile-call-bar-call { background: var(--ink); color: #fff; }
  .mobile-call-bar-call .line-icon { color: var(--brand); }
  .mobile-call-bar a.mobile-call-bar-quote { background: var(--brand); color: var(--ink); }
  .mobile-call-bar-quote i { font-size: 13px; }
  .mobile-call-bar a:active { filter: brightness(0.92); }

  body { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
  #back-to-top.position-fixed { bottom: calc(72px + env(safe-area-inset-bottom)); }
}