/* ========================================================================
   MEIER LIFT DYNAMICS / ULTRA EDITION
   Deliberately scoped to Home content BELOW the unchanged hero + Contact.
   All other pages and original global styles remain unmodified.
   ======================================================================== */
:root {
   --ultra-lime: #adfb79;
   --ultra-ink: #0c130e;
   --ultra-forest: #111f16;
   --ultra-paper: #e8e9df;
   --ultra-mono: "Poppins", sans-serif;;
   --ultra-head: 'Barlow Condensed', 'Arial Narrow', Impact, sans-serif;
   --ultra-ease: cubic-bezier(.16, 1, .3, 1)
}

.atelier-intro,
.atelier-services,
.atelier-rebuild,
.atelier-principles,
.atelier-final,
.contact-cinema,
.contact-studio,
.contact-location,
.contact-signoff {
   isolation: isolate;
   position: relative;
   overflow: hidden
}

.atelier-big {
   font: 900 clamp(90px, 10.2vw, 192px)/.79 var(--ultra-head);
   letter-spacing: -.01em;
   text-transform: uppercase;
   margin: 0;
   word-break: normal
}

.atelier-big em {
   font-style: normal;
   color: #228551
}

.atelier-rule {
   display: flex;
   justify-content: space-between;
   gap: 20px;
   border-bottom: 1px solid #15271925;
   padding-bottom: 20px;
   color: #3d5444;
   font: 600 10px/1.5 var(--ultra-mono);
   letter-spacing: .1em;
   text-transform: uppercase;
   position: relative;
   z-index: 2
}

.atelier-rule>span:first-child {
   display: inline-flex;
   gap: 13px;
   align-items: center
}

.atelier-pip {
   width: 24px;
   height: 2px;
   background: #238d53;
   display: inline-block
}

.atelier-rule-light {
   color: #a2b4a6;
   border-color: #d1edcb21
}

.atelier-rule-light .atelier-pip {
   background: var(--ultra-lime)
}

.atelier-kicker {
   font: 700 10px/1.5 var(--ultra-mono);
   letter-spacing: .13em;
   text-transform: uppercase
}

.atelier-asterisk {
   font: 400 60px/1 var(--ultra-head);
   color: #1e8751
}

.atelier-text-link {
   display: inline-flex;
   align-items: center;
   justify-content: space-between;
   gap: 30px;
   border-bottom: 1px solid #176b40;
   padding-bottom: 14px;
   font: 700 10px var(--ultra-mono);
   letter-spacing: .06em;
   text-transform: uppercase;
   color: #133d26;
   transition: gap .35s var(--ultra-ease)
}

.atelier-text-link:hover {
   gap: 50px
}

.atelier-text-link span {
   font: 400 24px Arial
}

/* 01 : The studio: bold editorial grid, deliberately NOT another hero treatment. */
.atelier-intro {
   background: #e8eae1;
   color: #0c130e;
   padding: clamp(90px, 10vw, 170px) 0 clamp(95px, 9vw, 155px)
}

.atelier-intro::before {
   content: 'MADE / NOT BOUGHT';
   position: absolute;
   right: -4%;
   top: 29%;
   transform: rotate(90deg);
   font: 600 10px var(--ultra-mono);
   letter-spacing: .3em;
   color: #5a816523;
   pointer-events: none
}

.atelier-intro-top {
   display: grid;
   grid-template-columns: minmax(0, 1.45fr) minmax(250px, .55fr);
   gap: 35px;
   align-items: end;
   margin: 65px 0 75px
}

.atelier-intro-titlewrap .atelier-kicker {
   display: block;
   margin-bottom: 28px;
   color: #31804c
}

.atelier-intro-titlewrap .atelier-big {
   font-size: clamp(90px, 10vw, 130px)
}

.atelier-intro-titlewrap .atelier-big em {
   display: inline-block
}

.atelier-intro-note {
   border-left: 2px solid #298b4a;
   padding-left: 30px;
   margin-bottom: 5px;
   max-width: 410px
}

.atelier-intro-note p {
   font: 400 clamp(14px, 1.15vw, 17px)/1.78 'DM Sans', sans-serif;
   color: #536158
}

.atelier-intro-note p:first-of-type {
   font-size: clamp(17px, 1.5vw, 10px);
   line-height: 1.55;
   color: #273b2a
}

.atelier-intro-note p strong {
   color: #111b13
}

.atelier-collage {
   display: grid;
   grid-template-columns: 1.08fr .6fr .98fr;
   gap: clamp(13px, 2vw, 36px);
   align-items: center;
   min-height: 640px
}

.atelier-plate {
   position: relative;
   overflow: visible;
   margin: 0;
   align-self: center
}

.atelier-plate .image-cover {
   overflow: hidden
}

.atelier-plate img {
display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.71) contrast(1.07);
  transition: transform 1.3s var(--ultra-ease), filter .9s;
  border-radius: 25px;
  box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.13);
}

.atelier-plate:hover img {
   transform: scale(1.055);
   filter: saturate(1)
}

.atelier-plate-left {
   height: 590px
}

.atelier-plate-left img {
   object-position: 55% 50%
}

.atelier-plate-right {
   height: 490px;
   transform: translateY(62px)
}

.atelier-plate-right img {
   object-position: 50% 45%
}

.atelier-plate figcaption {
   display: flex;
   justify-content: space-between;
   gap: 10px;
   margin-top: 13px;
   padding-top: 13px;
   border-top: 1px solid #3443374b;
   font: 600 9px var(--ultra-mono);
   letter-spacing: .09em;
   color: #45534b
}

.atelier-collage-center {
   position: relative;
   text-align: center;
   padding: 30px 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center
}

.atelier-ring {
   width: clamp(115px, 15vw, 210px);
   aspect-ratio: 1;
   border-radius: 50%;
   border: 1px dashed #26834768;
   display: grid;
   place-items: center;
   margin-bottom: -5px;
   position: relative
}

.atelier-ring::before,
.atelier-ring::after {
   content: '';
   position: absolute;
   inset: 12%;
   border: 1px solid #31684338;
   border-radius: 50%
}

.atelier-ring::after {
   inset: 26%;
   border-style: dashed
}

.atelier-ring i {
   display: block;
   width: 9px;
   height: 9px;
   background: #21884d;
   box-shadow: 0 0 0 9px #318b4921;
   border-radius: 50%
}

.atelier-collage-center strong {
   font: 900 clamp(95px, 10.5vw, 174px)/.75 var(--ultra-head);
   color: #143422;
   letter-spacing: 0px;
   position: relative;
   z-index: 2
}

.atelier-collage-center strong span {
   color: #26894d;
   font-size: .63em
}

.atelier-collage-center p {
   font: 800 clamp(20px, 2.3vw, 34px)/.9 var(--ultra-head);
   margin: 15px 0 25px;
   text-transform: uppercase
}

.atelier-collage-center small {
   font: 500 9px/1.9 var(--ultra-mono);
   letter-spacing: .05em;
   color: #5c7766
}

.atelier-endline {
   display: flex;
   justify-content: space-between;
   gap: 20px;
   margin-top: 90px;
   padding-top: 26px;
   border-top: 1px solid #253a2c29;
   color: #4b6854;
   font: 600 9px var(--ultra-mono);
   letter-spacing: .09em
}

/* 02 : Service selector / industrial material catalogue */
.atelier-services {
   padding: clamp(95px, 10vw, 160px) 0;
   background: #090e0b;
   color: #f4f7ee
}

.atelier-services::before {
   content: '';
   position: absolute;
   inset: 0;
   pointer-events: none;
   background: radial-gradient(ellipse at 88% 49%, #17432a4d, transparent 54%), repeating-linear-gradient(90deg, transparent 0 149px, #c9e7c908 150px);
   opacity: .85
}

.atelier-services-intro {
   position: relative;
   z-index: 2;
   display: grid;
   grid-template-columns: 1.5fr .5fr;
   align-items: end;
   gap: 35px;
   margin: 62px 0 70px
}

.atelier-services-intro .atelier-big {
   font-size: clamp(80px, 9.2vw, 130px)
}

.atelier-services-intro em {
   color: var(--ultra-lime)
}

.atelier-services-intro p {
   font-size: 15px;
   line-height: 1.85;
   max-width: 335px;
   color: #acc4b1;
   margin: 0 0 10px
}

.atelier-services-layout {
   position: relative;
   display: grid;
   grid-template-columns: .88fr 1.12fr;
   gap: clamp(20px, 3.4vw, 58px);
   min-height: 650px;
   z-index: 2
}

.atelier-service-list {
   display: flex;
   flex-direction: column;
   border-top: 1px solid #a0c69b44;
   min-width: 0
}

.atelier-service-option {
   display: grid;
   position: relative;
   grid-template-columns: 1fr auto;
   align-content: center;
   gap: 14px 10px;
   width: 100%;
   padding: 27px 15px 28px 5px;
   min-height: 128px;
   border: 0;
   border-bottom: 1px solid #b4c8b63b;
   text-align: left;
   background: transparent;
   color: #dbe5da;
   transition: padding-left .4s var(--ultra-ease), background .4s, color .4s
}

.atelier-service-option::before {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   bottom: 0;
   width: 3px;
   background: var(--ultra-lime);
   transform: scaleY(0);
   transform-origin: bottom;
   transition: transform .3s var(--ultra-ease)
}

.atelier-service-option.is-active {
   padding-left: 22px;
   color: var(--ultra-lime);
   background: linear-gradient(90deg, #22422a65, transparent 80%)
}

.atelier-service-option.is-active::before {
   transform: scaleY(1)
}

.atelier-service-n {
   grid-column: 1/-1;
   font: 600 9px var(--ultra-mono);
   letter-spacing: .13em;
   color: #91a992
}

.atelier-service-option strong {
   font: 900 clamp(43px, 5vw, 85px)/.78 var(--ultra-head);
   letter-spacing: -.025em;
   text-transform: uppercase
}

.atelier-service-chevron {
   font: 400 32px Arial;
   align-self: center;
   transition: transform .35s
}

.atelier-service-option.is-active .atelier-service-chevron {
   transform: translate(3px, -3px)
}

.atelier-service-footer {
   margin-top: auto;
   padding: 27px 0;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 15px;
   font: 600 9px var(--ultra-mono);
   color: #809989
}

.atelier-service-footer a {
   color: var(--ultra-lime);
   white-space: nowrap
}

.atelier-service-footer b {
   font-size: 17px
}

.atelier-service-visual {
   position: relative;
   min-height: 650px;
   background: #233226;
   overflow: hidden;
   box-shadow: 0 25px 70px #0004;
   border-radius: 25px !important;
}

.atelier-service-visual>img {
   display: block;
   position: absolute;
   inset: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
   filter: saturate(.8) contrast(1.08);
   transform: scale(1.02);
   transition: opacity .36s ease, transform .8s var(--ultra-ease)
}

.atelier-service-visual.is-swapping>img {
   opacity: .18;
   transform: scale(1.07)
}

.atelier-service-visual-shade {
   position: absolute;
   inset: 0;
   background: linear-gradient(0deg, #07100cf2 0%, #07100ca1 25%, transparent 70%), linear-gradient(180deg, #07100c89, transparent 27%);
   pointer-events: none;
   border-radius: 25px !important;
}

.atelier-service-image-head {
   position: absolute;
   left: 27px;
   right: 27px;
   top: 27px;
   display: flex;
   justify-content: space-between;
   gap: 20px;
   font: 600 9px var(--ultra-mono);
   letter-spacing: .11em;
   color: #edf6eb
}

.atelier-service-cross {
   position: absolute;
   right: 28px;
   top: 56px;
   color: var(--ultra-lime);
   font: 400 50px Arial;
   z-index: 2
}

.atelier-service-visual-caption {
   position: absolute;
   z-index: 2;
   bottom: 32px;
   left: 32px;
   right: 32px
}

.atelier-service-visual-label {
   color: var(--ultra-lime);
   font: 600 9px var(--ultra-mono);
   letter-spacing: .13em
}

.atelier-service-visual-caption p {
   font: 700 clamp(25px, 3.7vw, 52px)/1.02 var(--ultra-head);
   max-width: 540px;
   margin: 15px 0 27px;
   text-transform: uppercase;
   color: #f6f8f4
}

.atelier-service-visual-caption a {
   display: inline-flex;
   align-items: center;
   justify-content: space-between;
   width: 260px;
   max-width: 100%;
   padding: 15px 0;
   border-top: 1px solid #d9f2d078;
   color: var(--ultra-lime);
   font: 700 10px var(--ultra-mono);
   letter-spacing: .09em
}

.atelier-service-visual-caption a span {
   font-size: 24px
}

/* 03 : Restoration with true accessible before/after compare */
.atelier-rebuild {
   padding: clamp(90px, 10vw, 160px) 0;
   background: #dfe3d6;
   color: #0b150e
}

.atelier-rebuild::before {
   content: '';
   position: absolute;
   right: -9%;
   top: 21%;
   height: 560px;
   width: 560px;
   border-radius: 50%;
   border: 1px dashed #266b4549;
   box-shadow: 0 0 0 90px #3d774012, 0 0 0 180px #3d774010;
   pointer-events: none
}

.atelier-rebuild-header {
   position: relative;
   z-index: 2;
   display: grid;
   grid-template-columns: 1.4fr .6fr;
   align-items: end;
   gap: 30px;
   margin: 62px 0 55px
}

.atelier-rebuild-header .atelier-kicker {
   display: block;
   color: #287b46;
   margin-bottom: 25px
}

.atelier-rebuild-header .atelier-big {
   font-size: clamp(85px, 9.5vw, 130px)
}

.atelier-rebuild-header p {
   max-width: 440px;
   color: #3f5244;
   font-size: 17px;
   line-height: 1.85;
   margin: 0 0 10px
}

.atelier-compare {
   position: relative;
   z-index: 2;
   width: 100%;
   height: clamp(500px, 56vw, 760px);
   overflow: hidden;
   background: #14251a;
   cursor: ew-resize;
   touch-action: pan-y;
   user-select: none
}

.atelier-compare>img {
   position: absolute;
   inset: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: 50% 49%;
   pointer-events: none
}

.atelier-compare-before {
   clip-path: inset(0 calc(100% - var(--cut)) 0 0)
}

.atelier-compare::before {
   content: '';
   position: absolute;
   inset: 0;
   z-index: 1;
   background: linear-gradient(180deg, #08130b80, transparent 25%, transparent 75%, #0610087d);
   pointer-events: none
}

.atelier-compare-grid {
   position: absolute;
   inset: 0;
   z-index: 2;
   pointer-events: none;
   background-image: linear-gradient(90deg, #c5eac513 1px, transparent 1px), linear-gradient(#c5eac513 1px, transparent 1px);
   background-size: 120px 120px;
   mix-blend-mode: screen
}

.atelier-compare-badge {
   position: absolute;
   top: 24px;
   z-index: 4;
   padding: 12px 14px;
   background: #101c13ec;
   color: #eff7ed;
   font: 700 10px var(--ultra-mono);
   letter-spacing: .09em
}

.atelier-before-label {
   left: 24px
}

.atelier-after-label {
   right: 24px;
   background: var(--ultra-lime);
   color: #0b140c
}

.atelier-compare-cut {
   position: absolute;
   top: 0;
   bottom: 0;
   left: var(--cut);
   width: 2px;
   transform: translateX(-50%);
   background: #e2ffe0;
   z-index: 4;
   pointer-events: none;
   box-shadow: 0 0 30px #daffd899
}

.atelier-compare-cut span {
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   height: 66px;
   width: 66px;
   border-radius: 50%;
   display: grid;
   place-items: center;
   background: var(--ultra-lime);
   color: #0d2215;
   border: 6px solid #e7f2df;
   font: 700 27px Arial;
   box-shadow: 0 0 20px #0005
}

.atelier-compare input[type=range] {
   position: absolute;
   z-index: 5;
   inset: 0;
   width: 100%;
   height: 100%;
   margin: 0;
   opacity: .01;
   cursor: ew-resize;
   appearance: none;
   -webkit-appearance: none
}

.atelier-compare input[type=range]::-webkit-slider-thumb {
   appearance: none;
   width: 44px;
   height: 100%;
   border: 0
}

.atelier-compare input[type=range]:focus-visible {
   outline: 3px solid var(--ultra-lime);
   outline-offset: -4px;
   opacity: .2
}

.atelier-rebuild-bottom {
   display: grid;
   grid-template-columns: 1fr auto;
   align-items: start;
   gap: 30px;
   margin-top: 28px
}

.atelier-rebuild-steps {
   display: flex;
   gap: 24px;
   flex-wrap: wrap
}

.atelier-rebuild-steps span {
   font: 600 10px var(--ultra-mono);
   letter-spacing: .07em;
   display: flex;
   gap: 12px;
   align-items: center;
   color: #3c5341
}

.atelier-rebuild-steps b {
   display: grid;
   place-items: center;
   height: 35px;
   width: 35px;
   background: #183c22;
   border-radius: 50%;
   color: var(--ultra-lime);
   font-size: 10px
}

.atelier-action {
   display: inline-flex;
   align-items: center;
   justify-content: space-between;
   gap: 40px;
   border-bottom: 2px solid #18693e;
   padding-bottom: 14px;
   font: 700 10px var(--ultra-mono);
   letter-spacing: .07em;
   white-space: nowrap;
   color: #164b2d
}

.atelier-action span {
   font: 400 25px Arial
}

/* 04 : Principles; engineered, not decorative */
.atelier-principles {
   background: #101d15;
   color: #f2f6ee;
   padding: clamp(95px, 10vw, 165px) 0
}

.atelier-principles-glow {
   position: absolute;
   width: 60vw;
   height: 60vw;
   top: -25%;
   right: -20%;
   border-radius: 50%;
   background: radial-gradient(circle, #498e5130, transparent 68%);
   pointer-events: none
}

.atelier-principles-head {
   position: relative;
   z-index: 1;
   margin: 60px 0
}

.atelier-principles-head .atelier-kicker {
   color: #9ed39d;
   display: block;
   margin-bottom: 28px
}

.atelier-principles-head .atelier-big {
   font-size: clamp(89px, 9.9vw, 130px)
}

.atelier-principles-head em {
   color: var(--ultra-lime)
}

.atelier-principles-grid {
   position: relative;
   z-index: 2;
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 14px
}

.atelier-principle {
   position: relative;
   display: flex;
   flex-direction: column;
   min-height: 510px;
   padding: 27px 26px 30px;
   background: #1a2b1f;
   border: 1px solid #d7f6d016;
   transition: transform .55s var(--ultra-ease), border-color .35s, box-shadow .4s;
   overflow: hidden;
   border-radius: 25px;
}

.atelier-principle::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 3px;
   background: var(--ultra-lime);
   transform: scaleX(0);
   transform-origin: left;
   transition: transform .5s var(--ultra-ease);
   border-radius: 25px;
   
}

.atelier-principle:hover {
   transform: translateY(-10px);
   border-color: #c6ffab50;
   box-shadow: 0 27px 65px #0004
}

.atelier-principle:hover::before {
   transform: scaleX(1)
}

.atelier-principle-top {
   display: flex;
   justify-content: space-between;
   gap: 10px;
   color: #a1ba9e;
   font: 600 10px var(--ultra-mono)
}

.atelier-principle-top span:last-child {
   color: var(--ultra-lime);
   font-size: 24px
}

.atelier-principle-symbol {
   margin: 52px 0 auto;
   font: 400 112px/1 var(--ultra-head);
   color: #a3f39c16;
   transform: translateX(0);
   transition: transform .6s, color .5s
}

.atelier-principle:hover .atelier-principle-symbol {
   color: #a3f39c48;
   transform: translateX(14px) rotate(-12deg)
}

.atelier-principle h3 {
   font: 800 clamp(45px, 4.5vw, 77px)/.85 var(--ultra-head);
   letter-spacing: -.03em;
   text-transform: uppercase;
   margin: 25px 0 21px;
   min-height: 110px
}

.atelier-principle p {
   font-size: 14px;
   line-height: 1.77;
   color: #a9c3ab;
   margin: 0 0 28px;
   max-width: 340px
}

.atelier-principle-bottom {
   border-top: 1px solid #d4f9d133;
   padding-top: 17px;
   color: #d0f2c0;
   font: 700 9px var(--ultra-mono);
   letter-spacing: .09em;
   margin-top: auto
}

.atelier-principles-photo {
   height: clamp(365px, 40vw, 640px);
   margin-top: 30px;
   position: relative;
   overflow: hidden;
   background: #1f3822;
   border-radius: 25px;
}

.atelier-principles-photo img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center 40%;
   filter: contrast(1.12) saturate(.72);
   transition: transform 1.2s
}

.atelier-principles-photo:hover img {
   transform: scale(1.05)
}

.atelier-principles-photo::after {
   content: '';
   position: absolute;
   inset: 0;
   background: linear-gradient(90deg, #06120be8 0%, #07130ac7 33%, transparent 72%)
}

.atelier-principles-photo>div {
   position: absolute;
   z-index: 2;
   top: 9%;
   left: 5%;
   bottom: 9%;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   justify-content: space-between
}

.atelier-principles-photo span {
   font: 700 10px var(--ultra-mono);
   color: #b9e7b5;
   letter-spacing: .1em
}

.atelier-principles-photo strong {
   font: 900 clamp(72px, 10vw, 130px)/.8 var(--ultra-head);
   letter-spacing: -.025em;
   color: #f4f7ef
}

.atelier-principles-photo a {
   color: var(--ultra-lime);
   font: 700 11px var(--ultra-mono);
   padding-bottom: 14px;
   border-bottom: 1px solid var(--ultra-lime)
}

/* Final chapter on vivid lime — stark separation from earlier panels */
.atelier-final {
   background: linear-gradient(250deg, rgb(117, 156, 80), rgba(255, 255, 255, 0.86));
   color: #091a0b;
   padding: clamp(95px, 10vw, 175px) 0
}

.atelier-final-inner {
   position: relative;
   display: grid;
   grid-template-columns: 1.4fr .6fr;
   align-items: end;
   gap: 60px
}

.atelier-final-orbit {
   position: absolute;
   right: -9%;
   top: -60%;
   width: 800px;
   height: 800px;
   border-radius: 50%;
   border: 1px solid #1d503130;
   box-shadow: 0 0 0 95px #1d503118, 0 0 0 185px #1d503110;
   pointer-events: none
}

.atelier-final .atelier-kicker {
   color: #206a3b;
   display: block;
   margin-bottom: 34px
}

.atelier-final .atelier-big {
   font-size: clamp(110px, 12vw, 150px)
}

.atelier-final .atelier-big em {
   color: #166d3d
}

.atelier-final-text,
.atelier-final-action {
   position: relative;
   z-index: 1
}

.atelier-final-text p {
   margin: 25px 0 0;
   font: 500 17px/1.6 'DM Sans', sans-serif;
   max-width: 550px;
   color: #24402c
}

.atelier-final-action>a:first-child {
   display: flex;
   align-items: end;
   justify-content: space-between;
   gap: 20px;
   padding: 38px 35px;
   background: #0a1b0c;
   color: var(--ultra-lime);
   font: 800 clamp(46px, 5vw, 75px)/.83 var(--ultra-head);
   letter-spacing: -.025em;
   transition: transform .4s, background .4s;
   border-radius: 25px;
}

.atelier-final-action>a:first-child:hover {
   transform: translateY(-7px);
   background: #1d3c22
}

.atelier-final-action>a:first-child span {
   font: 400 47px Arial;
   align-self: start
}

.atelier-final-phone {
   display: block;
   text-align: right;
   margin-top: 25px;
   font: 700 10px var(--ultra-mono);
   letter-spacing: .07em
}

/* CONTACT hero — distinct from approved HOME hero */
.contact-cinema {
   height: min(890px, 99svh);
   min-height: 700px;
   color: #f5f7f1;
   background: #0a130e
}

.contact-cinema-photo {
   position: absolute;
   inset: 0 0 0 42%;
   overflow: hidden
}

.contact-cinema-photo img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: 50% 45%;
   filter: saturate(.69) contrast(1.10);
   transform: scale(1.04)
}

.contact-cinema-shade {
   position: absolute;
   inset: 0;
   background: linear-gradient(90deg, #08110be8 0%, #08110bd4 35%, #08110b3b 79%), linear-gradient(0deg, #06100bb8, transparent 32%)
}

.contact-cinema-grid {
   position: absolute;
   inset: 0;
   background-image: linear-gradient(90deg, #b4e5b010 1px, transparent 1px), linear-gradient(#b4e5b010 1px, transparent 1px);
   background-size: 109px 109px;
   mask-image: linear-gradient(90deg, transparent, black);
   pointer-events: none
}

.contact-cinema-inner {
   position: relative;
   z-index: 3;
   height: 100%;
   display: flex;
   flex-direction: column;
   padding-top: 125px
}

.contact-breadcrumb {
   font: 600 10px var(--ultra-mono);
   display: flex;
   align-items: center;
   gap: 13px;
   color: #a7b8a8;
   letter-spacing: .08em
}

.contact-breadcrumb a:hover {
   color: var(--ultra-lime)
}

.contact-breadcrumb span:last-child {
   color: var(--ultra-lime)
}

.contact-cinema-copy {
   margin: auto 0;
   max-width: 1150px
}

.contact-cinema-kicker {
   color: #c7e2c4;
   display: flex;
   align-items: center;
   gap: 14px;
   font: 700 10px var(--ultra-mono);
   letter-spacing: .13em
}

.contact-cinema-kicker i {
   width: 31px;
   height: 2px;
   background: var(--ultra-lime)
}

.contact-cinema h1 {
   font: 900 clamp(130px, 13vw, 150px)/.72 var(--ultra-head);
   letter-spacing: 0em;
   text-transform: uppercase;
   margin: 44px 0 42px;
   animation: contactTitle 1s var(--ultra-ease) both
}

.contact-cinema h1 em {
   color: var(--ultra-lime);
   font-style: normal
}

@keyframes contactTitle {
   from {
      opacity: 0;
      transform: translateY(70px)
   }

   to {
      opacity: 1;
      transform: translateY(0)
   }
}

.contact-cinema-copy p {
   max-width: 480px;
   color: #d5e1d6;
   font-size: 17px;
   line-height: 1.7;
   margin: 0 0 36px
}

.contact-cinema-button {
display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  padding: 12px 19px;
  background: var(--ultra-lime);
  color: #0c1b0d;
  font: 700 10px var(--ultra-mono);
  letter-spacing: .06em;
  transition: transform .35s, background .3s;
  border-radius: 25px;
}

.contact-cinema-button:hover {
   transform: translateY(-4px);
   background: #d2ffb7
}

.contact-cinema-button span {
   font-size: 23px
}

.contact-cinema-bottom {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 15px;
   border-top: 1px solid #dcefd029;
   padding-block: 24px;
   color: #bfd3c0;
   font: 600 10px var(--ultra-mono);
   letter-spacing: .1em
}

.contact-rotor {
   position: absolute;
   z-index: 2;
   right: 5%;
   bottom: 14%;
   height: clamp(150px, 18vw, 310px);
   aspect-ratio: 1;
   border: 1px dashed #b0ff9378;
   border-radius: 50%;
   animation: contactRotate 32s linear infinite;
   pointer-events: none
}

.contact-rotor::before,
.contact-rotor::after {
   content: '';
   position: absolute;
   inset: 12%;
   border: 1px dashed #b0ff9345;
   border-radius: 50%
}

.contact-rotor::after {
   inset: 30%;
   background: #b0ff930b;
   border-style: solid
}

.contact-rotor-inner {
   position: absolute;
   top: 0;
   left: 50%;
   width: 10px;
   height: 10px;
   transform: translate(-50%, -50%);
   border-radius: 50%;
   background: var(--ultra-lime);
   box-shadow: 0 0 25px var(--ultra-lime)
}

@keyframes contactRotate {
   to {
      transform: rotate(360deg)
   }
}

/* Contact conversion studio */
.contact-studio {
   background: #e6e8dd;
   padding: clamp(90px, 10vw, 160px) 0;
   color: #101a12
}

.contact-studio-head {
   display: grid;
   grid-template-columns: 1.4fr .6fr;
   gap: 50px;
   align-items: end;
   margin: 64px 0 55px
}

.contact-studio-head .atelier-big {
   font-size: clamp(92px, 10vw, 130px)
}

.contact-studio-head p {
   font-size: 17px;
   line-height: 1.75;
   max-width: 460px;
   color: #4b5a4b;
   margin: 0 0 12px
}

.contact-studio-layout {
   display: grid;
   grid-template-columns: .82fr 1.18fr;
   gap: clamp(25px, 4vw, 65px);
   align-items: start
}

.contact-details {
   min-width: 0;
   position: relative
}

.contact-detail-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-top: 2px solid #173b22;
   padding: 25px 0 32px;
   font: 700 10px var(--ultra-mono);
   letter-spacing: .08em
}

.contact-detail-head i {
   font: 400 30px Arial;
   color: #268249
}

.contact-detail-item {
   border-bottom: 1px solid #173d242a;
   padding-bottom: 31px;
   margin-bottom: 31px
}

.contact-detail-item>span,
.contact-detail-row>div>span {
   display: block;
   font: 700 9px var(--ultra-mono);
   letter-spacing: .1em;
   color: #51715a;
   margin-bottom: 14px
}

.contact-detail-item a {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
   font: 800 clamp(34px, 3.4vw, 60px)/.9 var(--ultra-head);
   letter-spacing: -.025em;
   overflow-wrap: anywhere
}

.contact-detail-item .contact-detail-email {
   font-size: clamp(24px, 2.4vw, 43px)
}

.contact-detail-item i {
   font: 400 24px Arial;
   flex: none;
   color: #22844d
}

.contact-detail-row {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 24px
}

.contact-detail-row address,
.contact-detail-row p {
   font-size: 14px;
   line-height: 1.8;
   color: #344a39;
   font-style: normal;
   margin: 0
}

.contact-detail-image {
   height: 320px;
   margin-top: 55px;
   position: relative;
   overflow: hidden;
   background: #132319
}

.contact-detail-image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   filter: saturate(.65) contrast(1.08);
   transition: transform 1.2s
}

.contact-detail-image:hover img {
   transform: scale(1.06)
}

.contact-detail-image::after {
   content: '';
   position: absolute;
   inset: 0;
   background: linear-gradient(0deg, #0b160bec, transparent 40%)
}

.contact-detail-image span {
   position: absolute;
   z-index: 2;
   left: 20px;
   bottom: 20px;
   color: #eaf6e6;
   font: 700 9px var(--ultra-mono);
   letter-spacing: .09em
}

.contact-premium-form {
   background: #0b1510;
   color: #eaf4e9;
   position: relative;
   padding: clamp(27px, 4vw, 58px);
   box-shadow: 0 40px 90px #1c2f1a26;
   overflow: hidden
}

.contact-premium-form::before {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   width: 250px;
   height: 250px;
   background: radial-gradient(circle, #75cb5c29, transparent 68%);
   pointer-events: none
}

.contact-form-top {
   display: flex;
   justify-content: space-between;
   align-items: center;
   color: #a7bcab;
   font: 700 9px var(--ultra-mono);
   letter-spacing: .12em;
   padding-bottom: 32px;
   border-bottom: 1px solid #c2f1be30
}

.contact-form-icon {
   font-size: 28px;
   color: var(--ultra-lime)
}

.contact-form-intro {
   display: flex;
   justify-content: space-between;
   align-items: end;
   gap: 20px;
   margin: 37px 0 45px
}

.contact-form-intro h3 {
   font: 900 clamp(65px, 7vw, 113px)/.8 var(--ultra-head);
   letter-spacing: -.03em;
   margin: 0
}

.contact-form-intro p {
   font-size: 12px;
   color: #a7b8a9;
   max-width: 180px;
   line-height: 1.7;
   margin: 0
}

.contact-form-grid {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 28px 16px
}

.contact-field {
   position: relative;
   min-width: 0
}

.contact-field input,
.contact-field select,
.contact-field textarea {
   display: block;
   width: 100%;
   appearance: none;
   background: #17251b;
   color: #f2f7ef;
   border: 1px solid #bdd8b73c;
   border-radius: 0;
   padding: 27px 15px 12px;
   min-height: 66px;
   outline: none;
   transition: background .25s, border-color .25s, box-shadow .25s;
   font: 500 14px 'DM Sans', sans-serif
}

.contact-field textarea {
   padding-top: 36px;
   min-height: 160px;
   resize: vertical
}

.contact-field select {
   padding-top: 27px;
   padding-bottom: 12px;
   color: #d8e9d7
}

.contact-field label {
   position: absolute;
   left: 15px;
   top: 23px;
   pointer-events: none;
   color: #bac9b9;
   font: 700 10px var(--ultra-mono);
   letter-spacing: .07em;
   transition: transform .2s, top .2s, font-size .2s, color .2s
}

.contact-select label,
.contact-field:focus-within label,
.contact-field input:not(:placeholder-shown)+label,
.contact-field textarea:not(:placeholder-shown)+label {
   top: 9px;
   color: var(--ultra-lime);
   font-size: 8px
}

.contact-field label b {
   color: var(--ultra-lime);
   font-weight: 700
}

.contact-field input:focus,
.contact-field select:focus,
.contact-field textarea:focus {
   border-color: var(--ultra-lime);
   box-shadow: 0 0 0 2px #affb6733;
   background: #1d3022
}

.contact-field-full {
   grid-column: 1/-1
}

.contact-form-submit {
   margin-top: 27px
}

.contact-form-submit button {
display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
  padding: 12px 19px;
  background: var(--ultra-lime);
  color: #0b190d;
  border: 0;
  font: 800 11px var(--ultra-mono);
  letter-spacing: .05em;
  transition: background .25s, transform .3s;
  border-radius: 25px;

}

.contact-form-submit button:hover {
   background: #d7ffbd;
   transform: translateY(-3px)
}

.contact-form-submit button b {
   font: 400 27px Arial
}

.contact-form-submit button:disabled {
   opacity: .58;
   cursor: wait;
   transform: none
}

.contact-form-submit #form-status {
   min-height: 18px;
   font-size: 12px;
   line-height: 1.5;
   color: #d2e7ca;
   margin: 15px 0 0
}

.contact-form-disclosure {
   font-size: 11px;
   line-height: 1.75;
   color: #a6b9a8;
   border-top: 1px solid #badab223;
   padding-top: 22px;
   margin: 18px 0 0
}

.contact-form-disclosure strong {
   color: #e0f1d6
}

/* Location as a piece of visual brand storytelling */
.contact-location {
   background: #101c14;
   color: #f3f7f0;
   padding: clamp(90px, 10vw, 155px) 0
}

.contact-location-grid {
   display: grid;
   grid-template-columns: .85fr 1.15fr;
   gap: clamp(30px, 4vw, 68px);
   margin-top: 64px;
   align-items: center
}

.contact-location-content .atelier-kicker {
   display: block;
   color: #a5dcaa;
   margin-bottom: 26px
}

.contact-location-content .atelier-big {
   font-size: clamp(86px, 8.7vw, 130px)
}

.contact-location-content .atelier-big em {
   color: var(--ultra-lime)
}

.contact-location-content>p {
   font-size: 16px;
   line-height: 1.85;
   color: #b7cbb7;
   max-width: 490px;
   margin: 36px 0
}

.contact-directions {
   display: inline-flex;
   align-items: center;
   justify-content: space-between;
   gap: 40px;
   min-width: 270px;
   border-bottom: 1px solid var(--ultra-lime);
   color: var(--ultra-lime);
   padding-bottom: 14px;
   font: 700 10px var(--ultra-mono)
}

.contact-directions span {
   font: 400 25px Arial
}

.contact-location-tag {
   margin-top: 70px;
   color: #7eac82;
   font: 600 9px var(--ultra-mono);
   letter-spacing: .13em
}

.contact-map-shell {
   background: #1a2c1e;
   padding: 16px;
   min-height: 620px;
   display: flex;
   border-radius: 25px;
   flex-direction: column;
   border: 1px solid #bdd5b022
}

.contact-map-top,
.contact-map-bottom {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 14px;
   font: 700 9px var(--ultra-mono);
   letter-spacing: .07em;
   padding: 7px 3px 19px;
   color: #c7daca
}

.contact-map-shell iframe {
   width: 100%;
   border: 0;
   min-height: 500px;
   flex: 1;
   filter: grayscale(.7) contrast(1.05)
}

.contact-map-bottom {
   padding: 19px 3px 5px;
   border-top: 0;
   color: var(--ultra-lime)
}

.contact-map-bottom span {
   font-size: 23px
}

.contact-signoff {
   background:linear-gradient(250deg, rgb(117, 156, 80), rgba(255, 255, 255, 0.86));
   padding: 72px 0;
   color: #0b220f
}

.contact-signoff-grid {
   display: flex;
   align-items: end;
   justify-content: space-between;
   gap: 50px
}

.contact-signoff-grid>div>span {
   display: block;
   margin-bottom: 17px;
   color: #215e31;
   font: 700 10px var(--ultra-mono)
}

.contact-signoff h2 {
   font: 900 clamp(60px, 6.3vw, 110px)/.82 var(--ultra-head);
   letter-spacing: -.025em;
   margin: 0
}

.contact-signoff h2 em {
   color: #247c49;
   font-style: normal
}

.contact-signoff-grid>a {
background: #0b190c;
  color: var(--ultra-lime);
  padding: 12px 19px;
  min-width: 220px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  font: 700 10px var(--ultra-mono);
  white-space: nowrap;
  border-radius: 25px;
}

.contact-signoff-grid>a span {
   font: 400 28px Arial
}

/* Motion enhancements only in the pages where stylesheet is loaded. */
.hp-reveal,
.hp-media,
.hp-words {
   transition: opacity .85s var(--ultra-ease), transform 1.05s var(--ultra-ease)
}

body.ultra-motion .hp-reveal {
   opacity: 0;
   transform: translateY(45px)
}

body.ultra-motion .hp-media {
   opacity: .76;
   transform: translateY(45px)
}

body.ultra-motion .hp-words {
   opacity: 0;
   transform: translateY(55px)
}

body.ultra-motion .hp-reveal.hp-visible,
body.ultra-motion .hp-media.hp-visible,
body.ultra-motion .hp-words.hp-visible {
   opacity: 1;
   transform: translateY(0)
}

/* RESPONSIVE */
@media(max-width:1250px) {
   .atelier-intro-top {
      grid-template-columns: 1.25fr .75fr
   }

   .atelier-intro-titlewrap .atelier-big {
      font-size: clamp(85px, 9.8vw, 150px)
   }

   .atelier-collage {
      min-height: 530px
   }

   .atelier-plate-left {
      height: 500px
   }

   .atelier-plate-right {
      height: 400px
   }

   .atelier-services-layout {
      grid-template-columns: 1fr 1fr;
      min-height: 540px
   }

   .atelier-service-visual {
      min-height: 540px
   }

   .atelier-service-option {
      min-height: 112px
   }

   .atelier-service-option strong {
      font-size: clamp(42px, 4.5vw, 65px)
   }

   .atelier-principle {
      min-height: 485px
   }

   .contact-studio-layout {
      gap: 30px
   }

   .contact-form-intro {
      display: block
   }

   .contact-form-intro p {
      max-width: none;
      margin-top: 16px
   }
}

@media(max-width:980px) {
   .atelier-big {
      font-size: clamp(80px, 10.8vw, 135px)
   }

   .atelier-intro-top,
   .atelier-services-intro,
   .atelier-rebuild-header,
   .contact-studio-head {
      grid-template-columns: 1fr
   }

   .atelier-intro-top {
      gap: 35px;
      margin: 50px 0 55px
   }

   .atelier-intro-note {
      max-width: 700px;
      margin-left: 10%;
   }

   .atelier-collage {
      grid-template-columns: 1fr .63fr 1fr;
      min-height: 400px
   }

   .atelier-plate-left {
      height: 390px
   }

   .atelier-plate-right {
      height: 320px
   }

   .atelier-collage-center strong {
      font-size: 110px
   }

   .atelier-collage-center p {
      font-size: 23px
   }

   .atelier-ring {
      width: 120px
   }

   .atelier-services-intro p,
   .atelier-rebuild-header p,
   .contact-studio-head p {
      max-width: 700px
   }

   .atelier-services-layout {
      gap: 18px;
      grid-template-columns: .85fr 1.15fr
   }

   .atelier-service-option strong {
      font-size: 48px
   }

   .atelier-service-visual {
      min-height: 570px
   }

   .atelier-rebuild-header .atelier-big {
      font-size: clamp(88px, 10.5vw, 130px)
   }

   .atelier-rebuild-bottom {
      grid-template-columns: 1fr
   }

   .atelier-rebuild-steps {
      justify-content: space-between
   }

   .atelier-principles-grid {
      gap: 8px
   }

   .atelier-principle {
      padding: 20px 16px;
      min-height: 480px
   }

   .atelier-principle h3 {
      font-size: 46px
   }

   .atelier-final-inner {
      grid-template-columns: 1fr
   }

   .atelier-final-action {
      max-width: 480px
   }

   .atelier-final .atelier-big {
      font-size: clamp(115px, 14vw, 180px)
   }

   .contact-cinema-photo {
      left: 24%
   }

   .contact-cinema h1 {
      font-size: clamp(115px, 14vw, 175px)
   }

   .contact-studio-layout {
      grid-template-columns: 1fr
   }

   .contact-details {
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: 30px
   }

   .contact-detail-head {
      grid-column: 1/-1
   }

   .contact-detail-row {
      grid-column: 1/-1
   }

   .contact-detail-image {
      grid-column: 1/-1;
      height: 270px;
      margin: 25px 0 0
   }

   .contact-location-grid {
      grid-template-columns: 1fr
   }

   .contact-location-content .atelier-big {
      font-size: clamp(92px, 13vw, 155px)
   }

   .contact-location-tag {
      margin-top: 35px
   }

   .contact-map-shell {
      min-height: 510px
   }

   .contact-map-shell iframe {
      min-height: 425px
   }
}

@media(max-width:700px) {
   .atelier-rule {
      font-size: 8px;
      padding-bottom: 17px
   }

   .atelier-rule>span:last-child {
      display: none
   }

   .atelier-intro,
   .atelier-services,
   .atelier-rebuild,
   .atelier-principles,
   .contact-studio,
   .contact-location {
      padding: 90px 0
   }

   .atelier-intro-top {
      margin: 45px 0
   }

   .atelier-intro-titlewrap .atelier-big {
      font-size: clamp(69px, 13.5vw, 106px)
   }

   .atelier-intro-note {
      margin-left: 0;
      padding-left: 19px
   }

   .atelier-intro-note p:first-of-type {
      font-size: 17px
   }

   .atelier-intro-note p {
      font-size: 13px
   }

   .atelier-collage {
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      min-height: 0
   }

   .atelier-plate-left {
      height: 330px
   }

   .atelier-plate-right {
      height: 275px;
      transform: translateY(45px)
   }

   .atelier-collage-center {
      grid-column: 1/-1;
      grid-row: 2;
      padding-top: 90px;
      padding-bottom: 0;
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 12px 22px;
      text-align: left;
      justify-content: start
   }

   .atelier-ring {
      position: absolute;
      top: 46px;
      left: 0;
      width: 155px;
      opacity: .4
   }

   .atelier-collage-center strong {
      font-size: 122px;
      grid-row: 1/3
   }

   .atelier-collage-center p {
      grid-column: 2;
      font-size: 29px;
      align-self: end
   }

   .atelier-collage-center small {
      grid-column: 2;
      align-self: start
   }

   .atelier-plate figcaption {
      font-size: 7px
   }

   .atelier-plate figcaption span:last-child {
      display: none
   }

   .atelier-endline {
      margin-top: 55px;
      font-size: 8px
   }

   .atelier-endline span:last-child {
      display: none
   }

   .atelier-services-intro {
      margin: 45px 0 40px
   }

   .atelier-services-intro .atelier-big {
      font-size: clamp(70px, 13.5vw, 108px)
   }

   .atelier-services-intro p {
      font-size: 13px
   }

   .atelier-services-layout {
      grid-template-columns: 1fr
   }

   .atelier-service-list {
      order: 2
   }

   .atelier-service-visual {
      order: 1;
      min-height: 470px
   }

   .atelier-service-option {
      min-height: 78px;
      padding: 17px 14px 17px 4px;
      grid-template-columns: 1fr auto;
      gap: 8px
   }

   .atelier-service-option strong {
      font-size: 50px
   }

   .atelier-service-option.is-active {
      padding-left: 14px
   }

   .atelier-service-n {
      font-size: 8px
   }

   .atelier-service-visual-caption p {
      font-size: 42px
   }

   .atelier-service-footer {
      padding: 23px 0 0
   }

   .atelier-rebuild-header {
      margin: 45px 0 30px
   }

   .atelier-rebuild-header .atelier-big {
      font-size: clamp(75px, 13vw, 118px)
   }

   .atelier-rebuild-header p {
      font-size: 13px
   }

   .atelier-compare {
      height: 440px
   }

   .atelier-compare-badge {
      font-size: 8px;
      top: 14px;
      padding: 9px
   }

   .atelier-before-label {
      left: 12px
   }

   .atelier-after-label {
      right: 12px
   }

   .atelier-rebuild-steps {
      gap: 12px
   }

   .atelier-rebuild-steps span {
      font-size: 8px
   }

   .atelier-rebuild-steps b {
      height: 26px;
      width: 26px
   }

   .atelier-action {
      width: fit-content;
      font-size: 9px
   }

   .atelier-principles-head {
      margin: 45px 0 40px
   }

   .atelier-principles-head .atelier-big {
      font-size: clamp(78px, 12.5vw, 112px)
   }

   .atelier-principles-grid {
      grid-template-columns: 1fr
   }

   .atelier-principle {
      min-height: 310px;
      padding: 24px
   }

   .atelier-principle-symbol {
      position: absolute;
      right: 30px;
      top: 32px;
      font-size: 140px;
      margin: 0
   }

   .atelier-principle h3 {
      margin: 80px 0 18px;
      font-size: 60px;
      min-height: unset;
      position: relative
   }

   .atelier-principle p {
      position: relative;
      font-size: 13px
   }

   .atelier-principles-photo {
      height: 440px;
      margin-top: 16px
   }

   .atelier-principles-photo>div {
      left: 22px;
      top: 25px;
      bottom: 25px
   }

   .atelier-principles-photo strong {
      font-size: clamp(68px, 15vw, 115px)
   }

   .atelier-principles-photo span {
      font-size: 8px
   }

   .atelier-final-inner {
      gap: 50px
   }

   .atelier-final .atelier-big {
      font-size: clamp(100px, 19vw, 155px)
   }

   .atelier-final-text p {
      font-size: 14px
   }

   .atelier-final-action>a:first-child {
      padding: 27px;
      font-size: 58px
   }

   .contact-cinema {
      min-height: 675px;
      height: 800px
   }

   .contact-cinema-photo {
      left: 0;
      opacity: .73
   }

   .contact-cinema-shade {
      background: linear-gradient(90deg, #07100cec, #07100cb0 78%), linear-gradient(0deg, #061008e8, transparent 40%)
   }

   .contact-cinema-inner {
      padding-top: 102px
   }

   .contact-cinema h1 {
      font-size: clamp(93px, 17.5vw, 142px);
      margin: 34px 0 30px
   }

   .contact-cinema-copy p {
      font-size: 14px;
      max-width: 360px
   }

   .contact-cinema-kicker {
      font-size: 8px
   }

   .contact-cinema-button {
      padding: 16px 17px;
      font-size: 9px
   }

   .contact-cinema-bottom {
      font-size: 8px
   }

   .contact-cinema-bottom span:last-child {
      display: none
   }

   .contact-rotor {
      bottom: 8%;
      right: -8%;
      height: 180px;
      opacity: .55
   }

   .contact-studio-head {
      margin: 45px 0 35px
   }

   .contact-studio-head .atelier-big {
      font-size: clamp(73px, 13.4vw, 105px)
   }

   .contact-studio-head p {
      font-size: 13px
   }

   .contact-details {
      display: block
   }

   .contact-detail-image {
      height: 250px;
      margin-top: 30px
   }

   .contact-detail-item a {
      font-size: 46px
   }

   .contact-detail-item .contact-detail-email {
      font-size: clamp(25px, 5.6vw, 40px)
   }

   .contact-premium-form {
      padding: 26px 20px
   }

   .contact-form-intro h3 {
      font-size: 85px
   }

   .contact-form-grid {
      grid-template-columns: 1fr;
      gap: 14px
   }

   .contact-field-full {
      grid-column: auto
   }

   .contact-location-grid {
      margin-top: 45px
   }

   .contact-location-content .atelier-big {
      font-size: clamp(80px, 13vw, 112px)
   }

   .contact-location-content>p {
      font-size: 13px
   }

   .contact-map-shell {
      padding: 9px;
      min-height: 430px
   }

   .contact-map-shell iframe {
      min-height: 360px
   }

   .contact-map-top,
   .contact-map-bottom {
      font-size: 7px
   }

   .contact-signoff-grid {
      display: block
   }

   .contact-signoff-grid>a {
      margin-top: 25px;
      width: fit-content
   }

   .contact-signoff h2 {
      font-size: clamp(64px, 12vw, 95px)
   }
}

@media(max-width:390px) {
   .atelier-intro-titlewrap .atelier-big {
      font-size: 13.1vw
   }

   .atelier-services-intro .atelier-big {
      font-size: 13vw
   }

   .atelier-rebuild-header .atelier-big {
      font-size: 12.6vw
   }

   .atelier-principles-head .atelier-big {
      font-size: 12vw
   }

   .atelier-plate-left {
      height: 260px
   }

   .atelier-plate-right {
      height: 215px
   }

   .atelier-collage-center strong {
      font-size: 100px
   }

   .atelier-collage-center p {
      font-size: 25px
   }

   .atelier-service-visual {
      min-height: 385px
   }

   .atelier-service-visual-caption {
      left: 20px;
      bottom: 18px;
      right: 20px
   }

   .atelier-service-visual-caption p {
      font-size: 34px
   }

   .atelier-service-image-head {
      left: 18px;
      right: 18px;
      top: 15px;
      font-size: 8px
   }

   .atelier-service-option strong {
      font-size: 43px
   }

   .atelier-compare {
      height: 340px
   }

   .atelier-principle h3 {
      font-size: 53px
   }

   .atelier-final .atelier-big {
      font-size: 18vw
   }

   .contact-cinema h1 {
      font-size: 17vw
   }

   .contact-detail-row {
      grid-template-columns: 1fr;
      gap: 18px
   }

   .contact-studio-head .atelier-big {
      font-size: 12.6vw
   }

   .contact-location-content .atelier-big {
      font-size: 12.6vw
   }
}

@media(prefers-reduced-motion:reduce) {

   .atelier-service-option,
   .atelier-plate img,
   .atelier-principle,
   .atelier-principles-photo img,
   .contact-rotor,
   .contact-cinema h1 {
      animation: none !important;
      transition: none !important
   }

   .hp-reveal,
   .hp-media,
   .hp-words,
   body.ultra-motion .hp-reveal,
   body.ultra-motion .hp-media,
   body.ultra-motion .hp-words {
      opacity: 1 !important;
      transform: none !important
   }
}

/* Privacy-friendly interactive map, user-initiated load with designed fallback */
.contact-map-shell {
   position: relative
}

.contact-map-preview {
   position: relative;
   flex: 1;
   min-height: 500px;
   overflow: hidden;
   background: radial-gradient(ellipse at 55% 50%, #274832 0%, #193524 48%, #0c2017 100%);
   display: grid;
   place-items: center
}

.contact-map-preview::before {
   content: '';
   position: absolute;
   inset: 0;
   opacity: .6;
   background-image: linear-gradient(90deg, #a2dda61a 1px, transparent 1px), linear-gradient(#a2dda61a 1px, transparent 1px);
   background-size: 55px 55px;
   transform: rotate(-12deg) scale(1.35)
}

.contact-map-street {
   position: absolute;
   z-index: 1;
   background: #9cdd9250;
   box-shadow: 0 0 0 13px #a0cc9f0d;
   transform-origin: center
}

.contact-map-street.street-a {
   width: 150%;
   height: 17px;
   transform: rotate(-33deg)
}

.contact-map-street.street-b {
   width: 130%;
   height: 7px;
   transform: rotate(43deg) translateY(140px)
}

.contact-map-street.street-c {
   width: 120%;
   height: 6px;
   transform: rotate(-70deg) translateX(-160px)
}

.contact-map-coordinates {
   position: absolute;
   top: 27px;
   left: 27px;
   z-index: 2;
   display: grid;
   gap: 7px;
   color: #c2e9bc;
   font: 600 10px var(--ultra-mono);
   letter-spacing: .14em
}

.contact-map-coordinates span {
   font-size: 8px;
   color: #7ea683
}

.contact-map-pin {
   position: relative;
   z-index: 2;
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   padding: 30px 12px;
   gap: 10px;
   color: #f6fff2;
   text-shadow: 0 2px 12px #000a
}

.contact-map-pin-icon {
   height: 95px;
   width: 95px;
   border: 2px solid var(--ultra-lime);
   border-radius: 50%;
   display: grid;
   place-items: center;
   color: var(--ultra-lime);
   font-size: 43px;
   background: #0c281bab;
   box-shadow: 0 0 0 20px #b1ff8520, 0 0 0 45px #b1ff850b;
   margin-bottom: 22px
}

.contact-map-pin strong {
   font: 800 clamp(28px, 3.5vw, 50px)/1 var(--ultra-head);
   letter-spacing: .015em
}

.contact-map-pin>span:last-child {
   font: 600 10px var(--ultra-mono);
   letter-spacing: .1em;
   color: #a7dca7
}

.contact-map-load {
position: absolute;
  z-index: 4;
  left: 24px;
  right: 24px;
  bottom: 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  background: var(--ultra-lime);
  color: #0b1f11;
  padding: 12px 17px;
  border: 0;
  font: 800 10px var(--ultra-mono);
  letter-spacing: .04em;
  transition: background .3s;
  border-radius: 25px;
}

.contact-map-load:hover {
   background: #d6ffc1
}

.contact-map-load span {
   font: 400 24px Arial
}

.contact-map-shell iframe {
   display: none
}

.contact-map-shell.map-loaded iframe {
   display: block
}

.contact-map-shell.map-loaded .contact-map-preview {
   display: none
}

@media(max-width:700px) {
   .contact-map-preview {
      min-height: 390px
   }

   .contact-map-pin-icon {
      height: 75px;
      width: 75px;
      font-size: 33px
   }

   .contact-map-coordinates {
      top: 15px;
      left: 15px;
      font-size: 8px
   }

   .contact-map-load {
      left: 12px;
      right: 12px;
      bottom: 12px;
      padding: 17px;
      font-size: 8px
   }
}