.hero-experience{--cream: #f5f1e9; --ink: #30302d; --muted: #65615c; --walnut: #594235; --charcoal: #30302d; --gold: #dbc39a; --line: #c8bfb4; }
.hero-experience *{box-sizing: border-box;}
.hero-experience{color: var(--ink); background: var(--cream); font-family: Arial, Helvetica, sans-serif; scroll-padding-top: calc(var(--header) + 18px);}
body .hero-experience {margin: 0px;}
.hero-experience a{color: inherit; text-decoration: none;}
.hero-experience button,.hero-experience input,.hero-experience select{font: inherit;}
.hero-experience button{cursor: pointer;}
.hero-experience a,.hero-experience button{touch-action: manipulation;}
.hero-experience button,.hero-experience a,.hero-experience input,.hero-experience select,.hero-experience summary{outline-offset: 5px;}
.hero-experience button:focus-visible,.hero-experience a:focus-visible,.hero-experience input:focus-visible,.hero-experience select:focus-visible{outline: rgb(89, 66, 53) solid 2px;}
.hero-experience p{line-height: 1.7;}
.hero-experience img{max-width: 100%; display: block;}
.hero-experience button{color: inherit;}
.hero-experience .skip{position: fixed; top: -100px; left: 15px; z-index: 100; background: rgb(255, 255, 255); padding: 15px;}
.hero-experience .skip:focus{top: 12px;}
.hero-experience .site-header{position: sticky; top: 0px; z-index: 30; background: var(--cream);}
.hero-experience .utility{background: var(--charcoal); color: rgb(245, 241, 233); padding: 7px 4vw; display: flex; justify-content: space-between; font-size: 8px; letter-spacing: 1.8px;}
.hero-experience .utility a{letter-spacing: 1px;}
.hero-experience .nav-wrap{height: 83px; display: flex; align-items: center; justify-content: space-between; padding: 0px 4vw; border-bottom: 1px solid rgb(200, 191, 180);}
.hero-experience .brand img{width: 137px; height: auto;}
.hero-experience .nav-wrap nav{display: flex; align-items: center; gap: 36px; font-size: 11px;}
.hero-experience .nav-wrap nav > a:not(.nav-cta){padding: 15px 0px;}
.hero-experience .nav-wrap nav > a:hover{text-decoration: underline; text-underline-offset: 5px;}
.hero-experience .nav-cta{padding: 15px 22px; background: var(--walnut); color: rgb(255, 255, 255); display: flex; gap: 24px;}
.hero-experience .menu{display: none;}
.hero-experience .journey{height: 640vh;}
.hero-experience .stage{height: calc(100svh - var(--header)); min-height: 540px; position: sticky; top: var(--header); background: rgb(38, 37, 30); overflow: hidden; color: rgb(255, 248, 233);}
.hero-experience .visual,.hero-experience .visual img,.hero-experience .visual canvas{position: absolute; inset: 0px; width: 100%; height: 100%;}
.hero-experience .visual img,.hero-experience .visual canvas{object-fit: cover;}
.hero-experience .visual canvas{opacity: 0;}
.hero-experience .visual::after{content: ""; position: absolute; inset: 0px; background: linear-gradient(90deg, rgba(24, 24, 23, 0.66) 0%, rgba(24, 24, 23, 0.27) 45%, transparent 75%), linear-gradient(0deg, rgba(24, 24, 23, 0.733), transparent 45%); pointer-events: none;}
.hero-experience .hero-caption{position: absolute; top: 50%; transform: translateY(-50%); left: 5vw; max-width: 70%;}
.hero-experience .eyebrow{font-size: 9px; line-height: 1.5; letter-spacing: 2.4px; font-weight: 500; margin: 0px 0px 22px;}
.hero-experience .hero-caption .eyebrow{color: rgb(228, 211, 172);}
.hero-experience .hero-caption h1{font: 400 clamp(42px, 5.4vw, 84px) / 1.03 Georgia, serif; letter-spacing: -2px; margin: 0px 0px 24px;}
.hero-experience .hero-caption h1 em,.hero-experience h2 em{font-weight: 400;}
.hero-experience .hero-intro{font-size: 12px; line-height: 1.75; margin-bottom: 28px; color: rgb(244, 238, 227);}
.hero-experience .button{display: inline-flex; justify-content: space-between; align-items: center; gap: 34px; padding: 18px 24px; font-size: 11px; font-weight: 600; letter-spacing: 0.2px; border: 1px solid transparent; min-height: 48px;}
.hero-experience .button.ivory{background: rgb(245, 241, 233); color: rgb(89, 66, 53);}
.hero-experience .button.green{background: var(--walnut); color: rgb(255, 255, 255);}
.hero-experience .button:hover{background: rgb(223, 212, 189); color: rgb(89, 66, 53);}
.hero-experience .hint{font-size: 10px; margin-top: 23px; color: rgb(224, 221, 204);}
.hero-experience .build-controls{position: absolute; right: 4vw; bottom: 58px; width: 258px;}
.hero-experience .control-top{display: flex; gap: 18px; align-items: center;}
.hero-experience .control-top button{font-size: 10px; background: none; border: 0px; padding: 10px 0px; color: rgb(255, 248, 233); min-height: 36px;}
.hero-experience .control-top button:disabled{opacity: 0.45; cursor: wait;}
.hero-experience .control-top output{font-size: 10px; margin-left: auto; color: var(--gold);}
.hero-experience #scrub{width: 100%; accent-color: var(--gold); height: 18px; cursor: ew-resize; margin: 0px;}
.hero-experience #loading{font-size: 8px; line-height: 1.4; color: rgb(227, 222, 204); min-height: 12px; margin: 5px 0px 0px;}
.hero-experience .visual-note{position: absolute; right: 4vw; bottom: 22px; font-size: 7px; letter-spacing: 1.4px; color: rgb(201, 198, 185);}
.hero-experience .skip-build{position: absolute; left: 5vw; bottom: 26px; font-size: 10px; letter-spacing: 0.5px;}
.hero-experience .skip-build span{margin-left: 24px;}
.hero-experience .trust-strip{padding: 27px 5vw; display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); font-size: 10px;}
.hero-experience .trust-strip p{margin: 0px;}
.hero-experience .trust-strip span{font: italic 16px Georgia; color: rgb(121, 97, 79); margin-right: 14px;}
.hero-experience .section{padding: 100px 6vw;}
.hero-experience .section-heading{display: flex; justify-content: space-between; align-items: flex-end; gap: 50px; margin-bottom: 45px;}
.hero-experience h2{font: 400 clamp(32px, 4vw, 58px) / 1.12 Georgia, serif; letter-spacing: -1.3px; margin: 0px;}
.hero-experience h3{font: 400 24px / 1.2 Georgia, serif; margin: 0px;}
.hero-experience .section-heading > p{max-width: 320px; font-size: 12px; color: var(--muted); margin: 0px 0px 5px;}
.hero-experience .space-grid{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 26px;}
.hero-experience .photo{aspect-ratio: 1.1 / 1; overflow: hidden; background: rgb(222, 215, 205);}
.hero-experience .photo img{width: 100%; height: 100%; object-fit: cover; transition: transform 350ms;}
.hero-experience .space-card:hover .photo img{transform: scale(1.025);}
.hero-experience .card-title{display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 22px 0px 10px;}
.hero-experience .card-title h3{font-size: 23px;}
.hero-experience .card-title span{font-size: 22px;}
.hero-experience .space-card > p{font-size: 11px; color: var(--muted); margin: 0px;}
.hero-experience .detail-section{display: grid; grid-template-columns: 1.1fr 1fr; background: rgb(233, 227, 218);}
.hero-experience .detail-photo{min-height: 590px; position: relative; overflow: hidden;}
.hero-experience .detail-photo img{width: 100%; height: 100%; object-fit: cover; object-position: 54% center;}
.hero-experience .detail-photo > span{position: absolute; left: 25px; bottom: 22px; font-size: 8px; letter-spacing: 1.4px; color: white;}
.hero-experience .detail-copy{padding: 76px 6vw 76px 5vw; align-self: center;}
.hero-experience .detail-copy h2{font-size: clamp(34px, 3.3vw, 48px);}
.hero-experience .detail-copy > p:not(.eyebrow){font-size: 12px; color: rgb(96, 89, 80); margin: 24px 0px;}
.hero-experience .detail-copy ul{list-style: none; padding: 0px; margin: 25px 0px 30px; font-size: 11px;}
.hero-experience .detail-copy li{border-top: 1px solid rgb(200, 191, 180); padding: 16px 0px;}
.hero-experience .detail-copy li span{font: italic 15px Georgia; margin-right: 20px; color: rgb(116, 91, 73);}
.hero-experience .text-link{font-size: 11px; border-bottom: 1px solid rgb(146, 125, 106); padding-bottom: 8px; display: inline-block; line-height: 1.7;}
.hero-experience .text-link:hover{color: rgb(89, 66, 53); border-color: currentcolor;}
.hero-experience .story{display: grid; grid-template-columns: 1fr 0.9fr; gap: 12vw; position: relative; align-items: center; padding-top: 120px; padding-bottom: 120px; overflow: hidden;}
.hero-experience .story-copy{max-width: 460px; position: relative; z-index: 1;}
.hero-experience .story-copy .lead{font: 20px / 1.5 Georgia, serif; margin-top: 30px;}
.hero-experience .story-copy p:not(.eyebrow):not(.lead){font-size: 12px; color: var(--muted);}
.hero-experience .story-copy .text-link{margin-top: 15px;}
.hero-experience .story-photo{margin: 0px; position: relative; z-index: 1;}
.hero-experience .story-photo img{height: 490px; width: 100%; object-fit: cover; object-position: center 45%;}
.hero-experience .story-photo figcaption{font-size: 9px; color: var(--muted); margin-top: 14px;}
.hero-experience .story-year{position: absolute; bottom: -20px; left: 5vw; font: 220px / 0.9 Georgia; color: rgb(229, 221, 210); letter-spacing: -12px;}
.hero-experience .process{border-top: 1px solid var(--line);}
.hero-experience .process-grid{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 50px;}
.hero-experience .process-grid article{border-top: 1px solid rgb(161, 142, 123); padding-top: 25px;}
.hero-experience .step{font: italic 36px Georgia; color: rgb(121, 97, 79); display: block; margin-bottom: 24px;}
.hero-experience .process-grid h3{font-size: 24px;}
.hero-experience .process-grid p{font-size: 12px; color: var(--muted); max-width: 290px;}
.hero-experience .consultation{background: var(--charcoal); color: var(--cream); padding: 95px 7vw; display: grid; grid-template-columns: 1.1fr 1fr; gap: 8vw; align-items: center;}
.hero-experience .consultation .eyebrow{color: rgb(219, 195, 154);}
.hero-experience .consultation h2{font-size: clamp(45px, 5vw, 76px);}
.hero-experience .consultation-copy > p{font-size: 13px; max-width: 360px; margin: 0px 0px 25px; color: rgb(238, 230, 220);}
.hero-experience .consult-phone{font-size: 10px; display: block; margin-top: 22px;}
.hero-experience footer{padding: 65px 6vw 0px; background: rgb(236, 230, 221);}
.hero-experience .footer-grid{display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 50px; padding-bottom: 50px;}
.hero-experience .footer-brand img{width: 165px;}
.hero-experience .footer-grid h3{font: 11px Arial; letter-spacing: 0.6px; margin-bottom: 23px;}
.hero-experience .footer-grid p,.hero-experience .footer-grid a:not(.brand),.hero-experience .footer-grid button{font-size: 11px; line-height: 1.9;}
.hero-experience .footer-grid a:not(.brand){display: block; margin-bottom: 8px;}
.hero-experience .footer-grid button,.hero-experience .legal button{background: none; border: 0px; padding: 0px; text-align: left;}
.hero-experience .footer-grid a:hover,.hero-experience .footer-grid button:hover,.hero-experience .legal a:hover,.hero-experience .legal button:hover{text-decoration: underline;}
.hero-experience .footer-bottom{border-top: 1px solid var(--line); padding-top: 28px; display: flex; justify-content: space-between; gap: 35px;}
.hero-experience .legal{display: flex; gap: 14px; flex-wrap: wrap; align-content: start; font-size: 9px;}
.hero-experience .legal span:last-child{width: 100%; margin-top: 10px;}
.hero-experience .locale{display: flex; gap: 12px;}
.hero-experience .locale label{font-size: 9px; display: grid; gap: 8px;}
.hero-experience .locale select{border: 1px solid rgb(138, 124, 109); background: transparent; color: var(--ink); padding: 9px; font-size: 11px; min-height: 38px;}
.hero-experience .concept-note{font-size: 8px; letter-spacing: 1.5px; color: rgb(101, 97, 92); margin: 30px 0px 0px; border-top: 1px solid var(--line); padding: 15px 0px;}
.hero-experience .sr-only{position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px;}
.hero-experience dialog{max-width: 540px; width: calc(100% - 36px); padding: 46px; background: var(--cream); border: 0px; color: var(--ink);}
.hero-experience dialog::backdrop{background: rgba(36, 35, 32, 0.667); backdrop-filter: blur(4px);}
.hero-experience dialog h2{font-size: 38px; margin-bottom: 24px;}
.hero-experience dialog p{font-size: 13px; color: rgb(101, 97, 92);}
.hero-experience dialog .dialog-note{font-size: 10px; margin-top: 24px;}
.hero-experience dialog .close{position: absolute; top: 10px; right: 12px; border: 0px; background: none; font-size: 30px; width: 44px; height: 44px;}
body.still .hero-experience .journey{height: calc(100svh - var(--header)); min-height: 540px;}
body.still .hero-experience .stage{position: relative; top: auto;}
body.still .hero-experience #scrub{opacity: 0.4;}
.hero-experience .noscript{padding: 20px;}
@media (max-width: 1000px) {.hero-experience .nav-wrap nav{gap: 22px;}.hero-experience .hero-caption{max-width: 80%;}.hero-experience .hero-caption h1{font-size: 60px;}.hero-experience .section{padding: 75px 5vw;}.hero-experience .section-heading{gap: 30px;}.hero-experience .space-grid{gap: 18px;}.hero-experience .card-title h3{font-size: 20px;}.hero-experience .detail-photo{min-height: 550px;}.hero-experience .detail-copy{padding: 50px 5vw;}.hero-experience .story{gap: 7vw;}.hero-experience .story-photo img{height: 440px;}.hero-experience .trust-strip{font-size: 9px;}.hero-experience .trust-strip span{margin-right: 8px;}.hero-experience .process-grid{gap: 25px;}.hero-experience .footer-grid{gap: 30px;}.hero-experience .footer-bottom{flex-direction: column;}}
@media (max-width: 680px) {.hero-experience{}.hero-experience .utility{padding: 6px 20px; font-size: 6px; letter-spacing: 1px;}.hero-experience .utility > span:nth-child(2){display: none;}.hero-experience .nav-wrap{height: 68px; padding: 0px 20px;}.hero-experience .brand img{width: 109px;}.hero-experience .menu{display: flex; gap: 12px; align-items: center; background: none; border: 1px solid rgb(138, 124, 109); padding: 11px; font-size: 10px; min-height: 44px;}.hero-experience .nav-wrap nav{position: absolute; top: 100%; left: 0px; right: 0px; padding: 15px 22px 25px; background: var(--cream); display: none; box-shadow: rgba(48, 40, 32, 0.082) 0px 20px 30px;}.hero-experience .nav-wrap nav.open{display: flex; flex-direction: column; align-items: stretch; gap: 0px;}.hero-experience .nav-wrap nav > a{padding: 17px !important;}.hero-experience .nav-cta{margin-top: 8px;}.hero-experience .stage{min-height: 0px;}.hero-experience .journey{height: 600vh;}.hero-experience .visual{inset: 185px 0px auto; height: auto; aspect-ratio: 8 / 5;}.hero-experience .visual img,.hero-experience .visual canvas{object-fit: contain;}.hero-experience .visual::after{background: linear-gradient(0deg, rgb(38, 37, 30), transparent 30%);}.hero-experience .hero-caption{left: 22px; right: 22px; top: 27px; transform: none; max-width: none;}.hero-experience .hero-caption .eyebrow{font-size: 7px; margin-bottom: 12px; letter-spacing: 1.6px;}.hero-experience .hero-caption h1{font-size: 32px; letter-spacing: -1px; margin-bottom: 0px;}.hero-experience .hero-intro{margin-top: calc(75px + 62.5vw); font-size: 11px; max-width: 310px;}.hero-experience .desktop-break{display: none;}.hero-experience .hero-caption .button{padding: 14px 18px; font-size: 10px; min-height: 44px;}.hero-experience .hint{display: none;}.hero-experience .build-controls{bottom: 49px; left: 22px; right: 22px; width: auto;}.hero-experience .visual-note{bottom: 20px; right: 22px; font-size: 6px;}.hero-experience .skip-build{bottom: 20px; left: 22px; font-size: 9px;}.hero-experience .trust-strip{padding: 20px; gap: 12px; align-items: flex-start;}.hero-experience .trust-strip p{font-size: 8px; line-height: 1.5; flex: 1 1 0%;}.hero-experience .trust-strip span{display: block; margin-bottom: 5px; font-size: 13px;}.hero-experience .section{padding: 65px 22px;}.hero-experience .section-heading{display: block; margin-bottom: 30px;}.hero-experience .section-heading > p{margin-top: 22px;}.hero-experience .eyebrow{font-size: 8px; letter-spacing: 1.8px; margin-bottom: 17px;}.hero-experience h2{font-size: 36px; letter-spacing: -0.8px;}.hero-experience .space-grid{grid-template-columns: 1fr; gap: 35px;}.hero-experience .photo{aspect-ratio: 1.25 / 1;}.hero-experience .card-title{margin-top: 15px;}.hero-experience .card-title h3{font-size: 25px;}.hero-experience .space-card > p{font-size: 12px;}.hero-experience .detail-section{grid-template-columns: 1fr;}.hero-experience .detail-photo{min-height: 0px; height: 330px;}.hero-experience .detail-photo img{object-fit: cover;}.hero-experience .detail-copy{padding: 45px 22px;}.hero-experience .detail-copy h2{font-size: 34px;}.hero-experience .story{grid-template-columns: 1fr; gap: 35px; padding-bottom: 75px;}.hero-experience .story-photo img{height: 420px;}.hero-experience .story-year{font-size: 150px; bottom: -5px;}.hero-experience .process .section-heading .text-link{margin-top: 22px;}.hero-experience .process-grid{grid-template-columns: 1fr; gap: 25px;}.hero-experience .process-grid article{display: grid; grid-template-columns: 50px 1fr; gap: 10px 18px;}.hero-experience .step{grid-row: span 2; margin: 0px;}.hero-experience .process-grid h3{font-size: 24px;}.hero-experience .process-grid p{grid-column: 2; margin: 0px;}.hero-experience .consultation{padding: 65px 22px; grid-template-columns: 1fr; gap: 30px;}.hero-experience .consultation h2{font-size: 48px;}.hero-experience .consultation-copy > p{font-size: 13px;}.hero-experience .footer-grid{grid-template-columns: 1fr 1fr; gap: 30px;}.hero-experience .footer-grid > div:first-child{grid-column: 1 / -1;}.hero-experience .footer-grid h3{margin-bottom: 15px;}.hero-experience .footer-grid a:not(.brand),.hero-experience .footer-grid button{min-height: 32px;}.hero-experience .footer-brand img{width: 145px;}.hero-experience footer{padding: 45px 22px 0px;}.hero-experience .footer-bottom{gap: 25px;}.hero-experience .locale{width: 100%; gap: 15px;}.hero-experience .locale label{flex: 1 1 0%;}.hero-experience .locale select{max-width: 100%; font-size: 16px;}.hero-experience .legal button{min-height: 30px;}.hero-experience .concept-note{font-size: 7px; line-height: 1.7;}.hero-experience .legal{align-items: center;}.hero-experience dialog{padding: 45px 25px 30px;}.hero-experience dialog h2{font-size: 34px;}body.still .hero-experience .journey{min-height: 0px;}}
@media (max-width: 680px) and (max-height: 740px) {.hero-experience .visual{top: 155px;}.hero-experience .hero-intro{display: none;}.hero-experience .hero-caption .button{margin-top: calc(30px + 62.5vw);}.hero-experience .hero-caption h1{font-size: 30px;}.hero-experience .build-controls{bottom: 45px;}}
@media (prefers-reduced-motion: reduce) {.hero-experience *{scroll-behavior: auto !important; transition: none !important;}.hero-experience .space-card:hover .photo img{transform: none;}}
body:not([data-mode]) .hero-experience .journey{height: auto;}
body:not([data-mode]) .hero-experience .stage{position: relative; top: auto;}
body:not([data-mode]) .hero-experience .build-controls{display: none;}
.hero-experience .stage{background: rgb(52, 54, 56);}
.hero-experience .visual{inset: 0px; width: 100%; height: 100%; aspect-ratio: auto;}
.hero-experience .visual img,.hero-experience .visual canvas{width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.hero-experience .visual::after{background: linear-gradient(90deg, rgba(12, 17, 18, 0.68), rgba(12, 17, 18, 0.48) 45%, transparent 80%), linear-gradient(0deg, rgba(12, 17, 18, 0.52), transparent 28%);}
.hero-experience .hero-caption{left: 5vw; right: auto; top: 47%; transform: translateY(-50%); max-width: 49%;}
.hero-experience .hero-caption h1{font-size: clamp(40px, 5.1vw, 80px); letter-spacing: -1.6px; text-shadow: rgba(0, 0, 0, 0.2) 0px 2px 20px;}
.hero-experience .hero-intro{max-width: 340px; margin-top: 0px; text-shadow: rgba(0, 0, 0, 0.333) 0px 1px 8px;}
.hero-experience .build-controls{bottom: 54px; background: rgba(23, 29, 32, 0.42); padding: 10px 14px; width: 300px;}
.hero-experience .control-top{gap: 14px;}
.hero-experience .control-top button{min-height: 44px;}
.hero-experience #scrub{height: 24px;}
@media (min-width: 681px) and (max-width: 1000px) {.hero-experience .hero-caption{max-width: 56%; top: 43%;}.hero-experience .hero-caption h1{font-size: clamp(40px, 5.5vw, 55px);}.hero-experience .hero-caption .eyebrow{font-size: 8px; letter-spacing: 1.5px;}}
@media (max-width: 680px) {.hero-experience .visual{inset: 0px; width: 100%; height: 100%; aspect-ratio: auto;}.hero-experience .visual img,.hero-experience .visual canvas{object-fit: cover; object-position: 51% center;}.hero-experience .visual::after{background: linear-gradient(rgba(12, 17, 18, 0.62), rgba(12, 17, 18, 0.23) 45%, rgba(12, 17, 18, 0.15) 65%, rgba(12, 17, 18, 0.72));}.hero-experience .hero-caption{left: 22px; right: 22px; top: 36px; transform: none; max-width: none;}.hero-experience .hero-caption h1{font-size: clamp(34px, 8.8vw, 40px); line-height: 1.05; letter-spacing: -1px; margin-bottom: 18px;}.hero-experience .hero-caption .eyebrow{font-size: 7px; letter-spacing: 1.5px; margin-bottom: 14px;}.hero-experience .hero-intro{display: block; margin: 0px 0px 20px; max-width: 285px; font-size: 11px; line-height: 1.6;}.hero-experience .hero-caption .button{margin-top: 0px; padding: 14px 18px;}.hero-experience .build-controls{left: 16px; right: 16px; bottom: 48px; width: auto; padding: 5px 8px 10px;}.hero-experience .visual-note{font-size: 6px; letter-spacing: 0.9px;}}
@media (max-width: 680px) and (max-height: 740px) {.hero-experience .hero-caption{top: 24px;}.hero-experience .hero-caption h1{font-size: 34px; margin-bottom: 14px;}.hero-experience .hero-intro{font-size: 10px; max-width: 265px; margin-bottom: 15px;}}
.hero-experience .journey,body.still .hero-experience .journey{height: auto; min-height: 0px;}
.hero-experience .stage{position: relative; top: auto;}
.hero-experience #scrub{display: block; width: 100%; height: 4px; margin: 8px 0px 10px; appearance: none; border: 0px; background: rgba(255, 255, 255, 0.22); cursor: default; accent-color: var(--gold);}
.hero-experience #scrub::-webkit-progress-bar{background: rgba(255, 255, 255, 0.22);}
.hero-experience #scrub::-webkit-progress-value{background: var(--gold);}
.hero-experience .control-top button:disabled{cursor: default;}
.hero-experience .detail-photo img{object-position: center center;}
.hero-experience .section .eyebrow,.hero-experience .detail-copy .eyebrow{color: var(--walnut);}
.hero-experience .text-link{color: var(--walnut);}
.hero-experience .nav-cta:hover,.hero-experience .button.green:hover{background: rgb(68, 50, 39); color: var(--cream);}
.hero-experience .stage :focus-visible,.hero-experience .consultation :focus-visible{outline-color: var(--gold);}
.hero-experience ::selection{background: rgb(89, 66, 53); color: rgb(245, 241, 233);}
body .hero-experience{width:var(--viewport-width,100%);margin-left:calc((100% - var(--viewport-width,100%))/2);position:relative;font:16px Arial,Helvetica,sans-serif}.hero-experience em{color:inherit}.hero-experience .eyebrow:before{display:none}.hero-experience .button{border-radius:0}.hero-experience #scrub{min-height:0;padding:0}.hero-experience .journey{height:auto}.hero-experience .stage{position:relative;top:auto}body[data-variant="static"] .build-controls,body[data-variant="static"] .animation-only,body:not([data-hero-initialized]) .build-controls,body:not([data-hero-initialized]) .animation-only{display:none}.hero-experience .button span{font-size:11px}.hero-experience .skip-build{min-height:24px;display:inline-flex;align-items:center}.hero-experience .visual-note{line-height:1.5}

/* Native video compositing keeps frame decoding outside the animation script. */
.hero-experience .visual .build-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;pointer-events:none;}
@media(max-width:680px){.hero-experience .visual .build-video{object-position:51% center;}}

/* Scroll distance controls the build; the existing hero stays in view. */
body[data-variant="animated"][data-hero-initialized="true"]:not(.still) .hero-experience .journey{height:600svh;}
body[data-variant="animated"][data-hero-initialized="true"]:not(.still) .hero-experience .stage{position:sticky;top:var(--hero-header,64px);height:calc(100svh - var(--hero-header,64px));}
.hero-experience input#scrub{height:24px;min-height:24px;cursor:ew-resize;touch-action:pan-y;appearance:none;-webkit-appearance:none;background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;}
.hero-experience input#scrub::-webkit-slider-runnable-track{height:3px;background:rgba(245,241,233,.45);border-radius:2px;}
.hero-experience input#scrub::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:14px;height:14px;margin-top:-5.5px;border:0;border-radius:50%;background:var(--gold);}
.hero-experience input#scrub::-moz-range-track{height:3px;background:rgba(245,241,233,.45);border:0;border-radius:2px;}
.hero-experience input#scrub::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:var(--gold);}