/* Contact is an arrival at Velia: one reception, useful actions, one illustrated route. */
.contact-experience{--contact-soft:#eaddd2;--contact-coral:#f87b67;--contact-dark:#35202f}
.contact-experience [hidden]{display:none!important}
.contact-experience h2{font-size:clamp(56px,6.6vw,104px);line-height:1.04}
.contact-experience button,.contact-experience input,.contact-experience textarea{font-family:inherit}
.contact-experience button:focus-visible,.contact-experience a:focus-visible,.contact-experience input:focus-visible,.contact-experience textarea:focus-visible,.contact-experience summary:focus-visible{outline:2px solid currentColor;outline-offset:6px}
.contact-experience .section{scroll-margin-top:32px}
.contact-experience .eyebrow{margin-bottom:25px}
.contact-hero{position:relative;min-height:760px;height:calc(100svh - 112px);max-height:1040px;isolation:isolate;overflow:hidden;background:#35202f;color:var(--cream)}
.contact-hero-photo{position:absolute;inset:0;z-index:-3;transform:translateY(var(--contact-depth,0px));will-change:transform}
.contact-hero-scene{position:absolute;width:var(--scene-width,100%);height:var(--scene-height,100%);left:var(--scene-x,0);top:var(--scene-y,0);transform:scale(1.04);animation:reception-arrive 2.4s cubic-bezier(.2,.7,.2,1) both}
.contact-hero-scene>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reception-counter{clip-path:polygon(55.5% 47.5%,60% 46.2%,64% 46.1%,77% 47.5%,100% 49.8%,100% 100%,55.5% 100%);z-index:2}
.contact-hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#21141ddb 0%,#2d1b2c87 32%,#25182a10 70%),linear-gradient(0deg,#20111dab,transparent 35%)}
.contact-hero-copy{padding:65px var(--edge) 95px;max-width:1000px}
.contact-experience .contact-hero h1{font:500 clamp(112px,14.6vw,230px)/.79 Manrope,sans-serif;letter-spacing:-.08em;margin:37px 0 38px;max-width:650px}
.contact-hero h1>span{display:block}.contact-hero h1>span+span{margin-top:12px}
.contact-dot{color:#ff9782}
.contact-experience .contact-hero-welcome{font-size:clamp(23px,2.1vw,34px)!important;font-weight:450;line-height:1.35;margin-top:28px}
.contact-hero-actions{display:flex;align-items:center;gap:30px;flex-wrap:wrap;margin-top:30px}
.contact-experience .contact-hero-actions .button{background:var(--contact-coral);color:#35202f;border-radius:4px;min-height:62px}
.contact-experience .contact-hero-actions .button:hover{background:#ffb29d;transform:translateY(-3px)}
.contact-inline-link{display:inline-block;width:fit-content;font-size:17px;font-weight:600;border-bottom:1px solid currentColor;padding:13px 0;text-decoration:none;min-height:48px}
.contact-inline-link:hover{color:var(--copper)}
.contact-hero .contact-inline-link:hover{color:#ffb29d}
.contact-hero-foot{position:absolute;bottom:24px;left:var(--edge);right:var(--edge);display:flex;justify-content:space-between;align-items:center;border-top:1px solid #fff5;padding-top:16px;font-size:14px;gap:20px}
.contact-hero-foot>a{padding:6px 0;border-bottom:1px solid #fff5}
.reception-greeting{position:absolute;left:65.5%;bottom:48%;width:11%;transform:translateX(-50%);z-index:1;clip-path:inset(-20% -30% 0)}
.reception-greeting>.veli-actor{width:100%;transform:translateY(100%);transition:transform .65s cubic-bezier(.22,1,.36,1)}
.reception-greeting.is-greeted .veli-actor{transform:translateY(0)}
.reception-greeting .veli-ground{display:none}
@keyframes reception-arrive{from{transform:scale(1.105)}to{transform:scale(1.04)}}

.contact-reception{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);gap:8vw;background:var(--cream);align-items:start}
.contact-reception-main h2{margin-bottom:27px}
.contact-reception-intro{color:var(--muted)}
.contact-actions{margin-top:45px;border-top:1px solid #35202f35}
.contact-action{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:22px;padding:27px 0;width:100%;text-align:left;border-bottom:1px solid #35202f35;isolation:isolate}
.contact-action:before{content:'';position:absolute;inset:0 -18px;background:#f2dcd0;z-index:-1;transform:scaleY(0);transform-origin:bottom;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
a.contact-action:hover:before,button.contact-action:hover:before,.contact-action:focus-visible:before{transform:scaleY(1)}
.contact-action-icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.contact-action strong{display:block;font-size:clamp(21px,2vw,30px);font-weight:550;letter-spacing:-.04em;line-height:1.25}
.contact-action small{display:block;font-size:15px;line-height:1.6;margin-top:8px;color:var(--muted)}
.contact-action-word{font-size:14px;white-space:nowrap;color:var(--copper);padding-left:6px}
.contact-action-pending .contact-action-word{color:var(--muted)}
.contact-hours{background:var(--contact-dark);color:var(--cream);padding:46px 38px 33px;position:relative;margin-top:6px}
.contact-hours:before{content:'';position:absolute;width:45%;height:5px;background:var(--contact-coral);top:0;left:38px}
.contact-experience .contact-hours h2{font-size:clamp(52px,5.3vw,84px);margin:20px 0 38px}
.contact-experience .contact-hours h2 em{color:#ff9c87}
.contact-hours dl{border-top:1px solid #f8f3eb40}
.contact-hours dl>div{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid #f8f3eb30;padding:17px 0;font-size:16px;line-height:1.5}
.contact-hours dd{white-space:nowrap}.contact-hours dt{color:#f8f3ebc4}
.contact-experience .contact-hours-note{font-size:13px!important;line-height:1.6;color:#f8f3ebb5;margin-top:20px}
.contact-tour-link{display:flex;text-align:left;gap:17px;align-items:center;border-top:1px solid #f8f3eb40;margin-top:32px;padding-top:26px;width:100%;font-size:17px}
.contact-tour-link small{display:block;font-size:13px;color:#f8f3ebaa;margin-top:5px}
.contact-play{width:40px;height:40px;border:1px solid #f8f3eb66;border-radius:50%;display:grid;place-items:center;font-size:12px;transition:background .25s;flex-shrink:0}
.contact-tour-link:hover .contact-play{background:#f87b67;color:var(--ink);border-color:#f87b67}

.contact-message{background:#f6a48d;position:relative;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:7vw;animation:contact-panel-enter .4s ease-out}
.contact-message-close{position:absolute;right:var(--edge);top:25px;font-size:15px;display:flex;align-items:center;gap:16px;min-height:44px}
.contact-message-close>span{font-size:30px;line-height:1}
.contact-message h2{margin-bottom:25px}.contact-experience .contact-message h2 em{color:#632d3e}
.contact-experience .contact-demo-note{font-size:14px!important;line-height:1.6;margin-top:28px;max-width:250px}
.contact-form{padding-top:5px;min-width:0}
.contact-form fieldset{border:0;min-width:0;margin:0;padding:0}
.contact-form-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.contact-form label{display:block;font-size:17px;font-weight:600;line-height:1.5}
.contact-form input,.contact-form textarea{display:block;width:100%;border:0;border-bottom:1px solid #35202f80;background:#fff2;padding:18px 14px;font-size:18px;line-height:1.6;border-radius:0;margin-top:12px;color:var(--ink);resize:vertical;transition:background .2s}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:#6b424b;opacity:1;font-weight:400}
.contact-form input:focus,.contact-form textarea:focus{background:#fff4}
.contact-form-pair+label{margin-top:28px}.contact-form textarea{min-height:150px;max-height:500px}
.contact-form-bottom{display:flex;flex-direction:column;align-items:start;gap:23px;margin-top:20px}
.contact-form-bottom>span{font-size:14px;line-height:1.5}
.contact-experience .contact-form-error{font-size:16px!important;margin-top:14px;font-weight:650}
.contact-message-success{align-self:center;display:flex;gap:22px;align-items:center;max-width:600px}
.contact-message-success>.veli-actor{width:130px}
.contact-message-success h3{font-size:40px;line-height:1.15;margin:12px 0 20px}
.contact-message-success .eyebrow{margin:0}
.contact-message-success .contact-inline-link{margin-top:15px;text-align:left}
@keyframes contact-panel-enter{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

.contact-arrival{background:#eaddd2}
.arrival-heading{margin-bottom:55px}.arrival-heading h2{margin-bottom:28px}.arrival-heading>p:last-child{color:#6d5960;max-width:590px}
.arrival-composition{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(350px,.7fr);gap:48px;align-items:center}
.arrival-map{position:relative;width:100%;min-width:0;background:#eee7dd;overflow:hidden;border:1px solid #d4c3b7;isolation:isolate;align-self:stretch;min-height:540px}
.arrival-drawing{position:absolute;width:100%;height:auto;aspect-ratio:1000/580;top:50%;transform:translateY(-50%);stroke:none;stroke-width:0}
.map-park{fill:#d5d9c9}.map-park circle{fill:#b7c3aa;opacity:.8}
.map-blocks{fill:#dacdc1;stroke:#cbbbad;stroke-width:2}
.map-streets{fill:none;stroke:#fffaf1;stroke-width:37;stroke-linejoin:round}
.map-route{fill:none;stroke:#b75742;stroke-width:6;stroke-linecap:round;stroke-linejoin:round;opacity:0;stroke-dasharray:1;stroke-dashoffset:0}
.map-route.is-active{opacity:1}.map-route.is-tracing{animation:route-trace 1.8s linear both}
.map-salon-shadow{fill:#35202f25}.map-salon{fill:#35202f}.map-door{stroke:#f87b67;stroke-width:7}
.map-brand{fill:#fff8ef;font:600 31px Manrope,sans-serif;letter-spacing:-1.4px}.map-salon-label{fill:#ffb7a4;font:500 10px Manrope,sans-serif;letter-spacing:2.2px}
.map-starts{fill:var(--cream);stroke:#98827a;stroke-width:2}.map-starts text{fill:#654950;stroke:none;font:600 20px Manrope,sans-serif}
.arrival-runner{position:absolute;width:70px;transform:translate(-50%,-87%);z-index:2;pointer-events:none}
.arrival-runner>.veli-actor{width:100%}
.map-concept{position:absolute;left:22px;bottom:18px;right:22px;font-size:13px;line-height:1.5;color:#69535b}
.arrival-info{min-width:0}.arrival-address{padding-bottom:24px;border-bottom:1px solid #35202f35}
.arrival-address>.eyebrow{display:block;margin-bottom:13px}
.contact-experience .arrival-address>p:not(.arrival-location-note),.arrival-address address{font-size:28px!important;line-height:1.4;font-style:normal;letter-spacing:-.04em}
.arrival-address strong{font-weight:550}
.contact-experience .arrival-location-note{font-size:14px!important;line-height:1.5;margin-top:12px;color:#69535b}
.arrival-tabs{display:flex;gap:22px;margin:27px 0}
.arrival-tabs>button{font-size:16px;line-height:1.5;min-height:48px;padding:9px 0;border-bottom:2px solid transparent;white-space:nowrap}
.arrival-tabs>button[aria-selected=true]{border-color:var(--copper);color:var(--copper);font-weight:650}
.arrival-panel{min-height:245px}
.arrival-panel h3{font-size:27px;line-height:1.25;margin-bottom:16px;max-width:350px}
.contact-experience .arrival-panel>p{font-size:16px!important;line-height:1.7}
.contact-experience .arrival-panel .arrival-detail{font-size:13px!important;line-height:1.6;margin-top:18px;color:#69535b}
.contact-experience .arrival-veli-line{font-size:16px!important;font-weight:650;min-height:30px;padding-top:8px;margin-bottom:23px}
.arrival-info .button:disabled{opacity:.55;cursor:default}
.arrival-route-note{font-size:13px;line-height:1.5;display:block;margin-top:13px;color:#69535b}
@keyframes route-trace{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.contact-questions{display:grid;grid-template-columns:1fr 1.2fr;gap:9vw;align-items:start}
.contact-questions h2{margin-bottom:28px}
.contact-question-list{border-top:1px solid var(--line)}
.contact-question-list details{border-bottom:1px solid var(--line);padding:27px 0}
.contact-question-list summary{display:flex;justify-content:space-between;gap:24px;list-style:none;cursor:pointer;font-size:21px;line-height:1.5;font-weight:550;letter-spacing:-.02em}
.contact-question-list summary::-webkit-details-marker{display:none}
.contact-question-list summary>span{font-size:27px;transition:transform .25s;flex-shrink:0}
.contact-question-list details[open] summary>span{transform:rotate(45deg)}
.contact-question-list details>p{margin-top:17px;color:var(--muted)}

@media(min-width:1600px){.contact-hero-copy{padding-top:80px}.contact-hero{min-height:860px}}
@media(max-width:1150px){
 .contact-reception{gap:5vw;grid-template-columns:minmax(0,1.1fr) minmax(310px,.9fr)}
 .contact-action{gap:15px;grid-template-columns:30px minmax(0,1fr)}.contact-action-word{display:none}
 .contact-hours{padding-inline:28px}.contact-hours:before{left:28px}
 .arrival-composition{gap:32px;grid-template-columns:minmax(0,1fr) minmax(320px,.85fr)}
 .arrival-tabs{gap:18px}.arrival-map{min-height:640px}.arrival-runner{width:57px}
}
@media(max-width:850px){
 .contact-hero{min-height:760px;height:auto}.contact-hero-copy{padding-block:55px 150px}
 .contact-hero-shade{background:linear-gradient(90deg,#21141de0,#2d1b2c70 55%,#25182a25),linear-gradient(0deg,#20111dab,transparent 60%)}
 .contact-experience .contact-hero h1{font-size:clamp(120px,19vw,165px)}

 .contact-reception{grid-template-columns:1fr 1fr;gap:35px}.contact-hours dl>div{flex-direction:column;gap:3px}.contact-hours dd{font-size:18px}
 .contact-experience .contact-hours h2{font-size:57px}.contact-reception-intro br{display:none}
 .contact-message{grid-template-columns:1fr;gap:35px}.contact-message-intro{max-width:530px}.contact-experience .contact-demo-note{max-width:none;margin-top:15px}
 .arrival-composition{grid-template-columns:1fr;gap:30px}.arrival-map{min-height:0;aspect-ratio:1000/620;align-self:auto}.arrival-runner{width:64px}
 .arrival-info{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:38px}
 .arrival-address{grid-column:1;grid-row:1/4;border:0;padding:0}.arrival-tabs{grid-column:2;margin-top:0}.arrival-panel{grid-column:2;min-height:0}.arrival-veli-line{grid-column:2;margin-top:18px}
 .arrival-info>.button{grid-column:1;grid-row:4;justify-self:start;align-self:start}.arrival-route-note{grid-column:1;grid-row:5}.arrival-panel h3{font-size:24px}
 .contact-questions{gap:40px;grid-template-columns:.8fr 1.2fr}.contact-question-list summary{font-size:19px}
}
@media(max-width:600px){
 .contact-experience h2{font-size:clamp(49px,13.6vw,78px)}
 .contact-experience .section{padding-block:65px;scroll-margin-top:15px}
 .contact-hero-photo{top:190px;bottom:-190px;mask-image:linear-gradient(transparent,#000 18%)}
 .contact-hero{height:auto;min-height:760px}.contact-hero-copy{padding:36px var(--edge) 265px}
 .contact-hero-shade{background:linear-gradient(90deg,#21141dc9,#35202f35),linear-gradient(180deg,#21141d70,transparent 60%,#21141da8)}
 .contact-experience .contact-hero h1{font-size:clamp(112px,30vw,180px);margin-block:36px 27px;line-height:.82}
 .contact-hero h1>span+span{margin-top:6px}
 .contact-experience .contact-hero-welcome{font-size:22px!important;max-width:270px}
 .contact-hero-actions{gap:11px 23px;margin-top:23px;align-items:start;flex-direction:column}
 .contact-experience .contact-hero-actions .button{min-height:55px;padding:15px 24px;font-size:16px}
 .contact-inline-link{font-size:16px}

 .contact-hero-foot{font-size:12px;bottom:25px;gap:14px;padding-top:14px;align-items:start}.contact-hero-foot>span{max-width:140px}.contact-hero-foot>a{padding:0 0 5px;white-space:nowrap}
 .contact-reception{display:block}.contact-reception h2{margin-bottom:20px}.contact-actions{margin-top:28px}
 .contact-action{grid-template-columns:27px minmax(0,1fr);padding:24px 0;gap:16px}.contact-action-icon svg{width:25px;height:25px}
 .contact-action strong{font-size:24px}.contact-action small{font-size:14px;margin-top:6px}.contact-action:before{inset-inline:-10px}
 .contact-hours{margin:50px 0 0;padding:35px 28px}.contact-experience .contact-hours h2{font-size:67px;margin-block:22px 30px}.contact-hours h2>br{display:none}
 .contact-hours dl>div{flex-direction:row;gap:12px;font-size:14px;padding-block:16px}.contact-hours dd{font-size:14px}
 .contact-message{padding-top:90px!important;gap:30px}.contact-message-close{top:20px}.contact-message h2{margin-bottom:24px}
 .contact-form-pair{grid-template-columns:1fr;gap:24px}.contact-form-pair+label{margin-top:24px}.contact-form input,.contact-form textarea{font-size:16px;padding:15px 12px}
 .contact-form-bottom .button{font-size:15px;width:100%;padding-inline:12px}
 .contact-message-success{gap:12px;align-items:start}.contact-message-success>.veli-actor{width:80px}.contact-message-success h3{font-size:31px}.contact-experience .contact-message-success p{font-size:16px!important}.contact-message-success .contact-inline-link{font-size:14px;text-align:left}
 .arrival-heading{margin-bottom:30px}.arrival-heading h2{margin-bottom:24px}
 .arrival-map{width:calc(100% + 2*var(--edge));margin-inline:calc(-1*var(--edge));border-inline:0;aspect-ratio:1000/720}.arrival-runner{width:44px}.map-concept{font-size:12px;left:var(--edge);right:var(--edge);bottom:15px}
 .arrival-info{display:block}.arrival-address{border-bottom:1px solid #35202f35;padding-bottom:22px}.contact-experience .arrival-address>p:not(.arrival-location-note){font-size:26px!important}
 .arrival-tabs{gap:24px;margin-block:20px}.arrival-tabs>button{font-size:15px}.arrival-panel{min-height:230px}.arrival-panel h3{font-size:25px}
 .contact-experience .arrival-veli-line{font-size:15px!important;margin-top:12px;min-height:28px;padding:0}
 .arrival-info>.button{font-size:16px;min-height:54px}.arrival-route-note{margin-top:12px}
 .contact-questions{grid-template-columns:1fr;gap:35px}.contact-question-list summary{font-size:18px}.contact-question-list details{padding-block:22px}
}
@media(max-width:365px){.contact-experience .contact-hero h1{font-size:108px}.contact-experience .contact-hero-welcome{font-size:20px!important}.contact-action strong{font-size:22px}.contact-hours{padding-inline:20px}.contact-hours:before{left:20px}.contact-hours dl>div{font-size:13px}.contact-hours dd{font-size:13px}.arrival-tabs{gap:20px}.arrival-tabs>button{font-size:14px}.contact-experience .contact-hours h2{font-size:61px}}
.motion-reduced .contact-hero-photo,.motion-reduced .contact-hero-photo>img,.motion-reduced .contact-experience *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.motion-reduced .contact-hero-photo{transform:none!important}
.page-hidden .contact-experience *{animation-play-state:paused!important}
body[data-page=kontakt].contact-message-open .mobile-book,body[data-page=kontakt].contact-message-open .preview-badge{visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:reduce){.contact-experience *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.contact-hero-photo{transform:none!important}}