/* WW Layout + Motion v5 (Webwavers) – Quelle: Claude/avgems */
/* ---------- Layout: Container statt Full Width (Tablet/Mobil unberuehrt) ---------- */
@media (min-width:992px){
  html body{font-size:min(0.8333333vw,14px)}
  .main-container{padding-left:5em;padding-right:5em}
  .main-container.container-full,.main-container.home-hero,.main-container.home-hero-n{padding-left:0;padding-right:0}
  .nav-container{padding-left:5em;padding-right:5em}
  .container-padding.footer{padding-left:5em;padding-right:5em}
  .content-wrapper.products{max-width:120em;margin-left:auto;margin-right:auto;padding-left:5em;padding-right:5em}
  .content-wrapper.products .swiper-cover{overflow:hidden}
  .moment-heading-wrapper,.absolute-info-wrapper{left:max(5em,calc(50vw - 55em))}
  .paragraph-13px{font-size:max(.81em,11px)}
  .nav-link,.nav-dropdown-toggle,.footer-link,.dropdown-link,.button-primary.navbar{font-size:max(.88em,11.5px)}
}

/* ---------- Motion tokens ---------- */
:root{--va-io:cubic-bezier(.65,0,.35,1);--va-out:cubic-bezier(.22,1,.36,1);--va-expo:cubic-bezier(.19,1,.22,1);--va-ioexpo:cubic-bezier(.87,0,.13,1)}
html.va{scroll-behavior:auto}

/* ---------- Navigation: weich aus- und einblenden, Linie zieht sich von der Mitte auf ---------- */
html.va .navigation{transform:translate3d(0,0,0)!important;transition:transform .8s var(--va-io)!important;will-change:transform}
html.va .navigation.va-nav-hidden{transform:translate3d(0,-101%,0)!important}
html.va .navigation .absolute-divider{transform:scaleX(0);transform-origin:50% 50%;transition:transform 1.6s var(--va-ioexpo)}
html.va .navigation.va-nav-ready .absolute-divider{transform:scaleX(1)}
html.va-d .nav-link,html.va-d .nav-dropdown-toggle{position:relative}
html.va-d .nav-link::after,html.va-d .nav-dropdown.desktop-active .nav-dropdown-toggle::after{content:'';position:absolute;left:0;right:0;bottom:-.35em;height:1px;background:currentColor;transform:scaleX(0);transform-origin:50% 50%;transition:transform .55s var(--va-io)}
html.va-d .nav-link:hover::after,html.va-d .nav-link.w--current::after,html.va-d .nav-dropdown.desktop-active:hover .nav-dropdown-toggle::after{transform:scaleX(1)}
html.va-d .dropdown-icon{transition:transform .5s var(--va-io)}

html.va-d .nav-dropdown-list.w--open .dropdown-link{animation:va-up .6s var(--va-out) both;animation-delay:calc(.06s + var(--i,0)*.05s)}
@keyframes va-dd{from{opacity:0;transform:translate3d(0,-.6em,0)}to{opacity:1;transform:none}}
@keyframes va-up{from{opacity:0;transform:translate3d(0,.8em,0)}to{opacity:1;transform:none}}

/* ---------- Links: Unterstrich laeuft rein und raus ---------- */
html.va-d .footer-link,html.va-d .dropdown-link{background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;background-size:0% 1px;background-position:100% 100%;transition:background-size .55s var(--va-io),color .3s var(--va-io)}
html.va-d .footer-link:hover,html.va-d .dropdown-link:hover{background-size:100% 1px;background-position:0 100%}

/* ---------- Buttons: Flaechen-Wipe + Text-Swap ---------- */
html.va-d .button-primary{position:relative;overflow:hidden;isolation:isolate;transition:color .45s var(--va-io),border-color .45s var(--va-io),transform .45s var(--va-io),box-shadow .6s var(--va-io)!important}
html.va-d .button-primary::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--white,#fff);transform:scaleY(0);transform-origin:50% 100%;transition:transform .55s var(--va-io)}
html.va-d .button-primary:hover{background-color:transparent!important;transform:scale(.97)!important;box-shadow:0 0 1.5em .1em rgba(255,255,255,.12)!important}
html.va-d .button-primary:hover::before{transform:scaleY(1)}
html.va-d .button-primary.house-made::before,html.va-d .button-primary.white-version::before{background:var(--black,#000)}
html.va-d .button-primary.house-made:hover{box-shadow:0 0 1.5em .1em rgba(0,0,0,.12)!important}
html.va-d .button-primary.white-version:hover{color:var(--white,#fff)}
.va-btn-t{position:relative;display:block;overflow:hidden}
.va-btn-a,.va-btn-b{display:block;transition:transform .7s var(--va-expo)}
.va-btn-b{position:absolute;left:0;right:0;top:0;transform:translate3d(0,110%,0)}
html.va-d .button-primary:hover .va-btn-a{transform:translate3d(0,-110%,0)}
html.va-d .button-primary:hover .va-btn-b{transform:none}

/* ---------- Scroll-Reveal: Zeilen aus der Maske, Bloecke gestaffelt ---------- */
html.va .va-rv{opacity:0;translate:0 1em;scale:.985;filter:blur(10px);transition:opacity 1.2s var(--va-out),translate 1.2s var(--va-out),scale 1.2s var(--va-out),filter 1.2s var(--va-out);transition-delay:var(--d,0ms)}
html.va .va-rv.va-in{opacity:1;translate:0 0;scale:1;filter:none}
html.va .va-split{opacity:1!important;transform:none!important}
.va-line{display:block;overflow:hidden;padding:.1em 0 .16em;margin:-.1em 0 -.16em}
.va-line-in{display:block;transform:translate3d(0,120%,0);transition:transform 1.2s var(--va-out);transition-delay:calc(var(--d,0ms) + var(--l,0)*var(--ls,100ms))}
.va-in .va-line-in{transform:none}
.va-ch{display:inline-block;overflow:hidden;vertical-align:top;padding:.08em 0 .14em;margin:-.08em 0 -.14em}
.va-ch-in{display:inline-block;transform:translate3d(0,112%,0);transition:transform 1.5s var(--va-expo);transition-delay:calc(var(--d,0ms) + var(--c,0)*38ms)}
.va-in .va-ch-in{transform:none}
html.va .va-img{clip-path:inset(4% 3% 4% 3% round var(--va-r,0px));opacity:0;transition:clip-path 1.3s var(--va-out),opacity .9s var(--va-out);transition-delay:var(--d,0ms)}
html.va .va-img.va-wipe{clip-path:inset(100% 0 0 0);opacity:1;transition:clip-path 1.5s var(--va-io);transition-delay:var(--d,0ms)}
html.va .va-img img,html.va img.va-img{scale:1.08;transition:scale 1.4s var(--va-out),clip-path 1.3s var(--va-out),opacity .9s var(--va-out);transition-delay:var(--d,0ms)}
html.va .va-img.va-wipe img{scale:1.18;transition:scale 2s var(--va-out)}
html.va .va-img.va-wipe.va-img-top{clip-path:inset(0 0 100% 0)}
html.va .va-img.va-in{clip-path:inset(0 round var(--va-r,0px));opacity:1}
html.va .va-img.va-wipe.va-in,html.va .va-img.va-wipe.va-img-top.va-in{clip-path:inset(0 0 0 0)}
html.va .va-img.va-in img,html.va img.va-img.va-in{scale:1}
.va-nomo,.va-nomo *{transition:none!important}

/* ---------- Bild-Hover (Karten) ---------- */
html.va-d .va-hz .va-hz-t{transition:transform 1.2s var(--va-expo)!important}
html.va-d .va-hz:hover .va-hz-t{transform:scale(1.06)!important}

/* ---------- Footer: Linie und Logo ---------- */
html.va .footer-section{border-top-color:transparent;position:relative}
html.va .footer-section::before{content:'';position:absolute;left:0;right:0;top:-1px;height:1px;background:rgba(255,255,255,.15);transform:scaleX(0);transform-origin:50% 50%;transition:transform 1.8s var(--va-ioexpo)}
html.va .footer-section.va-in::before{transform:scaleX(1)}
html.va .footer-logo-wrapper{overflow:hidden;transition:none}

/* ---------- Startseite: Szenen ---------- */
@media (min-width:992px){
  html.va-home .video-section{height:220vh;position:relative}
  html.va-home .video-wrapper{position:sticky;top:0;height:100vh;width:100%;overflow:hidden}
  html.va-home .video-wrapper .video{clip-path:inset(var(--vy,18%) var(--vx,26%));filter:brightness(var(--vb,.35));will-change:clip-path,filter}
  html.va-home .video-wrapper video{scale:var(--vs,1.15)}
  html.va-home .house-made-image-wrapper{filter:none}
  html.va-home .house-made-image{will-change:filter,scale}
  html.va-home .content-left-wrapper.works{will-change:clip-path}
  html.va-home .bespoke-section{height:250vh;position:relative}
  html.va-home .bespoke-section>.main-container{position:sticky;top:0;height:100vh;display:flex;align-items:center}
  html.va-home .bespoke-section .container-padding.bespoke-products{width:100%;padding-top:0;padding-bottom:0}
  html.va-home .bespoke-section .products-wrapper{will-change:transform,opacity}
  html.va-home .bespoke-section .content-wrapper.see-bespoke{padding-top:0;padding-bottom:0;grid-row-gap:4em;transform-origin:50% 50%}
  html.va-home .bespoke-section .products-outer-wrapper{grid-row-gap:3.5em}
  html.va-home .bespoke-section .heading-style-h1.bespoke{font-size:min(24.69em,30vh)}
  html.va-home .bespoke-section .bespoke-product-image-wrapper{max-height:26vh}
  html.va-home .bespoke-section .bespoke-product{max-height:26vh;width:auto;max-width:100%;object-fit:contain}
  html.va-home .paraisag-section .heading-wrapper,html.va-home .paraisag-section .paraisag-wrapper{will-change:translate}
  html.va-home .engagement-section .couple-image,html.va-home .engagement-section .ring-image{will-change:translate}
  html.va-home .cta-section{overflow:clip}
  html.va-home .absolute-cta-bg.desktop-active{will-change:scale}
}
/* ---------- Tablet / Mobile ---------- */
@media (max-width:991px){.heading-style-h1.perception{font-size:8em}}
@media (max-width:767px){.heading-style-h1.perception{font-size:6.2em}}
@media (max-width:479px){.heading-style-h1.perception{font-size:3.75em}.heading-style-h1.request{font-size:2.45em}.black.w-embed h1{font-size:1.75em;line-height:1.2;overflow-wrap:break-word;hyphens:auto}.black.w-embed h2{font-size:1.4em;line-height:1.25;hyphens:auto}}
@media (max-width:991px){
  html.va .va-rv{transition-duration:1.1s,1.1s,1.1s,1.1s}
  .va-line-in{transition-duration:1s}
  html.va .va-img{transition-duration:1.2s}
  html.va-m .button-primary{transition:transform .35s var(--va-io),background-color .35s var(--va-io),color .35s var(--va-io)}
  html.va-m .button-primary:active{transform:scale(.97)}
  html.va-m .va-tap:active .va-hz-t,html.va-m a:active img{transform:scale(.985)}
  html.va-home .video-wrapper .video{clip-path:inset(var(--vy,0%) var(--vx,0%));filter:brightness(var(--vb,1))}
  html.va-home .house-made-image-wrapper{filter:none}
}
/* ---------- Bewegung reduzieren: nur weiche Einblendungen, keine Wege ---------- */
@media (prefers-reduced-motion:reduce){
  html.va .va-rv{translate:none;scale:none;filter:none;transition:opacity .9s var(--va-io)}
  .va-line-in,.va-ch-in{transform:none!important;opacity:0;transition:opacity .9s var(--va-io)!important;transition-delay:calc(var(--d,0ms) + var(--l,0)*60ms)!important}
  .va-in .va-line-in,.va-in .va-ch-in,.va-scene .va-ch-in{opacity:1}
  html.va .va-img{clip-path:none!important;opacity:0;transition:opacity 1s var(--va-io)}
  html.va img.va-img{scale:1!important}
  html.va .va-img.va-in{opacity:1}
  html.va .va-img img{scale:1!important}
  html.va-d .va-hz:hover .va-hz-t{transform:scale(1.02)!important}
  html.va .navigation{transition:transform .5s var(--va-io)!important}
}

/* ---------- v6: Prüf-Fixes ---------- */
html.va,html.va body{overflow-x:clip}
html.va-lock,html.va-lock body{overflow:hidden}
html.va input.button-primary,html.va input.button-primary:hover{cursor:pointer!important}
@media (min-width:992px){
  html.va-d .content-left-wrapper.goldsmithing{padding-left:max(5em,calc(50vw - 55em))}
  html.va-d .grid.features{padding-left:max(5em,calc(50vw - 55em));padding-right:max(5em,calc(50vw - 55em))}
  html.va-d .paragraph-16px{font-size:max(1em,12px)}
  html.va-d .black.w-embed p,html.va-d .black.w-embed li,html.va-d .black.w-embed a,html.va-d .black.w-embed b,html.va-d .black.w-embed strong{font-size:max(1em,12px)}
  html.va-d .footer-section .va-line-in{font-size:max(1em,11.5px)}
  html.va-d input.button-primary:hover{background-color:#2b2b2b!important;color:#fff!important}
  html.va-d .button-primary.white-version::before{background:rgba(0,0,0,.12)}
  html.va-d .button-primary.white-version:hover{background-color:var(--white,#fff)!important;color:var(--black,#000)!important}
  html.va-home .rare-section .section-title-wrapper{position:relative;z-index:3}
  html.va-home .rare-section .quote-text{text-shadow:0 0 1.2em rgba(0,0,0,.75),0 0 .3em rgba(0,0,0,.6)}
}
@media (max-width:991px){
  html.va .content-right-wrapper.perception{height:auto}
}
@media (prefers-reduced-motion:reduce){
  html.va-home .video-section{height:auto!important}
  html.va-home .video-wrapper{position:relative!important}
}

/* ---------- v7 ---------- */
@media (max-width:991px){html.va .section-title-wrapper.request,html.va .section-title-wrapper.request .gap-14px,html.va .black.w-embed{max-width:100%;min-width:0}}
@media (min-width:768px) and (max-width:991px){html.va .moment-heading-wrapper{left:40px}}

/* ---------- v8 ---------- */
@media (min-width:992px){
  html.va-d .swiper-cover{overflow:hidden}
  html.va-d .worth-wrapepr,html.va-d .contact-info-wrapper{transition:opacity .5s var(--va-io)}
  html.va-d .worth-wrapepr:hover,html.va-d .contact-info-wrapper:hover{opacity:.6}
}

/* ---------- v9 ---------- */
html.va .swiper-cover{overflow:hidden}
@media (max-width:991px){html.va .content-wrapper.products{padding-left:40px;padding-right:40px}}
@media (max-width:479px){html.va .content-wrapper.products{padding-left:20px;padding-right:20px}}

/* ================= v10: Feinschliff ================= */
/* Buttons: Reveal und Hover-Transitions zusammenfuehren */
html.va-d .button-primary.va-rv{transition:opacity 1.2s var(--va-out),translate 1.2s var(--va-out),scale 1.2s var(--va-out),filter 1.2s var(--va-out),color .45s var(--va-io),border-color .45s var(--va-io),transform .45s var(--va-io),box-shadow .6s var(--va-io)!important;transition-delay:var(--d,0ms),var(--d,0ms),var(--d,0ms),var(--d,0ms),0s,0s,0s,0s!important}
/* Nav: Logo links, Menue in der echten Container-Mitte, Sprache + Button rechts */
@media (min-width:992px){
  html.va .nav-container{display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center}
  html.va .nav-container>.w-nav-brand{grid-column:1;grid-row:1;justify-self:start;margin:0!important}
  html.va .nav-container>.nav-left-wrapper{grid-column:2;grid-row:1;justify-self:center;width:auto!important;flex:none}
  html.va .nav-container>.nav-right-wrapper{grid-column:3;grid-row:1;justify-self:end;width:auto!important;flex:none}
  html.va .nav-left-wrapper .w-nav-menu{display:flex;align-items:center}
  html.va .nav-link,html.va .nav-dropdown-toggle,html.va .dropdown-link{font-size:max(.88em,14px)!important}
  html.va .button-primary.navbar{font-size:max(.88em,12px)!important}
  /* Dropdown: Clip von oben, runde Ecken, leichter Versatz */
  html.va .nav-dropdown-list{display:block!important;visibility:hidden;pointer-events:none;opacity:0;translate:0 -.4em;clip-path:inset(0 0 100% 0 round .75em);border-radius:.75em;transition:opacity .4s var(--va-io),translate .6s var(--va-out),clip-path .6s var(--va-io),visibility 0s .6s;animation:none!important}
  html.va .nav-dropdown-list.w--open{visibility:visible;pointer-events:auto;opacity:1;translate:0 0;clip-path:inset(0 0 0 0 round .75em);transition-delay:0s}
  html.va .nav-dropdown-list .inner-list-wrapper{border-radius:.75em;overflow:hidden}
  /* Mindestschrift Desktop */
  html.va .paragraph-13px,html.va .paragraph-16px,html.va .paragraph-20px{font-size:max(.81em,15px)}
  html.va .paragraph-16px{font-size:max(1em,15px)}
  html.va .paragraph-20px{font-size:max(1.25em,15px)}
  html.va .news-card .paragraph-20px.date{font-size:max(1em,13px)}
  html.va .black.w-embed p,html.va .black.w-embed li,html.va .black.w-embed a,html.va .black.w-embed b,html.va .black.w-embed strong,html.va .black.w-embed div{font-size:max(1em,15px)}
  html.va .w-input,html.va .w-select,html.va .w-form-done,html.va .w-form-fail{font-size:max(1em,15px)}
  html.va .goldsmit-list em{font-size:max(1em,12px)}
  html.va .footer-link,html.va .footer-menu-text,html.va .footer-section .va-line-in{font-size:max(1em,12px)!important}
  html.va .button-primary{font-size:max(1em,12px)}
  /* Engagement: Text bleibt stehen, wenn das Panel beim Hover breiter wird */
  /* Engagement: kein Breitenwechsel mehr beim Hover (Text und Button bleiben stehen), stattdessen ruhiger Bild-Zoom */
  html.va-home .content-left-wrapper.engagement,html.va-home .content-left-wrapper.engagement:hover{width:55%!important;max-width:55%!important}
  html.va-home .content-right-wrapper.engagement,html.va-home .content-right-wrapper.engagement:hover{width:45%!important;max-width:45%!important}
  html.va-home .content-left-wrapper.engagement .couple-image,html.va-home .content-right-wrapper.engagement .ring-image{transition:transform 1.4s var(--va-out)}
  html.va-home .content-left-wrapper.engagement:hover .couple-image,html.va-home .content-right-wrapper.engagement:hover .ring-image{transform:scale(1.04)}
}
/* Nav-Glas beim Scrollen */
html.va .navigation.va-glass{background-color:rgba(10,10,10,.6)!important;-webkit-backdrop-filter:blur(15px) saturate(140%);backdrop-filter:blur(15px) saturate(140%)}
html.va .navigation{transition:transform .8s var(--va-io),background-color .6s var(--va-io)!important}
/* Mobile-Menue: Clip von oben mit runden Ecken */
@media (max-width:991px){
  html.va .w-nav-overlay [data-nav-menu-open]{transform:none!important;clip-path:inset(0 0 0 0 round 0 0 14px 14px);animation:va-mm .6s var(--va-io) both;transition:clip-path .45s var(--va-io),translate .45s var(--va-io)!important}
  html.va .w-nav-overlay .w-nav-menu{transform:none!important}
  html.va .w-nav-overlay .w-nav-menu.va-mm-out{animation:va-mm-out .45s var(--va-io) both!important}
  @keyframes va-mm-out{from{clip-path:inset(0 0 0 0 round 0 0 14px 14px);translate:0 0}to{clip-path:inset(0 0 100% 0 round 0 0 14px 14px);translate:0 -.4em}}
  @keyframes va-mm{from{clip-path:inset(0 0 100% 0 round 0 0 14px 14px);translate:0 -.4em}to{clip-path:inset(0 0 0 0 round 0 0 14px 14px);translate:0 0}}
  html.va .footer-logo-wrapper,html.va .footer-logo-wrapper img{max-width:100%}
  html.va .icons-slider-mask{overflow:hidden}
}
@media (min-width:992px){html.va .content-wrapper.icons{overflow:hidden}}
/* Startseite: Preloader-Sperre schon ab dem ersten Frame */
html.va-lock{overscroll-behavior:none}
@media (prefers-reduced-motion:reduce){
  html.va .nav-dropdown-list,html.va .w-nav-overlay [data-nav-menu-open]{translate:none!important;animation-duration:.3s!important}
}

/* ================= v11 ================= */
@media (min-width:992px){
  html.va .content-wrapper.footer{max-width:none!important;margin-left:0!important;margin-right:0!important}
  html.va .container-padding.footer{padding-left:max(5em,calc(50vw - 55em))!important;padding-right:max(5em,calc(50vw - 55em))!important}
  html.va .footer-menu{padding-left:0!important;padding-right:0!important}
  html.va-d .va-hz .va-hz-t{transition:transform 1.2s var(--va-expo),scale 1.4s var(--va-out)!important}
  html.va .nav-link,html.va .dropdown-link,html.va .nav-dropdown-toggle,html.va [class*=slider-arrow],html.va .footer-link{transition-timing-function:var(--va-io)!important}
}
@media (max-width:767px){html.va .footer-logo-wrapper{left:auto!important;right:1.25em!important}}
@media (max-width:991px){
  html.va .w-nav-overlay .w-dropdown-list.w--open{animation:va-sub .55s var(--va-out) both}
  @keyframes va-sub{from{clip-path:inset(0 0 100% 0 round 0 0 10px 10px);translate:0 -.4em;opacity:0}to{clip-path:inset(0 0 0 0 round 0 0 10px 10px);translate:0 0;opacity:1}}
}

/* ================= v12 ================= */
@media (prefers-reduced-motion:reduce){
  html.va-home .bespoke-section .products-wrapper{translate:none!important;scale:none!important}
  html.va-home .house-made-image{scale:none!important;translate:none!important}
  html.va-home .content-left-wrapper.works{clip-path:none!important}
  html.va-home .absolute-work-bg{scale:none!important}
  html.va-home .content-left-wrapper.engagement:hover .couple-image,html.va-home .content-right-wrapper.engagement:hover .ring-image{transform:none}
}

/* ================= v13 ================= */
@media (max-width:991px){html.va .paragraph-13px.smaller{font-size:max(.7em,12px)}}

/* ================= v14 ================= */
html.va .content-right-wrapper.works{height:auto;padding-bottom:.3em}
