/* 1:1 aus vassops.com/collections/professional-vasso (en_US) */
:where(.vasso-mirror) .ai-custom-html-aovlru0fytmpxculdvaigenblock28efa70jqkemk{
    display: block;
    width: 100%;
    max-width: 100%;
    direction: ltr;
  }
:where(.vasso-mirror) .ai-custom-html-container-aovlru0fytmpxculdvaigenblock28efa70jqkemk{
    width: 100%;
    padding: 0px 0 0px;
  }
:where(.vasso-mirror) .ai-custom-html-content-aovlru0fytmpxculdvaigenblock28efa70jqkemk{
    width: 100%;
  }
:where(.vasso-mirror) .ai-custom-html-empty-aovlru0fytmpxculdvaigenblock28efa70jqkemk{
    padding: 60px 20px;
    text-align: center;
    background-color: #f4f4f4;
    color: #666;
    font-size: 14px;
    border: 2px dashed #ddd;
    border-radius: 8px;
  }
@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,500&family=Jost:wght@300;400;500;600&display=swap");

    .vasso-custom-html{
      --vasso-obsidian:#08090b;
      --vasso-obsidian-2:#101215;
      --vasso-ivory:#f7f8f9;
      --vasso-ivory-dim:#b7bdc5;
      --vasso-silver:#c9d0d8;
      --vasso-platinum:#f3f5f7;
      --vasso-line:rgba(247,248,249,0.14);
      --vasso-display:"Playfair Display", serif;
      --vasso-body:"Jost", sans-serif;
      --vasso-ease:cubic-bezier(.22,1,.36,1);
      position:relative;
      display:block;
      width:100%;
      overflow:hidden;
      background:var(--vasso-obsidian);
      color:var(--vasso-ivory);
      font-family:var(--vasso-body);
      font-weight:300;
      -webkit-font-smoothing:antialiased;
      isolation:isolate;
    }
:where(.vasso-mirror) .vasso-custom-html,:where(.vasso-mirror) .vasso-custom-html *{
      box-sizing:border-box;
      text-transform:none !important;
    }
:where(.vasso-mirror) .vasso-custom-html::before{
      content:"";
      position:absolute;
      inset:0;
      pointer-events:none;
      z-index:-1;
      background:
        radial-gradient(circle at 18% 8%, rgba(201,208,216,.11), transparent 34%),
        radial-gradient(circle at 82% 0%, rgba(127,135,146,.12), transparent 30%),
        linear-gradient(180deg, #08090b 0%, #111419 48%, #08090b 100%);
    }
:where(.vasso-mirror) .vasso-custom-html img{display:block;max-width:100%;}
:where(.vasso-mirror) .vasso-custom-html a{color:inherit;text-decoration:none;}
:where(.vasso-mirror) .vasso-custom-html button{font-family:inherit;cursor:pointer;background:none;border:none;color:inherit;}
:where(.vasso-mirror) .vasso-eyebrow{
      display:block;
      margin-bottom:16px;
      font-family:var(--vasso-body);
      letter-spacing:.32em;
      text-transform:uppercase !important;
      font-size:.72rem;
      color:var(--vasso-platinum);
      font-weight:500;
    }
:where(.vasso-mirror) .vasso-container{
      max-width:1320px;
      margin:0 auto;
      padding:0 clamp(20px,5vw,64px);
    }
:where(.vasso-mirror) .vasso-btn{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:16px 34px;
      border:1px solid var(--vasso-silver);
      color:var(--vasso-ivory);
      font-size:.78rem;
      letter-spacing:.22em;
      text-transform:uppercase !important;
      font-weight:500;
      position:relative;
      overflow:hidden;
      transition:color .5s var(--vasso-ease), border-color .5s var(--vasso-ease), box-shadow .5s var(--vasso-ease);
    }
:where(.vasso-mirror) .vasso-btn::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(135deg, var(--vasso-platinum), var(--vasso-silver));
      transform:scaleX(0);
      transform-origin:left;
      transition:transform .5s var(--vasso-ease);
      z-index:-1;
    }
:where(.vasso-mirror) .vasso-btn:hover::before{transform:scaleX(1);}
:where(.vasso-mirror) .vasso-btn:hover{
      color:var(--vasso-obsidian);
      box-shadow:0 18px 50px rgba(201,208,216,.14);
    }
:where(.vasso-mirror) .vasso-btn-ghost{border-color:var(--vasso-line);}
:where(.vasso-mirror) .vasso-btn-ghost:hover{border-color:var(--vasso-silver);}
:where(.vasso-mirror) .vasso-hero{
      position:relative;
      height:100svh;
      min-height:640px;
      display:flex;
      align-items:flex-end;
      overflow:hidden;
    }
:where(.vasso-mirror) .vasso-hero-slides{position:absolute;inset:0;}
:where(.vasso-mirror) .vasso-hero-slide{
      position:absolute;
      inset:0;
      background-size:cover;
      background-position:var(--vasso-hero-position, center);
      opacity:0;
      transition:opacity 1.6s ease;
    }
:where(.vasso-mirror) .vasso-hero-slide.is-active{opacity:1;}
:where(.vasso-mirror) .vasso-hero-slides::after{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(180deg, rgba(8,9,11,.32) 0%, rgba(8,9,11,.46) 45%, rgba(8,9,11,.96) 100%);
      z-index:1;
    }
:where(.vasso-mirror) .vasso-hero-content{
      position:relative;
      z-index:2;
      padding:0 clamp(20px,5vw,64px) clamp(60px,9vw,110px);
      max-width:820px;
    }
:where(.vasso-mirror) .vasso-hero-content h1{
      margin:0 0 22px;
      font-family:var(--vasso-display);
      font-weight:500;
      font-size:clamp(2.6rem, 6vw, 5.2rem);
      line-height:1.04;
      letter-spacing:.005em;
      text-transform:none !important;
      color:var(--vasso-ivory);
    }
:where(.vasso-mirror) .vasso-hero-content h1 em{
      font-style:italic;
      color:var(--vasso-platinum);
      font-weight:500;
      text-transform:none !important;
    }
:where(.vasso-mirror) .vasso-hero-content p{
      margin:0 0 34px;
      font-size:1rem;
      color:var(--vasso-ivory-dim);
      max-width:480px;
      line-height:1.7;
      text-transform:none !important;
    }
:where(.vasso-mirror) .vasso-hero-dots{
      position:absolute;
      right:clamp(20px,5vw,64px);
      bottom:clamp(60px,9vw,110px);
      z-index:2;
      display:flex;
      flex-direction:column;
      gap:12px;
    }
:where(.vasso-mirror) .vasso-hero-dots button{
      width:8px;
      height:8px;
      border-radius:50%;
      border:1px solid var(--vasso-platinum);
      background:transparent;
      transition:background .3s;
      padding:0;
    }
:where(.vasso-mirror) .vasso-hero-dots button.is-active{background:var(--vasso-platinum);}
@keyframes vassoPulse{
      0%, 100%{opacity:.3;}
      50%{opacity:1;}
    }
:where(.vasso-mirror) .vasso-section{padding:clamp(70px,10vw,140px) 0;}
:where(.vasso-mirror) .vasso-section-head{
      text-align:center;
      max-width:640px;
      margin:0 auto clamp(46px,7vw,84px);
    }
:where(.vasso-mirror) .vasso-section-head h2{
      margin:0;
      font-family:var(--vasso-display);
      font-weight:500;
      font-size:clamp(2rem,3.6vw,3rem);
      line-height:1.15;
      text-transform:none !important;
      color:var(--vasso-ivory);
    }
:where(.vasso-mirror) .vasso-section-head p{
      margin:16px 0 0;
      color:var(--vasso-ivory-dim);
      font-size:.98rem;
      line-height:1.7;
      text-transform:none !important;
    }
:where(.vasso-mirror) .vasso-cat-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:2px;
      background:var(--vasso-line);
    }
:where(.vasso-mirror) .vasso-cat-scroll-wrap{
      position:relative;
    }
:where(.vasso-mirror) .vasso-cat-card{
      position:relative;
      background:var(--vasso-obsidian);
      aspect-ratio:3/4;
      overflow:hidden;
      display:flex;
      align-items:flex-end;
    }
:where(.vasso-mirror) .vasso-cat-card img{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit:cover;
      transition:transform 1s var(--vasso-ease), filter .6s;
      filter:grayscale(.5) brightness(.55);
    }
:where(.vasso-mirror) .vasso-cat-card:hover img{
      transform:scale(1.08);
      filter:grayscale(0) brightness(.7);
    }
:where(.vasso-mirror) .vasso-cat-card::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(180deg, transparent 40%, rgba(8,9,11,.94) 100%);
    }
:where(.vasso-mirror) .vasso-cat-info{
      position:relative;
      z-index:1;
      padding:26px;
      width:100%;
    }
:where(.vasso-mirror) .vasso-cat-tag{
      display:block;
      margin-bottom:6px;
      font-size:.68rem;
      letter-spacing:.14em;
      text-transform:uppercase !important;
      color:var(--vasso-ivory-dim);
    }
:where(.vasso-mirror) .vasso-cat-info h4{
      margin:0 0 12px;
      font-family:var(--vasso-display);
      font-size:1.3rem;
      font-weight:500;
      text-transform:none !important;
      color:var(--vasso-ivory);
    }
:where(.vasso-mirror) .vasso-cat-link{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding-bottom:3px;
      border-bottom:1px solid var(--vasso-platinum);
      font-size:.68rem;
      letter-spacing:.2em;
      text-transform:uppercase !important;
      color:var(--vasso-platinum);
    }
:where(.vasso-mirror) .vasso-diagnosis{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));
      align-items:stretch;
      background:var(--vasso-obsidian-2);
      border-top:1px solid var(--vasso-line);
      border-bottom:1px solid var(--vasso-line);
    }
:where(.vasso-mirror) .vasso-diagnosis-media{
      position:relative;
      min-width:0;
      min-height:0;
      height:auto;
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
      background:var(--vasso-obsidian);
    }
:where(.vasso-mirror) .vasso-diagnosis-media img{
      position:relative;
      inset:auto;
      display:block;
      width:100%;
      height:auto;
      max-width:100%;
      object-fit:contain;
      object-position:center center;
    }
:where(.vasso-mirror) .vasso-diagnosis-copy{
      padding:clamp(34px,6vw,90px);
      min-width:0;
      align-self:center;
    }
:where(.vasso-mirror) .vasso-diagnosis-copy h2{
      margin:0 0 20px;
      font-family:var(--vasso-display);
      font-size:clamp(2rem,3.4vw,2.8rem);
      line-height:1.15;
      font-weight:500;
      text-transform:none !important;
      color:var(--vasso-ivory);
    }
:where(.vasso-mirror) .vasso-diagnosis-copy p{
      margin:0 0 32px;
      color:var(--vasso-ivory-dim);
      line-height:1.75;
      max-width:440px;
      text-transform:none !important;
    }
:where(.vasso-mirror) .vasso-vision-teaser{
      position:relative;
      height:70vh;
      min-height:460px;
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
      overflow:hidden;
    }
:where(.vasso-mirror) .vasso-vision-teaser img,:where(.vasso-mirror) .vasso-vision-teaser video{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit:cover;
      filter:grayscale(.5) brightness(.4);
    }
:where(.vasso-mirror) .vasso-vision-teaser::after{
      content:"";
      position:absolute;
      inset:0;
      background:radial-gradient(ellipse at center, rgba(8,9,11,.18), rgba(8,9,11,.88));
    }
:where(.vasso-mirror) .vasso-vision-content{
      position:relative;
      z-index:1;
      max-width:640px;
      padding:0 24px;
    }
:where(.vasso-mirror) .vasso-vision-content h2{
      margin:0 0 30px;
      font-family:var(--vasso-display);
      font-style:italic;
      font-size:clamp(1.8rem,3.6vw,2.8rem);
      line-height:1.3;
      text-transform:none !important;
      color:var(--vasso-ivory);
    }
@media (prefers-reduced-motion: reduce){:where(.vasso-mirror) .vasso-custom-html *{
        animation-duration:0.001ms !important;
        transition-duration:0.001ms !important;
      }}
@media (max-width:1024px){:where(.vasso-mirror) .vasso-cat-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:760px){:where(.vasso-mirror) .vasso-custom-html{overflow-x:hidden;}
:where(.vasso-mirror) .vasso-hero{
        height:auto;
        min-height:0;
        display:block;
        overflow:hidden;
      }
:where(.vasso-mirror) .vasso-hero-slides{
        position:relative;
        inset:auto;
        width:100%;
        aspect-ratio:16/9;
        min-height:260px;
        background:#ffffff;
        overflow:hidden;
      }
:where(.vasso-mirror) .vasso-hero-slide{
        overflow:hidden;
        background-image:none !important;
      }
:where(.vasso-mirror) .vasso-hero-slide::before{
        content:"";
        position:absolute;
        inset:-18px;
        background-image:var(--vasso-hero-image);
        background-size:cover;
        background-position:var(--vasso-hero-position, center);
        filter:blur(18px);
        transform:scale(1.08);
        opacity:.9;
      }
:where(.vasso-mirror) .vasso-hero-slide::after{
        content:"";
        position:absolute;
        inset:0;
        background-image:var(--vasso-hero-image);
        background-size:cover;
        background-repeat:no-repeat;
        background-position:var(--vasso-hero-position, center);
      }
:where(.vasso-mirror) .vasso-hero-slides::after{display:none;}
:where(.vasso-mirror) .vasso-hero-content{
        position:relative;
        padding:28px 20px 46px;
        max-width:none;
        background:
          linear-gradient(180deg, rgba(16,18,21,.72), rgba(8,9,11,1)),
          var(--vasso-obsidian);
        border-top:1px solid var(--vasso-line);
      }
:where(.vasso-mirror) .vasso-hero-content h1{
        margin-bottom:16px;
        font-size:clamp(2.05rem, 11vw, 3.2rem);
        line-height:1.08;
      }
:where(.vasso-mirror) .vasso-hero-content p{max-width:none;}
:where(.vasso-mirror) .vasso-hero-dots{
        top:18px;
        right:20px;
        bottom:auto;
        flex-direction:row;
      }
:where(.vasso-mirror) .vasso-cat-grid{
        display:flex;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        scroll-padding-inline:12vw;
        gap:12px;
        padding-inline:12vw;
        background:transparent;
        -webkit-overflow-scrolling:touch;
        overscroll-behavior-inline:contain;
      }
:where(.vasso-mirror) .vasso-cat-scroll-wrap::after{
        content:"";
        position:absolute;
        top:0;
        bottom:0;
        inset-inline-end:0;
        z-index:4;
        width:34%;
        pointer-events:none;
        background:
          linear-gradient(to left, rgba(247,248,249,.72), rgba(247,248,249,.22), rgba(247,248,249,0));
        opacity:0;
      }
:where(.vasso-mirror) .vasso-cat-scroll-wrap::before{
        content:"";
        position:absolute;
        top:8%;
        bottom:8%;
        inset-inline-end:0;
        z-index:5;
        width:2px;
        pointer-events:none;
        background:rgba(255,255,255,.86);
        box-shadow:0 0 18px rgba(255,255,255,.72), 0 0 38px rgba(255,255,255,.34);
        opacity:0;
      }
[dir="rtl"] :where(.vasso-mirror) .vasso-cat-scroll-wrap::after{
        background:
          linear-gradient(to right, rgba(247,248,249,.72), rgba(247,248,249,.22), rgba(247,248,249,0));
      }
:where(.vasso-mirror) .vasso-cat-scroll-wrap.is-scroll-hint-active::after{
        animation:vassoEdgeHint 1.45s var(--vasso-ease) 3 forwards;
      }
:where(.vasso-mirror) .vasso-cat-scroll-wrap.is-scroll-hint-active::before{
        animation:vassoEdgeLineHint 1.45s var(--vasso-ease) 3 forwards;
      }
:where(.vasso-mirror) .vasso-cat-grid::-webkit-scrollbar{display:none;}
:where(.vasso-mirror) .vasso-cat-card{
        flex:0 0 76vw;
        min-width:0;
        max-width:360px;
        scroll-snap-align:center;
        scroll-snap-stop:always;
        aspect-ratio:3/4;
      }
:where(.vasso-mirror) .vasso-cat-card:hover img{
        transform:none;
        filter:grayscale(.5) brightness(.55);
      }
:where(.vasso-mirror) .vasso-section-head{padding:0 4px;}
:where(.vasso-mirror) .vasso-diagnosis-copy{
        padding:34px 20px 52px;
      }
:where(.vasso-mirror) .vasso-diagnosis-copy h2{
        font-size:clamp(2rem, 9vw, 2.7rem);
      }
:where(.vasso-mirror) .vasso-diagnosis-copy p{
        max-width:none;
      }}
@keyframes vassoEdgeHint{
      0%{opacity:0;}
      18%{opacity:.9;}
      62%{opacity:.55;}
      100%{opacity:0;}
    }
@keyframes vassoEdgeLineHint{
      0%{opacity:0; transform:translateX(0);}
      18%{opacity:1; transform:translateX(0);}
      62%{opacity:.78; transform:translateX(-18px);}
      100%{opacity:0; transform:translateX(-30px);}
    }
[dir="rtl"] :where(.vasso-mirror) .vasso-cat-scroll-wrap.is-scroll-hint-active::before{
      animation-name:vassoEdgeLineHintRtl;
    }
@keyframes vassoEdgeLineHintRtl{
      0%{opacity:0; transform:translateX(0);}
      18%{opacity:1; transform:translateX(0);}
      62%{opacity:.78; transform:translateX(18px);}
      100%{opacity:0; transform:translateX(30px);}
    }