/*
 * Template: VYORA — Modern Multipurpose eCommerce Template
 * File: Main stylesheet (style.css)
 * Author: ARENA
 * Version: 1.0.0
 */

/* ==================================================
   TABLE OF CONTENTS

   01. Icon Fonts & Font Faces
   02. Global Styles & Homepage
   03. Storefront Navigation & Hero
   04. Trending Collections & Promotions
   05. Best Sellers & Featured Products
   06. Closing Banner & Footer
   07. Editorial Content & Contact
   08. Shopping Cart & Checkout
   09. Catalog, Filters & Product Cards
   10. Login & Registration
   11. About, Testimonials & FAQ
   12. Customer Dashboard & Orders
   13. Checkout Confirmation
   14. Product Details
   15. Blog Layouts & Articles
   16. Compact Account Layout
   17. Blog Design Alignment
   18. Password Settings
   19. Unified Navbar
   20. Customer Messages
   21. Order Tracking
   22. RTL Layout
   23. Language Switch & Brand
  22. RTL Layout
================================================== */

/* ==================================================
   01. Icon Fonts & Font Faces
================================================== */

@font-face {
  font-family: "Linearicons-Free";
  src: url("../fonts/Linearicons-Free.eot?w118d");
  src: url("../fonts/Linearicons-Free.eot?#iefixw118d") format("embedded-opentype"),
    url("../fonts/Linearicons-Free.woff2?w118d") format("woff2"),
    url("../fonts/Linearicons-Free.woff?w118d") format("woff"),
    url("../fonts/Linearicons-Free.ttf?w118d") format("truetype"),
    url("../fonts/Linearicons-Free.svg?w118d#Linearicons-Free") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "themify";
  src: url("../fonts/themify.eot?-fvbane");
  src: url("../fonts/themify.eot?#iefix-fvbane") format("embedded-opentype"),
    url("../fonts/themify.woff?-fvbane") format("woff"),
    url("../fonts/themify.ttf?-fvbane") format("truetype"),
    url("../fonts/themify.svg?-fvbane#themify") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "FontAwesome";
  src: url("../fonts/fontawesome-webfont.eot?v=4.7.0");
  src: url("../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"),
    url("../fonts/fontawesome-webfont.woff2?v=4.7.0") format("woff2"),
    url("../fonts/fontawesome-webfont.woff?v=4.7.0") format("woff"),
    url("../fonts/fontawesome-webfont.ttf?v=4.7.0") format("truetype"),
    url("../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

/* ==================================================
   02. Global Styles & Homepage
================================================== */

@scope (
  html:is(
    [data-vyora-page="about.html"],
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"],
    [data-vyora-style-group="g04"],
    [data-vyora-style-group="g05"],
    [data-vyora-page="category.html"],
    [data-vyora-page="confirmation.html"],
    [data-vyora-page="contact.html"],
    [data-vyora-page="faq.html"],
    [data-vyora-page="index.html"],
    [data-vyora-style-group="g12"],
    [data-vyora-page="single-product.html"],
    [data-vyora-page="testimonial.html"]
  )
) {
  :scope {
    --ink: #171C2E;
    --accent: #655CEB;
    --accent-d: #5148cf;
    --base: #F6F7FB;
    --white: #fff;
    --muted: #777e90;
    --line: #E7E9F2;
    --radius: 22px;
    --font: "Plus Jakarta Sans","Segoe UI",-apple-system,BlinkMacSystemFont,Arial,sans-serif;
  }

  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }

  body {
    margin: 0;
    color: var(--ink);
    background: #fff;
    font-family: var(--font);
    -webkit-font-smoothing: antialiased;
  }

  button,
  input {
    font: inherit;
  }

  a {
    text-decoration: none;
    color: inherit;
  }

  a:hover {
    color: var(--accent);
  }

  button {
    cursor: pointer;
  }

  img {
    max-width: 100%;
  }

  svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  [hidden] {
    display: none!important;
  }

  ::selection {
    background: #d6d1ff;
    color: var(--ink);
  }

  .container-wide {
    width: min(100% - 84px,1280px);
    margin-inline: auto;
  }

  .skip-link {
    position: absolute;
    right: 18px;
    top: -60px;
    z-index: 1000;
    padding: 10px 20px;
    background: #fff;
  }

  .skip-link:focus {
    top: 10px;
  }

  .announcement {
    background: var(--ink);
    color: #f2f0ff;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .055em;
  }

  .announcement__inner {
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
  }

  .announcement a {
    color: #d0caff;
  }

  .announcement a:hover {
    color: #fff;
  }

  .site-header {
    z-index: 90;
    position: sticky;
    top: 0;
    background: rgba(255,255,255,.96);
    border-bottom: 1px solid rgba(231,233,242,.9);
    backdrop-filter: blur(18px);
  }

  .header-shell {
    height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
  }

  .brand {
    display: inline-flex;
    align-items: center;
    color: var(--ink);
    flex: none;
  }

  .brand-word {
    font-size: 27px;
    font-weight: 850;
    letter-spacing: .035em;
    line-height: 1;
  }

  .brand-dot {
    font-size: 35px;
    color: var(--accent);
    font-weight: 900;
    line-height: .7;
  }

  .brand-mark {
    height: 32px;
    width: 34px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 3px;
    margin-left: 11px;
    transform: translateY(2px);
  }

  .brand-mark span {
    display: block;
    width: 8px;
    height: 25px;
    border-radius: 3px;
    background: var(--accent);
    transform: skew(-23deg);
  }

  .brand-mark span:first-child {
    height: 17px;
    transform: skew(23deg);
  }

  .brand-mark span:last-child {
    height: 17px;
    align-self: end;
    transform: skew(23deg);
  }

  .main-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 33px;
    margin-right: auto;
  }

  .main-nav a {
    position: relative;
    color: #51566b;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
    transition: color .2s ease;
  }

  .main-nav a:hover,
  .main-nav .nav-link-current {
    color: var(--ink);
  }

  .main-nav a::after {
    position: absolute;
    content: "";
    height: 2px;
    background: var(--accent);
    bottom: -12px;
    right: 0;
    left: 100%;
    transition: right .25s ease;
  }

  .main-nav a:hover::after,
  .main-nav .nav-link-current::after {
    left: 0;
  }

  .header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .icon-button {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--ink);
    border-radius: 50%;
    transition: background .2s,color .2s;
  }

  .icon-button:hover {
    color: var(--accent);
    background: var(--base);
  }

  .icon-button svg {
    height: 19px;
    width: 19px;
  }

  .mobile-menu-toggle {
    display: none;
  }

  .search-panel {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    background: white;
    box-shadow: 0 20px 35px #171c2e16;
    border-top: 1px solid var(--line);
  }

  .search-panel__inner {
    padding-block: 22px 25px;
  }

  .search-panel label {
    display: block;
    font-size: 13px;
    font-weight: 750;
    margin-bottom: 10px;
  }

  .search-field {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 15px;
    background: var(--base);
    border: 1px solid var(--line);
    border-radius: 12px;
  }

  .search-field svg {
    flex: none;
  }

  .search-field input {
    border: none;
    background: transparent;
    outline: none;
    flex: 1;
    width: 100%;
    min-width: 0;
    font-size: 14px;
  }

  .search-field button {
    border: 0;
    background: none;
    color: var(--accent);
    font-weight: 750;
    font-size: 12px;
  }

  .search-helper {
    margin: 10px 2px 0;
    font-size: 11px;
    color: var(--muted);
  }

  .hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(122deg,#f9f9ff 0%,#f6f7fb 49%,#edebff 100%);
  }

  .hero-glow {
    position: absolute;
    pointer-events: none;
    border-radius: 50%;
  }

  .hero-glow--one {
    left: -220px;
    top: -360px;
    height: 800px;
    width: 800px;
    background: radial-gradient(circle,#ddd8ffb0,transparent 70%);
  }

  .hero-glow--two {
    right: -250px;
    bottom: -500px;
    height: 800px;
    width: 800px;
    background: radial-gradient(circle,#e1dfff8a,transparent 70%);
  }

  .hero-inner {
    position: relative;
    display: grid;
    grid-template-columns: 48% 52%;
    min-height: 615px;
    align-items: center;
  }

  .hero-copy {
    z-index: 2;
    padding: 62px 0 76px;
    align-self: center;
  }

  .eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 10px;
    letter-spacing: .145em;
    color: #565d7f;
    font-weight: 800;
  }

  .eyebrow-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 5px #655ceb1f;
  }

  .eyebrow-rule {
    height: 1px;
    width: 45px;
    background: #b7b4d8;
  }

  .hero h1 {
    margin: 31px 0 23px;
    font-size: clamp(45px,5.7vw,83px);
    line-height: 1.08;
    letter-spacing: -.064em;
    font-weight: 760;
  }

  .hero h1 em {
    font-style: normal;
    color: var(--accent);
    font-weight: 780;
  }

  .hero-copy>p {
    max-width: 433px;
    color: #747b8d;
    font-size: 15px;
    line-height: 1.95;
    margin: 0;
  }

  .hero-ctas {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 28px;
    margin-top: 34px;
  }

  .btn-main {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    background: var(--ink);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    border-radius: 9px;
    min-height: 55px;
    padding: 0 24px;
    box-shadow: 0 15px 30px #171c2e20;
    transition: transform .25s,background .25s,box-shadow .25s;
  }

  .btn-main svg {
    width: 18px;
    height: 18px;
  }

  .btn-main:hover {
    background: var(--accent);
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 18px 35px #655ceb3b;
  }

  .btn-link-custom {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-size: 12px;
    font-weight: 800;
    color: #3b4054;
    transition: gap .2s;
  }

  .btn-link-custom:hover {
    gap: 21px;
  }

  .hero-bottom-note {
    margin-top: 84px;
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 10px;
    letter-spacing: .15em;
    color: #8b90a4;
    font-weight: 750;
  }

  .hero-note-line {
    width: 28px;
    height: 1px;
    background: #a6aaca;
  }

  .hero-art {
    position: relative;
    height: 545px;
    align-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .hero-art__stage {
    position: absolute;
    width: 475px;
    height: 475px;
    max-width: 90%;
    top: 29px;
    right: 50%;
    transform: translateX(47%);
    border-radius: 50%;
    background: linear-gradient(150deg,#c5bfff 0%,#aaa2f3 52%,#dad7ff 100%);
    box-shadow: inset 32px 26px 65px #ffffff75,0 35px 75px #655ceb24;
  }

  .hero-art__orbit {
    position: absolute;
    border: 1px solid #fff8;
    border-radius: 50%;
    top: 22px;
    right: 22px;
    left: 22px;
    bottom: 22px;
  }

  .orbit-two {
    top: -28px;
    right: -28px;
    left: -28px;
    bottom: -28px;
    border: 1px dashed #a8a3e190;
  }

  .hero-art__inner-circle {
    position: absolute;
    inset: 100px;
    border-radius: 50%;
    background: #f1f0ff23;
  }

  .hero-sneaker {
    z-index: 2;
    position: relative;
    transform: translate(3%,-3%) rotate(-9deg) scale(1.1);
    width: min(100%,690px);
    filter: drop-shadow(7px 38px 22px #31304f54);
    animation: floatshoe 7s ease-in-out infinite;
  }

  .hero-art__tiny-label {
    position: absolute;
    top: 18px;
    left: 4%;
    font-size: 9px;
    font-weight: 850;
    color: #aaa4d3;
    letter-spacing: .18em;
    transform: rotate(90deg);
    transform-origin: left center;
  }

  .hero-art__vertical-text {
    position: absolute;
    left: -4%;
    bottom: 33%;
    color: #817ca7;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .25em;
    transform: rotate(-90deg);
  }

  .float-card {
    z-index: 3;
    position: absolute;
    background: #ffffffef;
    border: 1px solid #ffffffcf;
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px 20px;
    box-shadow: 0 18px 55px #3837681e;
    backdrop-filter: blur(14px);
  }

  .float-card>div {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .float-card span:not(.float-card__sparkle):not(.float-card__mini-icon) {
    font-size: 9px;
    color: #858a9a;
    letter-spacing: .08em;
    font-weight: 750;
  }

  .float-card strong {
    color: var(--ink);
    font-size: 16px;
    letter-spacing: -.04em;
  }

  .float-card--top {
    left: -2%;
    top: 23%;
  }

  .float-card__sparkle {
    color: var(--accent);
    font-size: 24px;
  }

  .float-card--bottom {
    right: 0;
    bottom: 11%;
  }

  .float-card__mini-icon {
    display: grid;
    place-items: center;
    width: 31px;
    height: 31px;
    background: #efeefe;
    color: var(--accent);
    border-radius: 50%;
    font-size: 19px;
  }

  .hero-footer-line {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    border-top: 1px solid #dcdcef;
  }

  .hero-footer-line>.container-wide {
    height: 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #8c90a9;
    letter-spacing: .13em;
    font-weight: 700;
    font-size: 9px;
  }

  @keyframes floatshoe {
    0%,
    100% {
      transform: translate(3%,-3%) rotate(-9deg) scale(1.1);
    }

    50% {
      transform: translate(3%,-6%) rotate(-8deg) scale(1.1);
    }
  }

  .values-section {
    background: #fff;
    border-bottom: 1px solid var(--line);
  }

  .values-row {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    min-height: 117px;
  }

  .value-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
  }

  .value-item+.value-item {
    border-right: 1px solid var(--line);
  }

  .value-icon {
    width: 43px;
    height: 43px;
    border-radius: 12px;
    background: #f3f1ff;
    display: grid;
    place-items: center;
    color: var(--accent);
  }

  .value-icon svg {
    height: 23px;
    width: 23px;
  }

  .value-item>div {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

  .value-item strong {
    font-size: 12px;
    font-weight: 800;
  }

  .value-item div span {
    font-size: 11px;
    color: #8a90a1;
  }

  .section-space {
    padding-block: 100px;
  }

  .section-intro {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 30px;
    margin-bottom: 36px;
  }

  .section-kicker {
    color: var(--accent);
    letter-spacing: .17em;
    font-size: 10px;
    font-weight: 850;
    margin-bottom: 13px;
  }

  .section-intro h2 {
    font-size: clamp(29px,3.5vw,44px);
    letter-spacing: -.055em;
    font-weight: 770;
    line-height: 1.2;
    margin: 0;
  }

  .section-intro h2 em {
    color: var(--accent);
    font-style: normal;
  }

  .section-all {
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--accent);
    color: var(--ink);
  }

  .section-all span {
    color: var(--accent);
    margin-right: 10px;
  }

  .collection-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 16px;
  }

  .collection-tile {
    min-width: 0;
    min-height: 310px;
    border-radius: 20px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
    transition: transform .22s,box-shadow .22s;
    color: var(--ink)!important;
  }

  .collection-tile:hover {
    transform: translateY(-6px);
    box-shadow: 0 14px 35px #181c2c17;
  }

  .collection-tile--fashion {
    background: #e8e5ff;
  }

  .collection-tile--tech {
    background: #ecf0fc;
  }

  .collection-tile--home {
    background: #e9f5f0;
  }

  .collection-tile--more {
    background: #f6ecef;
  }

  .collection-number {
    font-weight: 850;
    font-size: 9px;
    letter-spacing: .14em;
    opacity: .58;
  }

  .collection-tile__contents {
    position: relative;
    z-index: 1;
  }

  .collection-tile h3 {
    font-size: 22px;
    letter-spacing: -.05em;
    font-weight: 800;
    margin: 0 0 8px;
  }

  .collection-tile__contents>span:last-child {
    font-size: 11px;
    color: #62697b;
  }

  .collection-visual {
    display: grid;
    place-items: center;
    height: 153px;
    margin-bottom: 17px;
  }

  .collection-visual svg {
    height: 143px;
    width: 143px;
    fill: #fff5;
    stroke-width: 2.4;
  }

  .collection-visual--fashion svg {
    stroke: #6d63cd;
  }

  .collection-visual--tech svg {
    stroke: #596db5;
  }

  .collection-visual--home svg {
    stroke: #448d79;
  }

  .collection-visual--more svg {
    stroke: #b67488;
  }

  .collection-arrow {
    position: absolute;
    left: 20px;
    bottom: 20px;
    font-size: 21px;
  }

  .featured-section {
    background: #fafbff;
  }

  .section-description {
    max-width: 560px;
    font-size: 13px;
    line-height: 1.75;
    color: #858a9d;
    margin: 15px 0 0;
  }

  .product-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 21px;
  }

  .product-image {
    background: #e2e5f4;
    display: block;
    overflow: hidden;
    position: relative;
    border-radius: 15px;
    aspect-ratio: 1/1.08;
  }

  .product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .45s;
  }

  .product-image:hover img {
    transform: scale(1.075);
  }

  .product-tag {
    position: absolute;
    top: 14px;
    right: 14px;
    font-size: 9px;
    letter-spacing: .1em;
    font-weight: 850;
    color: var(--ink);
    padding: 8px 9px;
    border-radius: 5px;
    background: #ffffffd9;
  }

  .product-view {
    position: absolute;
    bottom: 13px;
    right: 13px;
    left: 13px;
    display: block;
    background: #fff;
    padding: 13px 16px;
    border-radius: 7px;
    font-size: 11px;
    font-weight: 800;
    transform: translateY(130%);
    transition: transform .2s;
  }

  .product-image:hover .product-view,
  .product-image:focus-visible .product-view {
    transform: translateY(0);
  }

  .product-copy {
    padding: 19px 4px;
  }

  .product-copy>span {
    color: var(--accent);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .15em;
  }

  .product-copy h3 {
    font-size: 14px;
    letter-spacing: -.025em;
    margin: 9px 0 10px;
    font-weight: 740;
  }

  .product-copy>strong {
    font-size: 13px;
  }

  .empty-search {
    padding: 30px;
    border-radius: 12px;
    background: #f0efff;
    color: var(--ink);
    font-weight: 700;
  }

  .closing-cta {
    background: var(--ink);
    color: white;
    overflow: hidden;
  }

  .closing-cta__inner {
    position: relative;
    padding-block: 65px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
  }

  .closing-cta__inner>div {
    position: relative;
    z-index: 1;
  }

  .closing-cta__inner>div>span {
    display: block;
    color: #a69dff;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .16em;
    margin-bottom: 15px;
  }

  .closing-cta h2 {
    font-size: clamp(33px,4vw,55px);
    font-weight: 760;
    letter-spacing: -.055em;
    line-height: 1.12;
    margin: 0;
  }

  .btn-light {
    display: inline-flex;
    align-items: center;
    gap: 30px;
    border-radius: 8px;
    background: #fff;
    color: var(--ink);
    padding: 17px 21px;
    font-size: 12px;
    font-weight: 800;
    z-index: 1;
    white-space: nowrap;
  }

  .btn-light:hover {
    background: #e8e5ff;
    color: var(--ink);
  }

  .closing-ring {
    position: absolute;
    left: 10%;
    top: -250px;
    width: 550px;
    height: 550px;
    border: 100px solid #655ceb42;
    border-radius: 50%;
  }

  .site-footer {
    background: #111523;
    color: #d0d2db;
  }

  .footer-main {
    padding-block: 70px;
    display: grid;
    grid-template-columns: 2.1fr 1fr 1fr 1.35fr;
    gap: 40px;
  }

  .brand--footer {
    color: #fff;
    margin-bottom: 12px;
  }

  .site-footer p {
    font-size: 12px;
    line-height: 1.9;
    color: #8e96aa;
    margin: 12px 0 0;
  }

  .footer-main>div:not(:first-child) {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 13px;
  }

  .footer-main h3 {
    font-size: 13px;
    font-weight: 750;
    color: #fff;
    margin: 0 0 9px;
  }

  .footer-main a:not(.brand) {
    font-size: 12px;
    color: #a2a7bb;
  }

  .footer-main a:hover {
    color: white;
  }

  .footer-link {
    border-bottom: 1px solid #655ceb;
    padding-bottom: 5px;
  }

  .footer-bottom {
    padding: 22px 0;
    border-top: 1px solid #303548;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    color: #878ca2;
    font-size: 10px;
  }

  .footer-bottom a {
    color: #b2b0ef;
  }

  @media (max-width:1100px) {
    .container-wide {
      width: min(100% - 54px,1280px);
    }

    .main-nav {
      gap: 20px;
    }

    .header-shell {
      gap: 20px;
    }

    .hero-inner {
      grid-template-columns: 51% 49%;
      min-height: 550px;
    }

    .hero h1 {
      font-size: clamp(46px,5.8vw,71px);
    }

    .hero-art {
      height: 490px;
    }

    .hero-art__stage {
      height: 410px;
      width: 410px;
    }

    .float-card--top {
      left: -2%;
      top: 20%;
    }

    .float-card--bottom {
      bottom: 13%;
      right: -5%;
    }

    .hero-bottom-note {
      margin-top: 55px;
    }

    .collection-tile {
      min-height: 285px;
      padding: 17px;
    }

    .collection-tile h3 {
      font-size: 20px;
    }
  }

  @media (max-width:800px) {
    .container-wide {
      width: min(100% - 40px,1280px);
    }

    .header-shell {
      height: 72px;
    }

    .main-nav {
      display: none;
      position: absolute;
      top: 100%;
      right: 0;
      left: 0;
      padding: 15px 22px 24px;
      background: white;
      box-shadow: 0 20px 30px #171c2e1a;
      border-top: 1px solid var(--line);
      flex-direction: column;
      align-items: stretch;
      gap: 0;
    }

    .main-nav.is-open {
      display: flex;
    }

    .main-nav a {
      padding: 13px 10px;
      border-bottom: 1px solid var(--line);
      font-size: 13px;
    }

    .main-nav a::after {
      display: none;
    }

    .mobile-menu-toggle {
      display: grid;
    }

    .header-account {
      display: none;
    }

    .hero-inner {
      grid-template-columns: 1fr;
      min-height: unset;
    }

    .hero-copy {
      padding: 61px 0 12px;
    }

    .hero h1 {
      font-size: clamp(52px,8vw,83px);
      margin: 22px 0 15px;
    }

    .hero-copy>p {
      max-width: 550px;
    }

    .hero-bottom-note {
      display: none;
    }

    .hero-art {
      height: 455px;
      margin-bottom: 52px;
    }

    .hero-art__stage {
      height: 390px;
      width: 390px;
      top: 27px;
    }

    .hero-sneaker {
      width: min(90%,590px);
      transform: rotate(-9deg) scale(1.08);
    }

    .hero-art__vertical-text {
      left: 2%;
    }

    .float-card--top {
      left: 6%;
      top: 20%;
    }

    .float-card--bottom {
      right: 10%;
      bottom: 15%;
    }

    .hero-footer-line>.container-wide {
      height: 42px;
    }

    .values-row {
      min-height: 97px;
    }

    .value-item {
      gap: 8px;
    }

    .value-icon {
      width: 36px;
      height: 36px;
    }

    .value-item strong {
      font-size: 10px;
    }

    .value-item div span {
      font-size: 9px;
    }

    .section-space {
      padding-block: 65px;
    }

    .collection-grid,
    .product-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .collection-tile {
      min-height: 285px;
    }

    .footer-main {
      grid-template-columns: 1.5fr 1fr 1fr;
      gap: 28px;
    }

    .footer-main>div:last-child {
      grid-column: span 3;
    }

    .closing-cta__inner {
      padding-block: 48px;
    }
  }

  @media (max-width:520px) {
    .container-wide {
      width: min(100% - 34px,1280px);
    }

    .announcement {
      font-size: 9px;
    }

    .announcement__inner {
      height: 32px;
    }

    .announcement__inner>span {
      max-width: 56%;
      line-height: 1.2;
    }

    .brand-word {
      font-size: 23px;
    }

    .brand-dot {
      font-size: 30px;
    }

    .brand-mark {
      transform: scale(.88);
      margin-left: 6px;
    }

    .header-actions {
      gap: 3px;
    }

    .icon-button {
      width: 35px;
      height: 35px;
    }

    .header-shell {
      height: 65px;
    }

    .hero h1 {
      font-size: clamp(42px,11.2vw,59px);
    }

    .hero-copy {
      padding-top: 45px;
    }

    .eyebrow {
      font-size: 8px;
      gap: 8px;
    }

    .eyebrow-rule {
      width: 25px;
    }

    .hero-copy>p {
      font-size: 13px;
      line-height: 1.85;
    }

    .hero-ctas {
      gap: 20px;
    }

    .btn-main {
      font-size: 11px;
      min-height: 49px;
      padding-inline: 17px;
      gap: 15px;
    }

    .btn-link-custom {
      font-size: 11px;
    }

    .hero-art {
      height: 330px;
      margin-bottom: 41px;
    }

    .hero-art__stage {
      height: 290px;
      width: 290px;
      top: 19px;
    }

    .hero-art__tiny-label,
    .hero-art__vertical-text {
      display: none;
    }

    .hero-sneaker {
      width: 105%;
      max-width: none;
    }

    .float-card {
      padding: 8px 9px;
      gap: 6px;
      border-radius: 9px;
    }

    .float-card strong {
      font-size: 11px;
    }

    .float-card span:not(.float-card__sparkle):not(.float-card__mini-icon) {
      font-size: 7px;
    }

    .float-card__sparkle {
      font-size: 16px;
    }

    .float-card--top {
      left: 0;
      top: 19%;
    }

    .float-card--bottom {
      right: 0;
      bottom: 10%;
    }

    .float-card__mini-icon {
      width: 23px;
      height: 23px;
    }

    .hero-footer-line>.container-wide {
      font-size: 7px;
    }

    .values-row {
      grid-template-columns: 1fr;
      min-height: unset;
    }

    .value-item {
      justify-content: flex-start;
      padding: 16px 4px;
    }

    .value-item+.value-item {
      border-right: 0;
      border-top: 1px solid var(--line);
    }

    .value-item strong {
      font-size: 12px;
    }

    .value-item div span {
      font-size: 10px;
    }

    .section-space {
      padding-block: 55px;
    }

    .section-intro {
      align-items: start;
      flex-direction: column;
      gap: 18px;
    }

    .section-intro h2 {
      font-size: 32px;
    }

    .collection-grid {
      gap: 10px;
    }

    .collection-tile {
      min-height: 220px;
      border-radius: 14px;
      padding: 13px;
    }

    .collection-visual {
      height: 100px;
      margin-bottom: 12px;
    }

    .collection-visual svg {
      height: 100px;
      width: 100px;
    }

    .collection-tile h3 {
      font-size: 18px;
    }

    .collection-number {
      font-size: 8px;
    }

    .collection-tile__contents>span:last-child {
      font-size: 9px;
    }

    .collection-arrow {
      left: 12px;
      bottom: 13px;
    }

    .product-grid {
      gap: 11px;
    }

    .product-image {
      border-radius: 11px;
    }

    .product-copy h3 {
      font-size: 12px;
    }

    .product-copy {
      padding: 15px 2px;
    }

    .product-copy>span {
      font-size: 8px;
    }

    .product-tag {
      top: 9px;
      right: 9px;
      padding: 6px;
      font-size: 7px;
    }

    .closing-cta__inner {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding-block: 45px;
    }

    .closing-cta h2 {
      font-size: 37px;
    }

    .footer-main {
      grid-template-columns: 1fr 1fr;
      padding-block: 48px;
      gap: 34px 15px;
    }

    .footer-main>div:first-child,
    .footer-main>div:last-child {
      grid-column: span 2;
    }

    .footer-bottom {
      align-items: flex-start;
      flex-direction: column;
      gap: 9px;
      line-height: 1.7;
    }

    .search-panel__inner {
      padding-block: 15px 18px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    html {
      scroll-behavior: auto;
    }

    .hero-sneaker {
      animation: none;
    }

    *,
    *::before,
    *::after {
      transition-duration: .01ms!important;
      animation-duration: .01ms!important;
      scroll-behavior: auto!important;
    }
  }

    @media (max-width:800px) {
    .hero-art {
      width: 100%;
      min-width: 0;
    }
  }

  @media (max-width:520px) {
    .hero-art {
      margin-top: 36px;
      height: 320px;
      margin-bottom: 46px;
    }

    .hero-sneaker {
      animation: none;
      width: 100%;
      max-width: 100%;
      transform: rotate(-9deg) scale(1.05);
    }

    .hero-art__stage {
      top: 15px;
    }
  }

  .hero-sneaker {
    height: auto;
    object-fit: contain;
  }

  .vyora-header-v2 {
    position: relative;
    top: auto;
    z-index: 90;
    background: #fff;
    border-bottom: 1px solid #ececf5;
    box-shadow: 0 5px 24px rgba(23, 28, 46, .035);
    backdrop-filter: none;
  }

  .vyora-header-v2 .header-shell {
    height: 98px;
    gap: 18px;
  }

  .vyora-header-v2 .brand--header {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 205px;
    text-decoration: none;
  }

  .vyora-header-v2 .brand-emblem {
    width: 47px;
    height: 47px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    border-radius: 15px;
    background: #eeedff;
    transition: background-color .22s ease, transform .22s ease;
  }

  .vyora-header-v2 .brand--header:hover .brand-emblem {
    background: #e3e1ff;
    transform: translateY(-2px);
  }

  .vyora-header-v2 .brand--header .brand-mark {
    width: 28px;
    height: 28px;
    margin: 0;
    transform: translateY(1px);
    gap: 3px;
  }

  .vyora-header-v2 .brand--header .brand-mark span {
    width: 7px;
    height: 24px;
    border-radius: 3px;
  }

  .vyora-header-v2 .brand--header .brand-mark span:first-child,
  .vyora-header-v2 .brand--header .brand-mark span:last-child {
    height: 16px;
  }

  .vyora-header-v2 .brand-identity {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }

  .vyora-header-v2 .brand--header .brand-word {
    color: var(--ink);
    font-size: 25px;
    font-weight: 800;
    letter-spacing: -.065em;
    line-height: 1;
    white-space: nowrap;
  }

  .vyora-header-v2 .brand--header .brand-dot {
    margin-right: 1px;
    font-size: 27px;
    font-weight: 800;
    letter-spacing: 0;
  }

  .vyora-header-v2 .brand-sublabel {
    color: #9399ad;
    font-size: 8px;
    letter-spacing: .13em;
    font-weight: 800;
    white-space: nowrap;
  }

  .vyora-header-v2 .main-nav {
    display: flex;
    align-items: center;
    gap: 3px;
    margin-right: auto;
    padding: 6px;
    background: #f6f6fb;
    border: 1px solid #f0eff7;
    border-radius: 999px;
  }

  .vyora-header-v2 .main-nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    color: #62697d;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -.02em;
    transition: color .2s ease, background-color .2s ease, box-shadow .2s ease;
  }

  .vyora-header-v2 .main-nav a::after {
    display: none;
  }

  .vyora-header-v2 .main-nav a:hover {
    color: var(--ink);
    background: #fff;
  }

  .vyora-header-v2 .main-nav .nav-link-current {
    color: var(--ink);
    background: #fff;
    box-shadow: 0 2px 10px rgba(20, 23, 45, .07);
  }

  .vyora-header-v2 .main-nav .nav-mobile-account {
    display: none;
  }

  .vyora-header-v2 .header-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: none;
    margin-right: 16px;
  }

  .vyora-header-v2 .icon-button {
    width: 43px;
    height: 43px;
    border-radius: 13px;
    color: #272d43;
  }

  .vyora-header-v2 .icon-button svg {
    width: 20px;
    height: 20px;
  }

  .vyora-header-v2 .icon-button:hover,
  .vyora-header-v2 .icon-button[aria-expanded="true"] {
    color: var(--accent);
    background: #f0eeff;
  }

  .vyora-header-v2 .header-actions-divider {
    display: block;
    width: 1px;
    height: 26px;
    margin-inline: 6px 8px;
    background: #e6e7f0;
  }

  .vyora-header-v2 .shopping-bag {
    color: #fff;
    background: var(--ink);
    border-radius: 13px;
  }

  .vyora-header-v2 .shopping-bag:hover {
    color: #fff;
    background: var(--accent);
  }

  .vyora-header-v2 .mobile-menu-toggle {
    display: none;
  }

  .vyora-header-v2 a:focus-visible,
  .vyora-header-v2 button:focus-visible,
  .vyora-header-v2 input:focus-visible {
    outline: 3px solid rgba(101, 92, 235, .55);
    outline-offset: 3px;
  }

  @media (max-width: 1210px) {
    .vyora-header-v2 .header-shell {
      gap: 10px;
    }

    .vyora-header-v2 .brand--header {
      min-width: 185px;
    }

    .vyora-header-v2 .main-nav a {
      padding-inline: 12px;
      font-size: 11px;
    }

    .vyora-header-v2 .header-actions {
      margin-right: 7px;
    }
  }

  @media (max-width: 1030px) {
    .vyora-header-v2 .header-shell {
      height: 82px;
    }

    .vyora-header-v2 .main-nav {
      display: none;
      position: absolute;
      top: calc(100% + 12px);
      right: 50%;
      left: auto;
      width: min(calc(100% - 40px), 520px);
      max-height: min(70vh, 520px);
      overflow-y: auto;
      transform: translateX(50%);
      z-index: 100;
      margin: 0;
      padding: 10px;
      border: 1px solid #eae9f5;
      border-radius: 20px;
      box-shadow: 0 25px 60px rgba(20, 24, 51, .16);
      background: #fff;
      flex-direction: column;
      align-items: stretch;
      gap: 2px;
    }

    .vyora-header-v2 .main-nav.is-open {
      display: flex;
    }

    .vyora-header-v2 .main-nav a {
      display: flex;
      min-height: 48px;
      justify-content: flex-start;
      padding: 0 16px;
      border: 0;
      border-radius: 12px;
      font-size: 13px;
      color: #50576c;
    }

    .vyora-header-v2 .main-nav .nav-link-current {
      background: #f0eeff;
      color: var(--accent);
      box-shadow: none;
    }

    .vyora-header-v2 .main-nav .nav-mobile-account {
      display: flex;
      justify-content: space-between;
      border-top: 1px solid #edeef4;
      border-radius: 0;
      margin-top: 6px;
      padding-top: 7px;
    }

    .vyora-header-v2 .header-actions {
      margin-right: auto;
    }

    .vyora-header-v2 .mobile-menu-toggle {
      display: grid;
      background: #eeedff;
      color: var(--accent);
      margin-right: 5px;
    }

    .vyora-header-v2 .mobile-menu-toggle:hover {
      background: #e3dfff;
    }
  }

  @media (max-width: 520px) {
    .vyora-header-v2 .header-shell {
      height: 74px;
    }

    .vyora-header-v2 .brand--header {
      min-width: 0;
      gap: 9px;
    }

    .vyora-header-v2 .brand-emblem {
      width: 39px;
      height: 39px;
      border-radius: 12px;
    }

    .vyora-header-v2 .brand--header .brand-mark {
      transform: translateY(1px) scale(.83);
    }

    .vyora-header-v2 .brand--header .brand-word {
      font-size: 23px;
    }

    .vyora-header-v2 .brand-sublabel {
      font-size: 7px;
      letter-spacing: .1em;
    }

    .vyora-header-v2 .header-actions {
      gap: 3px;
    }

    .vyora-header-v2 .header-account,
    .vyora-header-v2 .header-actions-divider {
      display: none;
    }

    .vyora-header-v2 .icon-button {
      width: 38px;
      height: 39px;
      border-radius: 11px;
    }

    .vyora-header-v2 .icon-button svg {
      width: 19px;
      height: 19px;
    }

    .vyora-header-v2 .mobile-menu-toggle {
      margin-right: 1px;
    }

    .vyora-header-v2 .main-nav {
      width: calc(100% - 24px);
    }
  }
}

/* ==================================================
   03. Storefront Navigation & Hero
================================================== */

@scope (
  html:is(
    [data-vyora-page="about.html"],
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"],
    [data-vyora-style-group="g04"],
    [data-vyora-style-group="g05"],
    [data-vyora-page="category.html"],
    [data-vyora-page="confirmation.html"],
    [data-vyora-page="contact.html"],
    [data-vyora-page="faq.html"],
    [data-vyora-page="index.html"],
    [data-vyora-style-group="g12"],
    [data-vyora-page="single-product.html"],
    [data-vyora-page="testimonial.html"]
  )
) {
  :scope {
    --font: "Manrope","Segoe UI",Arial,sans-serif;
  }

  body {
    font-family: var(--font);
  }

  .commerce-container {
    width: min(calc(100% - 112px),1520px);
    margin-inline: auto;
  }

  .site-header.vyora-header-v3 {
    position: relative;
    top: auto;
    z-index: 130;
    background: #fff;
    border-bottom: 1px solid #eaeaf0;
    box-shadow: none;
    backdrop-filter: none;
  }

  .commerce-header-row {
    height: 101px;
    display: flex;
    align-items: center;
    gap: 24px;
  }

  .commerce-brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    white-space: nowrap;
    flex-shrink: 0;
    text-decoration: none;
  }

  .commerce-brand__mark {
    position: relative;
    width: 32px;
    height: 32px;
    display: inline-flex;
    gap: 3px;
    align-items: center;
    justify-content: center;
    transform: rotate(-13deg);
  }

  .commerce-brand__mark span {
    width: 7px;
    background: #655ceb;
    border-radius: 3px;
    display: block;
    height: 22px;
    transform: skew(-22deg);
  }

  .commerce-brand__mark span:first-child {
    height: 14px;
    align-self: flex-start;
    margin-top: 4px;
    transform: skew(22deg);
  }

  .commerce-brand__mark span:last-child {
    height: 14px;
    align-self: flex-end;
    margin-bottom: 4px;
    transform: skew(22deg);
  }

  .commerce-brand__name {
    font-size: 28px;
    line-height: 1;
    letter-spacing: -.065em;
    font-weight: 800;
    color: #171c2e;
  }

  .commerce-brand__name>span {
    color: var(--accent);
  }

  .categories-control {
    position: relative;
    flex-shrink: 0;
    z-index: 5;
  }

  .categories-trigger {
    display: flex;
    align-items: center;
    gap: 13px;
    border: 1px solid #e3e5ee;
    border-radius: 999px;
    background: #fff;
    color: #171c2e;
    height: 54px;
    padding: 0 20px;
    min-width: 205px;
    justify-content: space-between;
    font-size: 13px;
    font-weight: 800;
    transition: background-color .18s,border-color .18s,box-shadow .18s;
  }

  .categories-trigger:hover,
  .categories-trigger[aria-expanded=true] {
    background: #fafaff;
    border-color: #cec8ff;
    box-shadow: 0 6px 24px rgba(55,50,140,.07);
  }

  .categories-trigger svg {
    width: 18px;
    height: 18px;
    stroke-width: 2.1;
    flex: none;
  }

  .categories-trigger svg:first-child {
    stroke: var(--accent);
    fill: #655ceb11;
  }

  .categories-trigger .categories-chevron {
    width: 17px;
    height: 17px;
    transition: transform .2s;
  }

  .categories-trigger[aria-expanded=true] .categories-chevron {
    transform: rotate(180deg);
  }

  .categories-dropdown {
    position: absolute;
    top: calc(100% + 14px);
    right: 0;
    width: 265px;
    padding: 15px;
    border: 1px solid #e9e8f3;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 23px 55px rgba(23,28,46,.13);
  }

  .categories-dropdown p {
    font-size: 10px;
    color: #898da4;
    letter-spacing: .12em;
    text-transform: uppercase;
    font-weight: 800;
    margin: 4px 12px 10px;
  }

  .categories-dropdown a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 9px;
    padding: 12px;
    color: #252a3e;
    font-size: 12px;
    font-weight: 700;
  }

  .categories-dropdown a:hover {
    color: var(--accent);
    background: #f3f1ff;
  }

  .commerce-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    flex: 1;
    margin-right: auto;
  }

  .commerce-nav>a,
  .commerce-nav__group>summary {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #1d2436;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    min-height: 42px;
    transition: color .15s ease;
  }

  .commerce-nav>a:hover,
  .commerce-nav__group>summary:hover,
  .commerce-nav__group[open]>summary,
  .commerce-nav .commerce-nav__active {
    color: var(--accent);
  }

  .commerce-nav__group {
    position: relative;
  }

  .commerce-nav__group>summary {
    cursor: pointer;
    list-style: none;
  }

  .commerce-nav__group>summary::-webkit-details-marker {
    display: none;
  }

  .commerce-nav__group>summary span {
    font-size: 18px;
    font-weight: 500;
    color: #4d5367;
    line-height: 1;
  }

  .commerce-nav__group[open]>summary span {
    transform: rotate(45deg);
  }

  .commerce-nav__submenu {
    position: absolute;
    right: -18px;
    top: calc(100% + 22px);
    min-width: 195px;
    padding: 9px;
    background: #fff;
    border: 1px solid #e8eaf2;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(23,28,46,.12);
  }

  .commerce-nav__submenu:before {
    position: absolute;
    content: "";
    height: 26px;
    right: 0;
    left: 0;
    top: -22px;
  }

  .commerce-nav__submenu a {
    display: block;
    padding: 10px 12px;
    color: #383e54;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 700;
  }

  .commerce-nav__submenu a:hover {
    color: var(--accent);
    background: #f3f1ff;
  }

  .commerce-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 17px;
    margin-right: 12px;
    flex-shrink: 0;
  }

  .commerce-icon-button {
    position: relative;
    display: grid;
    place-items: center;
    flex: none;
    width: 39px;
    height: 43px;
    padding: 0;
    color: #1b2340;
    background: transparent;
    border: 0;
    border-radius: 10px;
    transition: background .2s,color .2s;
  }

  .commerce-icon-button svg {
    width: 22px;
    height: 22px;
    stroke-width: 1.8;
  }

  .commerce-icon-button:hover,
  .commerce-icon-button[aria-expanded=true] {
    background: #f3f1ff;
    color: var(--accent);
  }

  .commerce-actions .favorites-trigger[aria-pressed=true] {
    color: var(--accent);
  }

  .commerce-actions .favorites-trigger[aria-pressed=true] svg {
    fill: #e5e2ff;
  }

  .commerce-actions .mobile-menu-toggle {
    display: none;
  }

  .shopfront-hero {
    position: relative;
    overflow: hidden;
    min-height: 670px;
    background: linear-gradient(118deg,#f8f9fd 3%,#f4f5fd 58%,#f3f1ff 100%);
  }

  .shopfront-hero__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,1.24fr) minmax(0,1.12fr) minmax(240px,.73fr);
    gap: 24px;
    align-items: center;
    min-height: 670px;
    padding-block: 80px 84px;
  }

  .shopfront-hero__copy {
    position: relative;
    align-self: center;
    padding-top: 6px;
  }

  .shopfront-hero__eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    letter-spacing: .025em;
    font-weight: 800;
    font-size: 13px;
    color: var(--accent);
    margin: 0 0 26px;
    white-space: nowrap;
  }

  .shopfront-hero__eyebrow span {
    display: inline-block;
    width: 44px;
    height: 1px;
    background: #9a94e9;
  }

  .shopfront-hero__copy h1 {
    margin: 0;
    color: #171c2e;
    font-size: clamp(44px,4.4vw,76px);
    font-weight: 800;
    letter-spacing: -.068em;
    line-height: 1.18;
  }

  .shopfront-hero__copy h1 span {
    display: block;
  }

  .shopfront-hero__copy p {
    font-size: 15px;
    line-height: 1.95;
    color: #70788d;
    max-width: 495px;
    margin: 24px 0 32px;
    font-weight: 500;
  }

  .shopfront-hero__button {
    height: 54px;
    border-radius: 14px;
    padding: 0 25px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 23px;
    background: var(--accent);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .015em;
    box-shadow: 0 13px 27px rgba(101,92,235,.17);
    transition: transform .2s ease,background .2s ease,box-shadow .2s ease;
  }

  .shopfront-hero__button:hover {
    color: #fff;
    background: #5148cf;
    transform: translateY(-2px);
    box-shadow: 0 18px 32px rgba(101,92,235,.25);
  }

  .shopfront-hero__button svg {
    width: 18px;
    height: 18px;
  }

  .shopfront-hero__pager {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 49px;
  }

  .shopfront-hero__pager button {
    display: block;
    width: 11px;
    height: 11px;
    padding: 0;
    border: 0;
    border-radius: 100%;
    background: #d3d3e8;
    box-shadow: none;
    transition: transform .2s ease,background-color .2s ease;
  }

  .shopfront-hero__pager button:hover {
    background: #a6a0fb;
  }

  .shopfront-hero__pager button.is-current {
    background: #655ceb;
    transform: scale(1.18);
  }

  .shopfront-hero__image-wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    height: 420px;
    isolation: isolate;
  }

  .shopfront-hero__halo {
    position: absolute;
    z-index: -1;
    width: min(100%,460px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle at 50% 48%,#edeaff 8%,#dfdcff 58%,#f0effd 70%,transparent 72%);
    opacity: .84;
  }

  .shopfront-hero__image-holder {
    position: relative;
    width: 116%;
    max-width: none;
    display: flex;
    justify-content: center;
    align-items: center;
    filter: drop-shadow(0 22px 18px rgba(23,28,46,.13));
  }

  .shopfront-hero__image-holder img {
    width: 110%;
    max-width: none;
    min-width: 350px;
    height: auto;
    max-height: 440px;
    object-fit: contain;
    transform: rotate(-3deg);
    transition: opacity .22s ease,transform .32s ease;
  }

  .shopfront-hero__image-holder img.is-swapping {
    opacity: .1;
    transform: scale(.96) rotate(0deg);
  }

  .shopfront-hero__floating-badge {
    position: absolute;
    right: 2%;
    bottom: 9%;
    z-index: 2;
    padding: 10px 13px;
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px solid #e8e5f8;
    border-radius: 8px;
    background: rgba(255,255,255,.93);
    font-weight: 800;
    font-size: 9px;
    letter-spacing: .075em;
    white-space: nowrap;
    color: #33374b;
    box-shadow: 0 9px 24px rgba(23,28,46,.06);
  }

  .shopfront-hero__floating-badge span {
    color: #655ceb;
    font-size: 15px;
  }

  .shopfront-hero__decoration {
    position: absolute;
    opacity: .4;
    pointer-events: none;
    width: 170px;
    height: 170px;
    border: 1px solid #cecaff;
    border-radius: 100%;
  }

  .shopfront-hero__decoration--one {
    top: -95px;
    right: -80px;
    box-shadow: 0 0 0 27px #f0edff,0 0 0 60px #faf9ff;
  }

  .shopfront-hero__decoration--two {
    bottom: -90px;
    left: -70px;
    box-shadow: 0 0 0 20px #f0edff,0 0 0 45px #faf9ff;
  }

  .shopfront-hero__corner-mark {
    position: absolute;
    bottom: 18px;
    right: calc((100% - min(calc(100% - 112px),1520px))/2);
    font-size: 9px;
    letter-spacing: .15em;
    font-weight: 800;
    color: #a0a0b9;
  }

  .commerce-brand:focus-visible,
  .categories-trigger:focus-visible,
  .commerce-nav a:focus-visible,
  .commerce-nav summary:focus-visible,
  .commerce-actions button:focus-visible,
  .commerce-actions a:focus-visible,
  .shopfront-hero__pager button:focus-visible,
  .shopfront-hero__button:focus-visible {
    outline: 3px solid #aba5ff;
    outline-offset: 3px;
  }

  @media (max-width:1370px) {
    .commerce-container {
      width: min(calc(100% - 78px),1520px);
    }

    .commerce-header-row {
      gap: 18px;
    }

    .commerce-nav {
      gap: 18px;
    }

    .categories-trigger {
      min-width: 185px;
      padding-inline: 15px;
    }

    .commerce-actions {
      gap: 8px;
      margin-right: 3px;
    }

    .shopfront-hero__grid {
      grid-template-columns: minmax(0,1.2fr) minmax(0,1.12fr) minmax(220px,.72fr);
    }

    .shopfront-hero__copy h1 {
      font-size: clamp(44px,4.55vw,66px);
    }

    .shopfront-hero__corner-mark {
      right: 39px;
    }
  }

  @media (max-width:1170px) {
    .commerce-header-row {
      height: 86px;
    }

    .commerce-actions .mobile-menu-toggle {
      display: grid;
      background: #f5f3ff;
      color: #655ceb;
    }

    .commerce-nav {
      display: none;
      position: absolute;
      top: calc(100% + 9px);
      right: 50%;
      transform: translateX(50%);
      z-index: 20;
      width: min(560px,calc(100% - 38px));
      margin: 0;
      padding: 16px;
      flex-direction: column;
      align-items: stretch;
      gap: 3px;
      background: white;
      border: 1px solid #e8e9f3;
      border-radius: 18px;
      box-shadow: 0 22px 54px rgba(23,28,46,.15);
      max-height: 70vh;
      overflow-y: auto;
    }

    .commerce-nav.is-open {
      display: flex;
    }

    .commerce-nav>a,
    .commerce-nav__group>summary {
      width: 100%;
      padding: 8px 12px;
      min-height: 44px;
      font-size: 14px;
      justify-content: space-between;
    }

    .commerce-nav__group>summary span {
      margin-right: auto;
    }

    .commerce-nav__submenu {
      position: static;
      box-shadow: none;
      margin: 2px 8px 10px;
      padding: 5px;
      background: #f8f8fc;
      border-radius: 11px;
    }

    .commerce-nav__submenu:before {
      display: none;
    }

    .commerce-actions {
      margin-right: auto;
    }

    .shopfront-hero__grid {
      grid-template-columns: minmax(0,1.1fr) minmax(0,1fr) minmax(190px,.63fr);
      gap: 12px;
      min-height: 590px;
      padding-block: 70px;
    }

    .shopfront-hero {
      min-height: 590px;
    }

    .shopfront-hero__copy h1 {
      font-size: clamp(40px,4.65vw,60px);
    }

    .shopfront-hero__copy p {
      font-size: 13px;
    }

    .shopfront-hero__image-wrap {
      height: 370px;
    }

    .shopfront-hero__image-holder img {
      min-width: 280px;
    }
  }

  @media (max-width:850px) {
    .commerce-container {
      width: min(calc(100% - 48px),650px);
    }

    .commerce-header-row {
      height: 79px;
      gap: 15px;
    }

    .commerce-brand__name {
      font-size: 26px;
    }

    .categories-trigger {
      min-width: unset;
      width: 54px;
      height: 48px;
      padding: 0;
      justify-content: center;
    }

    .categories-trigger>span,
    .categories-trigger .categories-chevron {
      display: none;
    }

    .categories-dropdown {
      right: -65px;
    }

    .commerce-actions {
      gap: 3px;
    }

    .commerce-icon-button {
      width: 38px;
    }

    .shopfront-hero__grid {
      grid-template-columns: minmax(0,1fr) minmax(220px,.74fr);
      gap: 20px;
      min-height: unset;
      padding-block: 55px;
    }

    .shopfront-hero__copy {
      grid-column: 1/-1;
    }

    .shopfront-hero__copy h1 {
      font-size: clamp(46px,8vw,74px);
    }

    .shopfront-hero__copy p {
      font-size: 14px;
      max-width: 580px;
      margin-block: 20px 24px;
    }

    .shopfront-hero__pager {
      margin-top: 28px;
    }

    .shopfront-hero__image-wrap {
      height: 350px;
    }

    .shopfront-hero__image-holder {
      width: 107%;
    }

    .shopfront-hero__corner-mark {
      display: none;
    }
  }

  @media (max-width:550px) {
    .commerce-container {
      width: calc(100% - 36px);
    }

    .commerce-header-row {
      gap: 7px;
      height: 73px;
    }

    .commerce-brand {
      gap: 6px;
    }

    .commerce-brand__name {
      font-size: 23px;
    }

    .commerce-brand__mark {
      transform: scale(.82) rotate(-13deg);
      width: 26px;
      margin-left: 1px;
    }

    .categories-control {
      margin-right: auto;
    }

    .categories-trigger {
      width: 39px;
      height: 39px;
      border-radius: 11px;
    }

    .categories-trigger>svg:first-child {
      width: 16px;
      height: 16px;
    }

    .categories-dropdown {
      right: auto;
      left: -120px;
      width: min(calc(100vw - 36px),285px);
    }

    .commerce-actions {
      gap: 0;
      margin-right: 0;
    }

    .commerce-icon-button {
      width: 35px;
      height: 39px;
    }

    .commerce-icon-button svg {
      width: 19px;
      height: 19px;
    }

    .commerce-actions .favorites-trigger {
      display: none;
    }

    .shopfront-hero {
      min-height: unset;
    }

    .shopfront-hero__grid {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 4px;
      padding-block: 46px 48px;
    }

    .shopfront-hero__copy h1 {
      font-size: clamp(42px,10.5vw,59px);
    }

    .shopfront-hero__eyebrow {
      font-size: 10px;
      gap: 8px;
      margin-bottom: 17px;
    }

    .shopfront-hero__eyebrow span {
      width: 25px;
    }

    .shopfront-hero__copy p {
      font-size: 13px;
      line-height: 1.8;
      margin-block: 15px 22px;
    }

    .shopfront-hero__button {
      height: 48px;
      font-size: 11px;
      border-radius: 11px;
    }

    .shopfront-hero__pager {
      margin-top: 22px;
      gap: 11px;
    }

    .shopfront-hero__pager button {
      width: 9px;
      height: 9px;
    }

    .shopfront-hero__image-wrap {
      width: 100%;
      height: 278px;
      margin-top: 20px;
    }

    .shopfront-hero__halo {
      width: 295px;
    }

    .shopfront-hero__image-holder {
      width: 100%;
    }

    .shopfront-hero__image-holder img {
      width: 100%;
      min-width: 0;
      max-height: 260px;
    }

    .shopfront-hero__floating-badge {
      right: 2%;
      bottom: 5%;
      font-size: 8px;
      padding: 8px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .shopfront-hero__button,
    .shopfront-hero__image-holder img {
      transition: none;
    }
  }

  .shopfront-hero {
    min-height: 620px;
    background: radial-gradient(circle at 80% 47%,#eae7ff 0,#f4f2ff 29%,transparent 58%),linear-gradient(115deg,#fafbff 1%,#f5f5fe 68%,#f1eeff 100%);
  }

  .shopfront-hero__grid {
    grid-template-columns: minmax(0,1fr) minmax(0,1.04fr);
    gap: clamp(24px,4.5vw,90px);
    min-height: 620px;
    padding-block: 66px 79px;
  }

  .shopfront-hero__copy {
    padding-top: 0;
    max-width: 650px;
  }

  .shopfront-hero__copy h1 {
    font-size: clamp(54px,5.25vw,90px);
    line-height: 1.12;
    letter-spacing: -.075em;
  }

  .shopfront-hero__copy h1 span:last-child {
    color: #655ceb;
  }

  .shopfront-hero__copy p {
    max-width: 510px;
    margin: 25px 0 30px;
    font-size: 15px;
    line-height: 1.9;
  }

  .shopfront-hero__pager {
    margin-top: 39px;
    gap: 12px;
  }

  .shopfront-hero__pager button {
    width: 26px;
    height: 6px;
    border-radius: 99px;
    background: #d7d4ee;
    transform: none!important;
  }

  .shopfront-hero__pager button.is-current {
    width: 48px;
    background: #655ceb;
  }

  .shopfront-hero__image-wrap {
    height: 470px;
    width: 100%;
  }

  .shopfront-hero__halo {
    width: min(87%,515px);
    background: radial-gradient(circle at 50% 48%,#f9f8ff 4%,#ded9ff 48%,#d6d0ff 65%,transparent 69%);
  }

  .shopfront-hero__image-holder {
    width: 100%;
  }

  .shopfront-hero__image-holder img {
    width: 100%;
    min-width: 0;
    max-width: 700px;
    max-height: 500px;
    filter: drop-shadow(0 15px 14px rgba(23,28,46,.08));
    object-fit: contain;
  }

  .shopfront-hero__floating-badge {
    right: 3%;
    bottom: 13%;
    padding: 15px 18px;
    font-size: 10px;
    border-radius: 13px;
    box-shadow: 0 17px 40px rgba(23,28,46,.09);
  }

  .shopfront-hero__index {
    position: absolute;
    left: 3%;
    top: 12%;
    font-size: 12px;
    color: #9a93b5;
    font-weight: 700;
    letter-spacing: .09em;
  }

  .shopfront-hero__index strong {
    font-size: 26px;
    color: #655ceb;
    font-weight: 800;
    letter-spacing: -.05em;
  }

  .shopfront-hero__eyebrow {
    font-size: 11px;
    letter-spacing: .09em;
  }

  .shopfront-hero__button {
    border-radius: 999px;
    height: 54px;
    padding: 0 27px;
  }

  .shopfront-hero__copy.is-changing>* {
    animation: vyora-slide-enter .55s both;
  }

  .shopfront-hero__image-wrap.is-changing .shopfront-hero__image-holder img {
    animation: vyora-image-enter .6s ease both;
  }

  @keyframes vyora-slide-enter {
    from {
      opacity: .25;
      transform: translateY(12px);
    }

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

  @keyframes vyora-image-enter {
    from {
      opacity: .25;
      transform: translateX(-14px) scale(.98) rotate(-2deg);
    }

    to {
      opacity: 1;
      transform: translateX(0) scale(1) rotate(-3deg);
    }
  }

    .categories-control::after {
    content: "";
    display: none;
    position: absolute;
    right: 0;
    left: 0;
    top: 100%;
    height: 17px;
  }

  @media (hover:hover) and (pointer:fine) and (min-width:1171px) {
    .categories-control:hover::after,
    .categories-control:focus-within::after {
      display: block;
    }

    .commerce-nav__group:hover>summary {
      color: #655ceb;
    }
  }

  @media (max-width:1370px) {
    .shopfront-hero__grid {
      grid-template-columns: minmax(0,1fr) minmax(0,1.03fr);
      gap: 24px;
    }

    .shopfront-hero__copy h1 {
      font-size: clamp(52px,5.4vw,74px);
    }
  }

  @media (max-width:1170px) {
    .shopfront-hero,
    .shopfront-hero__grid {
      min-height: 560px;
    }

    .shopfront-hero__grid {
      grid-template-columns: minmax(0,1fr) minmax(0,1fr);
      gap: 18px;
      padding-block: 59px;
    }

    .shopfront-hero__copy h1 {
      font-size: clamp(46px,5.5vw,66px);
    }

    .shopfront-hero__image-wrap {
      height: 390px;
    }
  }

  @media (max-width:850px) {
    .shopfront-hero,
    .shopfront-hero__grid {
      min-height: unset;
    }

    .shopfront-hero__grid {
      grid-template-columns: 1fr;
      gap: 12px;
      padding-block: 52px;
    }

    .shopfront-hero__copy {
      grid-column: 1;
      max-width: none;
    }

    .shopfront-hero__copy h1 {
      font-size: clamp(50px,8vw,70px);
    }

    .shopfront-hero__copy p {
      margin: 18px 0 24px;
    }

    .shopfront-hero__pager {
      margin-top: 28px;
    }

    .shopfront-hero__image-wrap {
      height: 360px;
      max-width: 620px;
      margin-inline: auto;
    }

    .shopfront-hero__image-holder img {
      max-height: 380px;
    }

    .shopfront-hero__floating-badge {
      bottom: 6%;
      right: 8%;
    }

    .shopfront-hero__index {
      top: 8%;
    }
  }

  @media (max-width:550px) {
    .shopfront-hero__grid {
      display: flex;
      flex-direction: column;
      gap: 0;
      padding-block: 40px 40px;
    }

    .shopfront-hero__copy h1 {
      font-size: clamp(42px,10.4vw,57px);
    }

    .shopfront-hero__copy p {
      font-size: 13px;
      margin-block: 15px 22px;
    }

    .shopfront-hero__pager {
      margin-top: 23px;
    }

    .shopfront-hero__pager button {
      height: 5px;
      width: 23px;
    }

    .shopfront-hero__pager button.is-current {
      width: 38px;
    }

    .shopfront-hero__image-wrap {
      height: 275px;
      margin-top: 22px;
    }

    .shopfront-hero__image-holder img {
      max-height: 270px;
    }

    .shopfront-hero__floating-badge {
      right: 2%;
      bottom: 5%;
      font-size: 9px;
      padding: 9px 12px;
    }

    .shopfront-hero__index {
      left: 0;
      top: 2%;
    }

    .shopfront-hero__index strong {
      font-size: 21px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .shopfront-hero__copy.is-changing>*,
    .shopfront-hero__image-wrap.is-changing .shopfront-hero__image-holder img {
      animation: none;
    }
  }
}

/* ==================================================
   04. Trending Collections & Promotions
================================================== */

@scope (
  html:is(
    [data-vyora-page="index.html"]
  )
) {
  .trending-section {
    background: #fff;
  }

  .trending-section .container-wide {
    max-width: 1340px;
  }

  .trending-heading-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 42px;
    margin-bottom: 36px;
  }

  .trending-heading-copy {
    max-width: 445px;
    flex: 0 1 445px;
  }

  .trending-kicker {
    display: inline-flex;
    align-items: center;
    background: #eeecff;
    color: #5a50cd;
    min-height: 28px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 10px;
    letter-spacing: .07em;
    font-weight: 800;
  }

  .trending-heading-copy h2 {
    margin: 18px 0 0;
    color: #171c2e;
    font-size: clamp(35px,3.5vw,51px);
    font-weight: 800;
    letter-spacing: -.055em;
    line-height: 1.14;
  }

  .trending-heading-copy h2 em {
    font-style: normal;
    color: #655ceb;
  }

  .trending-heading-copy .section-description {
    margin-top: 15px;
    line-height: 1.8;
    color: #83899c;
    font-size: 13px;
  }

  .trending-tab-list {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px;
    min-width: 0;
    max-width: 100%;
    flex-wrap: wrap;
    overflow: visible;
  }

  .trending-tab {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    min-height: 48px;
    padding: 10px 12px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #515a71;
    font-weight: 700;
    white-space: nowrap;
    font-size: 12px;
    transition: background .22s,color .22s,box-shadow .22s;
  }

  .trending-tab:hover {
    color: #655ceb;
    background: #f8f7ff;
  }

  .trending-tab.is-active {
    color: #5147c8;
    background: #eeecff;
    box-shadow: inset 0 0 0 1px #e3dfff;
  }

  .trending-tab__count {
    display: grid;
    place-items: center;
    min-width: 23px;
    height: 23px;
    padding: 0 4px;
    border-radius: 8px;
    font-size: 9px;
    background: #f0f0f5;
    color: #84899d;
  }

  .trending-tab.is-active .trending-tab__count {
    background: #655ceb;
    color: #fff;
  }

  .trending-tab:focus:not(:focus-visible) {
    outline: none;
  }

  .trending-tab:focus-visible,
  .trending-product-image:focus-visible,
  .trending-dialog button:focus-visible {
    outline: 3px solid #aaa3ff;
    outline-offset: 3px;
  }

  .trending-section .visually-hidden {
    position: absolute!important;
    width: 1px!important;
    height: 1px!important;
    padding: 0!important;
    margin: -1px!important;
    overflow: hidden!important;
    clip: rect(0,0,0,0)!important;
    white-space: nowrap!important;
    border: 0!important;
  }

  .trending-panel[hidden] {
    display: none!important;
  }

  .trending-panel {
    animation: vyora-panel-fade .25s ease both;
  }

  @keyframes vyora-panel-fade {
    from {
      opacity: .38;
      transform: translateY(8px);
    }

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

  .trending-grid {
    gap: 24px;
    grid-template-columns: repeat(4,minmax(0,1fr));
  }

  .trending-card {
    min-width: 0;
  }

  .trending-product-image {
    display: flex;
    width: 100%;
    border: 0;
    padding: 0;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1/1.04;
    overflow: hidden;
    border-radius: 22px;
    background: #f4f4f8;
    cursor: pointer;
    position: relative;
    text-align: right;
  }

  .trending-card:nth-child(2) .trending-product-image {
    background: #f3f4fa;
  }

  .trending-card:nth-child(3) .trending-product-image {
    background: #f6f5f9;
  }

  .trending-card:nth-child(4) .trending-product-image {
    background: #f3f4f8;
  }

  .trending-product-image img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    transition: transform .4s cubic-bezier(.2,.7,.2,1);
    display: block;
  }

  .trending-product-image--photo img {
    object-fit: contain;
    object-position: center center;
  }

  .trending-product-image--illustration img {
    object-fit: contain;
    padding: 8%;
    filter: drop-shadow(0 12px 12px rgba(23,28,46,.07));
  }

  .trending-product-image:hover img,
  .trending-product-image:focus-visible img {
    transform: scale(1.06);
  }

  .trending-product-image .product-tag {
    top: 14px;
    right: 14px;
    color: #524ec4;
    background: #fffdfd;
    font-size: 9px;
    border-radius: 8px;
    padding: 9px 11px;
    letter-spacing: .07em;
    box-shadow: 0 5px 19px rgba(23,28,46,.04);
  }

  .trending-product-image .product-view {
    transform: translateY(190%);
    right: 14px;
    left: 14px;
    bottom: 14px;
    border-radius: 10px;
    background: #171c2e;
    color: white;
    text-align: center;
    padding: 13px;
    font-size: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 12px 28px rgba(23,28,46,.12);
  }

  .trending-product-image:hover .product-view,
  .trending-product-image:focus-visible .product-view {
    transform: translateY(0);
  }

  .trending-product-copy {
    padding: 19px 3px 3px;
  }

  .trending-product-copy>span {
    display: block;
    color: #7776a4;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .105em;
    text-transform: uppercase;
  }

  .trending-product-copy h3 {
    margin: 7px 0 5px;
    font-size: 16px;
    line-height: 1.38;
    color: #171c2e;
    font-weight: 750;
  }

  .trending-product-copy p {
    font-size: 12px;
    color: #898e9d;
    line-height: 1.5;
    margin: 0 0 11px;
  }

  .trending-product-copy>strong {
    font-size: 16px;
    font-weight: 800;
    color: #655ceb;
  }

  .trending-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding-top: 39px;
    margin-top: 35px;
    border-top: 1px solid #ecedf4;
  }

  .trending-bottom>span {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .13em;
    color: #9295a6;
  }

  .trending-bottom .section-all {
    margin: 0;
    font-size: 12px;
  }

  @media (max-width:1200px) {
    .trending-heading-row {
      align-items: flex-start;
      flex-direction: column;
      gap: 20px;
    }

    .trending-heading-copy {
      flex: 0 0 auto;
      max-width: 710px;
    }

    .trending-tab-list {
      width: 100%;
      max-width: none;
    }

    .trending-grid {
      gap: 17px;
    }
  }

  @media (max-width:790px) {
    .trending-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 15px;
    }

    .trending-tab-list {
      margin-inline: -4px;
      padding-inline: 4px;
      flex-wrap: nowrap;
      overflow-x: auto;
      overscroll-behavior-inline: contain;
      scrollbar-width: none;
      -ms-overflow-style: none;
    }

    .trending-tab-list::-webkit-scrollbar {
      display: none;
    }

    .trending-heading-copy h2 {
      font-size: 44px;
    }

    .trending-product-image {
      border-radius: 15px;
    }

    .trending-product-copy h3 {
      font-size: 14px;
    }
  }

  @media (max-width:520px) {
    .trending-heading-row {
      gap: 14px;
      margin-bottom: 24px;
    }

    .trending-heading-copy h2 {
      font-size: 36px;
      margin-top: 13px;
    }

    .trending-heading-copy .section-description {
      font-size: 12px;
      margin-top: 10px;
    }

    .trending-kicker {
      font-size: 9px;
    }

    .trending-tab {
      min-height: 43px;
      font-size: 11px;
      padding: 9px 10px;
    }

    .trending-tab__count {
      min-width: 21px;
      height: 21px;
    }

    .trending-grid {
      gap: 11px;
    }

    .trending-product-image {
      border-radius: 13px;
      aspect-ratio: 1/1.15;
    }

    .trending-product-image .product-tag {
      right: 8px;
      top: 8px;
      font-size: 7px;
      padding: 6px 7px;
    }

    .trending-product-image .product-view {
      position: absolute;
      bottom: 7px;
      right: 7px;
      left: 7px;
      transform: translateY(150%);
      padding: 9px;
      font-size: 10px;
    }

    .trending-product-copy {
      padding: 13px 2px 3px;
    }

    .trending-product-copy>span {
      font-size: 8px;
    }

    .trending-product-copy h3 {
      font-size: 12px;
      margin: 6px 0;
    }

    .trending-product-copy p {
      font-size: 10px;
      margin-bottom: 6px;
    }

    .trending-product-copy>strong {
      font-size: 12px;
    }

    .trending-bottom {
      margin-top: 22px;
      padding-top: 21px;
    }

    .trending-bottom>span {
      font-size: 8px;
      max-width: 48%;
    }

    .trending-bottom .section-all {
      font-size: 11px;
    }
  }

  @media (hover:none) {
    .trending-product-image .product-view {
      transform: translateY(0);
      background: #fff;
      color: #171c2e;
      bottom: 9px;
      right: 9px;
      left: 9px;
      padding: 10px;
      border-radius: 8px;
    }

    .trending-product-image .product-tag {
      background: #fff;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .trending-panel {
      animation: none;
    }

    .trending-product-image img,
    .trending-tab {
      transition: none;
    }
  }

  .trending-dialog {
    width: min(93vw,790px);
    max-width: 790px;
    border: 0;
    border-radius: 23px;
    padding: 0;
    box-shadow: 0 30px 100px rgba(23,28,46,.25);
    overflow: visible;
  }

  .trending-dialog::backdrop {
    background: rgba(17,21,35,.63);
  }

  .trending-dialog__body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    overflow: hidden;
    border-radius: 23px;
    background: #fff;
  }

  .trending-dialog__image {
    background: #f1f0fa;
    display: grid;
    place-items: center;
    aspect-ratio: 1/1.12;
    min-height: 300px;
  }

  .trending-dialog__image img {
    width: 90%;
    height: 88%;
    object-fit: contain;
  }

  .trending-dialog__info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 13px;
    padding: 35px;
  }

  .trending-dialog__info span {
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: .14em;
    color: #655ceb;
  }

  .trending-dialog__info h2 {
    font-size: clamp(25px,3vw,38px);
    letter-spacing: -.04em;
    margin: 0;
    line-height: 1.15;
    font-weight: 800;
  }

  .trending-dialog__info strong {
    font-size: 24px;
    color: #655ceb;
  }

  .trending-dialog__info p {
    font-size: 13px;
    color: #73798e;
    line-height: 1.8;
    margin: 0;
  }

  .trending-dialog__close {
    position: absolute;
    left: 13px;
    top: 13px;
    border: 0;
    border-radius: 50%;
    background: #fff;
    color: #171c2e;
    width: 42px;
    height: 42px;
    font-size: 24px;
    box-shadow: 0 5px 19px #171c2e22;
    z-index: 1;
  }

  @media (max-width:610px) {
    .trending-dialog__body {
      grid-template-columns: 1fr;
    }

    .trending-dialog__image {
      min-height: 0;
      aspect-ratio: 1.3/1;
    }

    .trending-dialog__info {
      padding: 24px;
    }

    .trending-dialog__image img {
      height: 210px;
    }
  }

  .special-deals {
    padding-top: 20px;
  }

  .special-deals__head {
    max-width: 760px;
    margin-bottom: 34px;
  }

  .special-deals__kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 15px;
    border-radius: 999px;
    background: #efedff;
    color: #5e56d8;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
  }

  .special-deals__head h2 {
    margin: 18px 0 12px;
    font-size: clamp(2rem,4vw,3.35rem);
    line-height: .98;
    color: #171c2e;
    font-weight: 800;
  }

  .special-deals__head h2 em {
    font-style: normal;
    color: #655ceb;
  }

  .special-deals__head p {
    max-width: 690px;
    margin: 0;
    color: #6c738d;
    font-size: 1.03rem;
    line-height: 1.75;
  }

  .special-deals__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }

  .special-deal-card {
    position: relative;
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    align-items: center;
    min-height: 370px;
    border-radius: 32px;
    overflow: hidden;
    padding: 40px 36px;
    isolation: isolate;
    box-shadow: 0 26px 65px rgba(23,28,46,.08);
  }

  .special-deal-card__content {
    position: relative;
    z-index: 2;
    max-width: 340px;
  }

  .special-deal-card__eyebrow {
    display: inline-flex;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(101,92,235,.13);
    color: #5d55d7;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .special-deal-card h3 {
    margin: 20px 0 14px;
    font-size: clamp(1.75rem,2.8vw,2.45rem);
    line-height: 1.08;
    font-weight: 800;
    color: #171c2e;
  }

  .special-deal-card p {
    margin: 0 0 24px;
    color: #646c86;
    font-size: 1rem;
    line-height: 1.8;
  }

  .special-deal-card__button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 22px;
    border-radius: 999px;
    background: #171c2e;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    transition: transform .2s ease,box-shadow .2s ease,background .2s ease;
  }

  .special-deal-card__button:hover {
    color: #fff;
    background: #0f1423;
    transform: translateY(-2px);
    box-shadow: 0 18px 35px rgba(23,28,46,.18);
  }

  .special-deal-card__button--light {
    background: #fff;
    color: #171c2e;
  }

  .special-deal-card__button--light:hover {
    background: #f4f5fb;
    color: #171c2e;
  }

  .special-deal-card__visual {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    height: 100%;
  }

  .special-deal-card__visual img {
    width: 100%;
    max-width: 330px;
    height: 100%;
    max-height: 300px;
    object-fit: cover;
    border-radius: 26px;
    box-shadow: 0 18px 40px rgba(23,28,46,.08);
  }

  .special-deal-card--light {
    background: linear-gradient(135deg,#f8f8fc 0%,#f0efff 100%);
  }

  .special-deal-card--light::before {
    content: "";
    position: absolute;
    inset: auto -120px -140px auto;
    width: 310px;
    height: 310px;
    border-radius: 50%;
    background: radial-gradient(circle at center,rgba(101,92,235,.16),rgba(101,92,235,0) 70%);
  }

  .special-deal-card--dark {
    background: linear-gradient(135deg,#1b2034 0%,#15192a 100%);
  }

  .special-deal-card--dark h3,
  .special-deal-card--dark p {
    color: #fff;
  }

  .special-deal-card--dark p {
    color: rgba(255,255,255,.78);
  }

  .special-deal-card--dark .special-deal-card__eyebrow {
    background: rgba(255,255,255,.12);
    color: #d9d5ff;
  }

  .special-deal-card--dark::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,rgba(21,25,42,.92) 0%,rgba(21,25,42,.78) 38%,rgba(21,25,42,.22) 100%);
    z-index: 0;
  }

  .special-deal-card--dark .special-deal-card__visual img {
    border-radius: 0;
    max-width: 360px;
    max-height: none;
    height: 125%;
    object-position: center;
  }

  @media (max-width: 1100px) {
    .special-deals__grid {
      grid-template-columns: 1fr;
    }

    .special-deal-card {
      min-height: 340px;
    }
  }

  @media (max-width: 720px) {
    .special-deals__head {
      margin-bottom: 24px;
    }

    .special-deals__head p {
      font-size: .95rem;
      line-height: 1.7;
    }

    .special-deal-card {
      grid-template-columns: 1fr;
      padding: 26px 22px 22px;
      gap: 18px;
      min-height: unset;
      border-radius: 24px;
    }

    .special-deal-card__content {
      max-width: none;
    }

    .special-deal-card__visual {
      justify-content: center;
    }

    .special-deal-card__visual img {
      max-width: 100%;
      height: 230px;
    }

    .special-deal-card--dark .special-deal-card__visual img {
      height: 240px;
    }

    .special-deal-card h3 {
      font-size: 1.75rem;
      margin: 16px 0 10px;
    }

    .special-deal-card p {
      font-size: .94rem;
      line-height: 1.7;
      margin-bottom: 18px;
    }
  }

  .special-deals {
    padding-top: 8px;
  }

  .special-deals__head {
    max-width: 760px;
    margin-bottom: 22px;
  }

  .special-deals__kicker {
    padding: 7px 14px;
    border-radius: 999px;
    background: #efedff;
    color: #5f57da;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
  }

  .special-deals__head h2 {
    margin: 14px 0 10px;
    font-size: clamp(1.9rem,3vw,2.8rem);
    line-height: 1.05;
    color: #171c2e;
    font-weight: 800;
  }

  .special-deals__head h2 em {
    color: #655ceb;
    font-style: normal;
  }

  .special-deals__head p {
    max-width: 700px;
    margin: 0;
    color: #6b738c;
    font-size: .98rem;
    line-height: 1.7;
  }

  .special-deals__grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 24px;
  }

  .special-deal-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(240px,.95fr);
    align-items: stretch;
    min-height: 270px;
    padding: 0;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(23,28,46,.08);
  }

  .special-deal-card__content {
    padding: 34px 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: none;
    z-index: 2;
  }

  .special-deal-card__eyebrow {
    align-self: flex-start;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .special-deal-card h3 {
    margin: 16px 0 10px;
    font-size: clamp(1.6rem,2.25vw,2.2rem);
    line-height: 1.08;
    font-weight: 800;
    color: #171c2e;
    max-width: 320px;
  }

  .special-deal-card p {
    margin: 0 0 20px;
    color: #66708a;
    font-size: .98rem;
    line-height: 1.65;
    max-width: 340px;
  }

  .special-deal-card__button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 20px;
    border-radius: 999px;
    background: #171c2e;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    box-shadow: none;
    transform: none;
  }

  .special-deal-card__button:hover {
    color: #fff;
    background: #0f1423;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(23,28,46,.12);
  }

  .special-deal-card__button--light {
    background: #fff;
    color: #171c2e;
  }

  .special-deal-card__button--light:hover {
    background: #f4f5fb;
    color: #171c2e;
  }

  .special-deal-card__visual {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
    min-height: 100%;
  }

  .special-deal-card__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    box-shadow: none;
    border-radius: 0;
  }

  .special-deal-card--light {
    background: linear-gradient(135deg,#f7f7fb 0%,#f1efff 100%);
  }

  .special-deal-card--light .special-deal-card__eyebrow {
    background: rgba(101,92,235,.12);
    color: #5d55d7;
  }

  .special-deal-card--light .special-deal-card__visual {
    padding: 24px 0 0 26px;
    align-items: flex-end;
  }

  .special-deal-card--light .special-deal-card__visual::before {
    content: "";
    position: absolute;
    left: 36px;
    bottom: 28px;
    width: 210px;
    height: 210px;
    border-radius: 28px;
    background: rgba(255,255,255,.64);
    backdrop-filter: blur(2px);
  }

  .special-deal-card--light .special-deal-card__visual img {
    position: relative;
    width: 82%;
    height: auto;
    max-height: 235px;
    object-fit: contain;
    z-index: 1;
    filter: drop-shadow(0 18px 26px rgba(23,28,46,.1));
  }

  .special-deal-card--dark {
    background: #171c2e;
  }

  .special-deal-card--dark .special-deal-card__content {
    padding-left: 18px;
  }

  .special-deal-card--dark .special-deal-card__eyebrow {
    background: rgba(255,255,255,.12);
    color: #d9d5ff;
  }

  .special-deal-card--dark h3 {
    color: #fff;
    max-width: 340px;
  }

  .special-deal-card--dark p {
    color: rgba(255,255,255,.8);
  }

  .special-deal-card--dark::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,rgba(23,28,46,.94) 0%,rgba(23,28,46,.88) 42%,rgba(23,28,46,.2) 100%);
    z-index: 1;
  }

  .special-deal-card--dark .special-deal-card__visual img {
    object-position: center center;
  }

  @media (max-width:1100px) {
    .special-deals__grid {
      grid-template-columns: 1fr;
    }

    .special-deal-card {
      min-height: 250px;
    }
  }

  @media (max-width:720px) {
    .special-deals__head {
      margin-bottom: 20px;
    }

    .special-deals__head p {
      font-size: .93rem;
    }

    .special-deal-card {
      grid-template-columns: 1fr;
      min-height: auto;
    }

    .special-deal-card__content {
      padding: 26px 22px 12px;
    }

    .special-deal-card h3 {
      font-size: 1.55rem;
      max-width: none;
    }

    .special-deal-card p {
      max-width: none;
    }

    .special-deal-card__visual {
      min-height: 220px;
    }

    .special-deal-card--light .special-deal-card__visual {
      padding: 0 18px 18px;
    }

    .special-deal-card--light .special-deal-card__visual::before {
      left: 50%;
      transform: translateX(-50%);
      bottom: 18px;
      width: 180px;
      height: 180px;
    }

    .special-deal-card--light .special-deal-card__visual img {
      max-height: 200px;
    }

    .special-deal-card--dark .special-deal-card__content {
      padding-left: 22px;
    }
  }
}

/* ==================================================
   05. Best Sellers & Featured Products
================================================== */

@scope (
  html:is(
    [data-vyora-page="index.html"]
  )
) {
  .vy09-section {
    padding: 86px 0 95px;
    background: #fff;
  }

  .vy09-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 25px;
    margin-bottom: 38px;
  }

  .vy09-eyebrow {
    display: inline-flex;
    color: #6259e2;
    font-size: 11px;
    letter-spacing: .12em;
    font-weight: 800;
    text-transform: uppercase;
    background: #eeedff;
    border-radius: 50px;
    padding: 9px 14px;
  }

  .vy09-section-heading h2,
  .vy09-weekly h2,
  .vy09-mobile-copy h2 {
    font-size: clamp(32px,3.6vw,53px);
    font-weight: 800;
    line-height: 1.13;
    letter-spacing: -.045em;
    color: #171c2e;
    margin: 17px 0 8px;
  }

  .vy09-section-heading h2 em,
  .vy09-weekly h2 em,
  .vy09-mobile-copy h2 em {
    font-style: normal;
    color: #655ceb;
  }

  .vy09-section-heading p {
    font-size: 14px;
    color: #81869b;
    line-height: 1.7;
    margin: 0;
  }

  .vy09-inline-link {
    display: inline-flex;
    gap: 14px;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 800;
    color: #171c2e;
    border-bottom: 1px solid #655ceb;
    padding-bottom: 8px;
    margin-bottom: 8px;
  }

  .vy09-inline-link:hover {
    color: #655ceb;
  }

  .vy09-mini-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    column-gap: 40px;
    row-gap: 25px;
  }

  .vy09-mini-item {
    min-width: 0;
    display: grid;
    grid-template-columns: 116px minmax(0,1fr);
    gap: 19px;
    align-items: center;
    padding: 0 0 7px;
    border-bottom: 1px solid #f0f0f6;
  }

  .vy09-mini-img {
    display: grid;
    place-items: center;
    overflow: hidden;
    aspect-ratio: 1;
    border-radius: 13px;
    background: #f3f4f9;
  }

  .vy09-mini-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .25s ease;
  }

  .vy09-mini-img--artwork img {
    padding: 8px;
    object-fit: contain;
  }

  .vy09-mini-img:hover img {
    transform: scale(1.06);
  }

  .vy09-mini-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 5px;
  }

  .vy09-mini-type {
    text-transform: uppercase;
    letter-spacing: .09em;
    color: #8c92a3;
    font-size: 9px;
    font-weight: 800;
  }

  .vy09-mini-copy h3 {
    font-size: 15px;
    line-height: 1.35;
    margin: 0;
    font-weight: 800;
    color: #171c2e;
  }

  .vy09-mini-copy h3 a:hover {
    color: #655ceb;
  }

  .vy09-mini-copy strong {
    font-size: 14px;
    color: #655ceb;
    font-weight: 800;
  }

  .vy09-rating {
    letter-spacing: 2px;
    color: #b2aed0;
    font-size: 17px;
    line-height: 1;
    white-space: nowrap;
  }

  .vy09-weekly {
    background: linear-gradient(105deg,#f2f2ff 0%,#ece9ff 54%,#ddd8ff 100%);
    position: relative;
    overflow: hidden;
  }

  .vy09-weekly-glow {
    position: absolute;
    width: 550px;
    height: 550px;
    border-radius: 50%;
    background: #c7c0ff70;
    filter: blur(8px);
    left: -190px;
    bottom: -340px;
  }

  .vy09-weekly-layout {
    min-height: 460px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding-top: 55px;
    padding-bottom: 60px;
  }

  .vy09-weekly-copy {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
    max-width: 620px;
    width: 100%;
  }

  .vy09-weekly h2 {
    margin: 16px 0 11px;
  }

  .vy09-weekly p {
    font-size: 15px;
    color: #6f7392;
    margin: 0 0 26px;
    max-width: 460px;
    line-height: 1.7;
  }

  .vy09-countdown {
    display: grid;
    grid-template-columns: repeat(4,76px);
    gap: 10px;
    margin-bottom: 21px;
  }

  .vy09-time-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #fffdfd;
    border: 1px solid #ffffff;
    border-radius: 12px;
    box-shadow: 0 12px 24px #7063c715;
    overflow: hidden;
    min-width: 0;
  }

  .vy09-time-cell strong {
    font-size: 26px;
    font-weight: 800;
    line-height: 1;
    padding: 16px 0 13px;
    font-variant-numeric: tabular-nums;
    color: #655ceb;
  }

  .vy09-time-cell span {
    display: block;
    width: 100%;
    border-top: 1px solid #f0effa;
    padding: 9px 0;
    color: #717993;
    font-size: 9px;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: .09em;
  }

  .vy09-cta {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    border-radius: 999px;
    padding: 14px 22px;
    background: #171c2e;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    transition: transform .2s,background .2s;
  }

  .vy09-cta:hover {
    transform: translateY(-2px);
    background: #655ceb;
    color: #fff;
  }

  .vy09-deal-footnote {
    font-size: 10px;
    color: #8489a0;
    margin-top: 12px;
  }

  .vy09-weekly-shoe {
    position: absolute;
    left: -65px;
    bottom: 25px;
    width: 340px;
    height: auto;
    object-fit: contain;
    opacity: .78;
    transform: rotate(-8deg);
    z-index: 1;
    filter: drop-shadow(0 35px 35px #655ceb33);
    pointer-events: none;
  }

  .vy09-weekly-rings {
    position: absolute;
    right: -190px;
    top: -190px;
    width: 500px;
    height: 500px;
    border: 1px solid #b0a8f6a6;
    border-radius: 50%;
    box-shadow: 0 0 0 50px #c5bfff24,0 0 0 100px #c5bfff16;
    pointer-events: none;
  }

  .vy09-featured {
    background: #fafbff;
  }

  .vy09-feature-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 20px;
  }

  .vy09-feature-card {
    min-width: 0;
  }

  .vy09-feature-image {
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    background: #f0f1f8;
    aspect-ratio: 1/1.05;
  }

  .vy09-feature-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s;
  }

  .vy09-feature-image--artwork img {
    padding: 25px;
    object-fit: contain;
  }

  .vy09-feature-image:hover img {
    transform: scale(1.045);
  }

  .vy09-feature-tag {
    position: absolute;
    top: 12px;
    right: 12px;
    border-radius: 6px;
    padding: 8px 10px;
    background: #fffE;
    color: #5148ca;
    font-size: 9px;
    letter-spacing: .09em;
    font-weight: 800;
  }

  .vy09-feature-quick {
    position: absolute;
    bottom: 14px;
    right: 14px;
    left: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border-radius: 9px;
    padding: 12px 13px;
    opacity: 0;
    transform: translateY(9px);
    transition: opacity .2s,transform .2s;
    font-size: 11px;
    color: #171c2e;
    font-weight: 800;
  }

  .vy09-feature-image:hover .vy09-feature-quick,
  .vy09-feature-image:focus-visible .vy09-feature-quick {
    opacity: 1;
    transform: none;
  }

  .vy09-feature-meta {
    padding: 16px 2px 3px;
    display: flex;
    flex-direction: column;
    gap: 5px;
  }

  .vy09-feature-meta>span {
    font-size: 9px;
    font-weight: 800;
    color: #655ceb;
    letter-spacing: .13em;
    text-transform: uppercase;
  }

  .vy09-feature-meta h3 {
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
    margin: 3px 0 1px;
    color: #171c2e;
  }

  .vy09-feature-meta h3 a:hover {
    color: #655ceb;
  }

  .vy09-feature-meta strong {
    font-size: 14px;
    color: #171c2e;
  }

  .vy09-mobile-promo {
    position: relative;
    background: linear-gradient(105deg,#f3f2ff,#f8f8ff);
    overflow: hidden;
  }

  .vy09-mobile-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    min-height: 380px;
    gap: 25px;
  }

  .vy09-mobile-copy {
    padding: 55px 0;
  }

  .vy09-mobile-copy h2 {
    margin: 14px 0 14px;
  }

  .vy09-mobile-copy p {
    color: #777e96;
    max-width: 455px;
    line-height: 1.85;
    font-size: 14px;
    margin: 0 0 24px;
  }

  .vy09-mobile-note {
    display: block;
    margin-top: 15px;
    font-size: 11px;
    color: #858bad;
  }

  .vy09-phones {
    height: 375px;
    position: relative;
    width: 100%;
    max-width: 440px;
    margin-right: auto;
    overflow: hidden;
  }

  .vy09-phone {
    position: absolute;
    width: 186px;
    height: 348px;
    padding: 8px;
    border: 5px solid #252a3e;
    border-radius: 28px;
    background: #252a3e;
    box-shadow: 0 18px 40px #171c2e33;
  }

  .vy09-phone--back {
    right: 35px;
    top: 50px;
    transform: rotate(-12deg) scale(.94);
    z-index: 1;
  }

  .vy09-phone--front {
    right: 190px;
    top: 15px;
    transform: rotate(10deg);
    z-index: 2;
  }

  .vy09-phone-top {
    position: absolute;
    background: #252a3e;
    width: 56px;
    height: 13px;
    top: 3px;
    right: 50%;
    transform: translateX(50%);
    z-index: 2;
    border-radius: 0 0 12px 12px;
  }

  .vy09-phone-screen {
    height: 100%;
    border-radius: 18px;
    background: #fff;
    overflow: hidden;
    padding: 21px 10px 9px;
    position: relative;
  }

  .vy09-phone-brand {
    font-size: 16px;
    font-weight: 900;
    letter-spacing: .04em;
    color: #171c2e;
    margin-bottom: 12px;
  }

  .vy09-phone-brand span {
    color: #655ceb;
  }

  .vy09-phone-caption {
    color: #655ceb;
    font-weight: 800;
    font-size: 8px;
    letter-spacing: .16em;
    display: block;
    margin-bottom: 9px;
  }

  .vy09-phone-image {
    height: 187px;
    background: #f7f7fa;
    overflow: hidden;
    border-radius: 9px;
    margin-bottom: 9px;
  }

  .vy09-phone-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .vy09-phone-screen>strong {
    display: block;
    font-size: 12px;
    color: #171c2e;
  }

  .vy09-phone-screen>span:not(.vy09-phone-caption) {
    display: block;
    font-size: 9px;
    color: #655ceb;
    margin-top: 6px;
  }

  .vy09-phone-nav {
    position: absolute;
    bottom: 4px;
    right: 0;
    left: 0;
    border-top: 1px solid #edf0f6;
    padding: 8px;
    color: #7b8197;
    text-align: center;
    font-size: 12px;
    background: #fff;
  }

  .vy09-phone-product {
    display: grid;
    grid-template-columns: 52px 1fr;
    gap: 9px;
    align-items: center;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
    padding-bottom: 9px;
  }

  .vy09-phone-product img {
    width: 52px;
    height: 58px;
    object-fit: cover;
    border-radius: 6px;
    background: #f2f2f7;
  }

  .vy09-phone-product>div {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

  .vy09-phone-product strong {
    font-size: 9px;
    color: #171c2e;
    line-height: 1.2;
  }

  .vy09-phone-product span {
    font-size: 7px;
    color: #8b91a3;
  }

  .vy09-phone-product b {
    font-size: 9px;
    color: #655ceb;
  }

  .vy09-services {
    padding: 34px 0;
    border-bottom: 1px solid #eff0f7;
    background: white;
  }

  .vy09-services-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 23px;
  }

  .vy09-services article {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
  }

  .vy09-service-icon {
    flex: none;
    display: grid;
    place-items: center;
    background: #f0eeff;
    border-radius: 12px;
    color: #655ceb;
    width: 46px;
    height: 46px;
  }

  .vy09-service-icon svg {
    width: 27px;
    height: 27px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .vy09-services h3 {
    font-size: 13px;
    line-height: 1.4;
    color: #171c2e;
    font-weight: 800;
    margin: 0 0 3px;
  }

  .vy09-services p {
    color: #8990a1;
    font-size: 10px;
    line-height: 1.45;
    margin: 0;
  }

  @media (max-width:1100px) {
    .vy09-mini-grid {
      column-gap: 16px;
    }

    .vy09-mini-item {
      grid-template-columns: 95px minmax(0,1fr);
      gap: 12px;
    }

    .vy09-weekly-shoe {
      left: -75px;
      width: 275px;
    }

    .vy09-feature-grid {
      gap: 14px;
    }

    .vy09-mobile-layout {
      gap: 0;
    }
  }

  @media (max-width:900px) {
    .vy09-mini-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
      column-gap: 28px;
    }

    .vy09-weekly-shoe {
      opacity: .3;
      left: -120px;
    }

    .vy09-services-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
      row-gap: 20px;
    }

    .vy09-mobile-layout {
      grid-template-columns: 1fr 1fr;
    }

    .vy09-phone--back {
      right: 0;
    }

    .vy09-phone--front {
      right: 120px;
    }
  }

  @media (max-width:650px) {
    .vy09-section {
      padding: 60px 0 65px;
    }

    .vy09-section-heading {
      display: block;
      margin-bottom: 26px;
    }

    .vy09-section-heading h2,
    .vy09-weekly h2,
    .vy09-mobile-copy h2 {
      font-size: clamp(31px,9vw,42px);
    }

    .vy09-inline-link {
      margin-top: 15px;
    }

    .vy09-mini-grid {
      grid-template-columns: 1fr;
      gap: 14px;
    }

    .vy09-mini-item {
      grid-template-columns: 88px 1fr;
      gap: 16px;
      padding-bottom: 14px;
    }

    .vy09-mini-copy h3 {
      font-size: 14px;
    }

    .vy09-mini-copy strong {
      font-size: 13px;
    }

    .vy09-weekly-layout {
      min-height: 430px;
      padding-block: 48px;
    }

    .vy09-weekly p {
      font-size: 13px;
    }

    .vy09-weekly-shoe {
      width: 265px;
      opacity: .12;
      left: -90px;
      bottom: 25px;
    }

    .vy09-countdown {
      grid-template-columns: repeat(4,minmax(0,1fr));
      gap: 7px;
      width: 100%;
      max-width: 310px;
    }

    .vy09-time-cell strong {
      font-size: 22px;
      padding-block: 13px 10px;
    }

    .vy09-time-cell span {
      font-size: 8px;
      padding-block: 7px;
    }

    .vy09-feature-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 16px 11px;
    }

    .vy09-feature-image {
      border-radius: 11px;
    }

    .vy09-feature-meta h3 {
      font-size: 12px;
    }

    .vy09-feature-meta strong {
      font-size: 12px;
    }

    .vy09-feature-tag {
      font-size: 7px;
      padding: 6px;
    }

    .vy09-feature-quick {
      display: none;
    }

    .vy09-mobile-layout {
      display: flex;
      flex-direction: column;
      align-items: stretch;
    }

    .vy09-mobile-copy {
      padding: 55px 0 5px;
    }

    .vy09-phones {
      margin: 0 auto;
      height: 310px;
      max-width: 340px;
    }

    .vy09-phone--back {
      right: 15px;
      top: 32px;
      transform: rotate(-10deg) scale(.78);
    }

    .vy09-phone--front {
      right: 145px;
      top: 8px;
      transform: rotate(9deg) scale(.8);
      transform-origin: top right;
    }

    .vy09-services-grid {
      gap: 19px 12px;
    }

    .vy09-services article {
      gap: 9px;
    }

    .vy09-services h3 {
      font-size: 11px;
    }

    .vy09-services p {
      font-size: 9px;
    }

    .vy09-service-icon {
      width: 38px;
      height: 38px;
      border-radius: 9px;
    }

    .vy09-service-icon svg {
      width: 22px;
      height: 22px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .vy09-mini-img img,
    .vy09-feature-image img,
    .vy09-feature-quick,
    .vy09-cta {
      transition: none!important;
    }
  }
}

/* ==================================================
   06. Closing Banner & Footer
================================================== */

@scope (
  html:is(
    [data-vyora-page="about.html"],
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"],
    [data-vyora-style-group="g04"],
    [data-vyora-style-group="g05"],
    [data-vyora-page="category.html"],
    [data-vyora-page="confirmation.html"],
    [data-vyora-page="contact.html"],
    [data-vyora-page="faq.html"],
    [data-vyora-page="index.html"],
    [data-vyora-style-group="g12"],
    [data-vyora-page="single-product.html"],
    [data-vyora-page="testimonial.html"]
  )
) {
  .closing-cta {
    background: #ffffff;
    color: #171c2e;
    overflow: visible;
    padding: 76px 0 58px;
  }

  .closing-cta .closing-cta__inner {
    position: relative;
    min-height: 424px;
    padding: 62px 72px;
    display: grid;
    grid-template-columns: minmax(0,1.1fr) minmax(340px,.9fr);
    align-items: center;
    gap: 22px;
    background: linear-gradient(115deg,#f4f4fc 0%,#f1efff 55%,#eceafd 100%);
    border: 1px solid #eeecfa;
    border-radius: 34px;
    overflow: hidden;
    box-shadow: 0 22px 70px rgba(23,28,46,.055);
  }

  .closing-cta__inner::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .35;
    background: radial-gradient(ellipse at 78% 25%,#fff 0%,transparent 45%);
  }

  .closing-cta__copy {
    z-index: 2;
    position: relative;
    max-width: 620px;
  }

  .closing-cta__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #5e56c9;
    font-size: 11px;
    letter-spacing: .18em;
    font-weight: 800;
  }

  .closing-cta__spark {
    font-size: 20px;
    line-height: 1;
    color: #655ceb;
  }

  .closing-cta h2 {
    margin: 16px 0 16px;
    font-size: clamp(36px,3.55vw,57px);
    line-height: 1.11;
    font-weight: 800;
    letter-spacing: -.052em;
    color: #171c2e;
  }

  .closing-cta h2 em {
    font-style: normal;
    color: #655ceb;
  }

  .closing-cta__copy>p {
    max-width: 490px;
    margin: 0;
    color: #717a97;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.85;
  }

  .closing-cta__actions {
    display: flex;
    align-items: center;
    gap: 19px;
    flex-wrap: wrap;
    margin-top: 26px;
  }

  .closing-cta__primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 16px 23px;
    border-radius: 13px;
    background: #171c2e;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    transition: background .22s,transform .22s,box-shadow .22s;
  }

  .closing-cta__primary:hover {
    color: #fff;
    background: #655ceb;
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(101,92,235,.2);
  }

  .closing-cta__secondary {
    display: inline-flex;
    gap: 11px;
    align-items: center;
    color: #171c2e;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 1px solid #aaa5df;
    padding: 11px 0;
    transition: color .22s;
  }

  .closing-cta__secondary:hover {
    color: #655ceb;
  }

  .closing-cta__footnote {
    margin-top: 32px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #9799b2;
    font-size: 10px;
    letter-spacing: .16em;
    font-weight: 800;
  }

  .closing-cta__line {
    width: 27px;
    height: 1px;
    background: #a3a0c9;
  }

  .closing-cta__showcase {
    position: relative;
    height: 330px;
    width: 100%;
    isolation: isolate;
    z-index: 1;
  }

  .closing-cta__halo {
    position: absolute;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    background: #e5e2fc;
    left: 2%;
    top: -8px;
    opacity: .78;
    box-shadow: inset 0 0 0 1px #ffffffa6;
  }

  .closing-cta__photo {
    position: absolute;
    background: #fff;
    border: 6px solid #fff;
    overflow: hidden;
    border-radius: 21px;
    box-shadow: 0 22px 50px rgba(31,31,70,.15);
  }

  .closing-cta__photo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
  }

  .closing-cta__photo--one {
    width: 222px;
    height: 280px;
    top: 5px;
    left: 19%;
    transform: rotate(6deg);
  }

  .closing-cta__photo--two {
    width: 175px;
    height: 200px;
    right: 3%;
    bottom: 0;
    transform: rotate(-10deg);
  }

  .closing-cta__floating {
    position: absolute;
    left: -12px;
    bottom: 17px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    padding: 13px 17px;
    border: 1px solid #f1f0fc;
    border-radius: 14px;
    box-shadow: 0 16px 38px rgba(31,31,70,.12);
    color: #8a8ba6;
    font-size: 10px;
    line-height: 1.65;
    font-weight: 700;
    letter-spacing: .01em;
    transform: rotate(-3deg);
  }

  .closing-cta__floating strong {
    font-size: 15px;
    color: #171c2e;
  }

  .closing-cta__floating-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    background: #efedff;
    color: #655ceb;
    border-radius: 10px;
    font-size: 23px;
  }

  .site-footer {
    background: #151a29;
    color: #b5bdd4;
    overflow: hidden;
  }

  .site-footer .footer-main {
    display: grid;
    grid-template-columns: 2.15fr repeat(3,minmax(135px,1fr));
    gap: 58px;
    padding: 68px 0 66px;
  }

  .site-footer .brand--footer {
    display: inline-flex;
    align-items: center;
    margin: 0 0 19px;
    text-decoration: none;
    color: #fff;
  }

  .site-footer .brand--footer .brand-word {
    color: #fff;
  }

  .site-footer .footer-brand-col p {
    font-size: 13px;
    line-height: 1.9;
    color: #9ba5bb;
    font-weight: 500;
    margin: 0 0 22px;
  }

  .footer-brand-col__badge {
    color: #aaa6f5;
    letter-spacing: .12em;
    font-size: 10px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    gap: 9px;
  }

  .footer-brand-col__badge span {
    font-size: 17px;
  }

  .site-footer .footer-links {
    display: flex;
    flex-direction: column;
    gap: 13px;
    align-items: flex-start;
  }

  .site-footer .footer-links h3 {
    margin: 0 0 9px;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .01em;
  }

  .site-footer .footer-links a {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    font-size: 12.5px;
    line-height: 1.4;
    font-weight: 500;
    color: #a6afc4;
    text-decoration: none;
    transition: color .2s,transform .2s;
  }

  .site-footer .footer-links a:hover {
    color: #fff;
    transform: translateX(-2px);
  }

  .site-footer .footer-links a span {
    color: #aba4fa;
  }

  .site-footer .footer-bottom {
    padding: 24px 0 28px;
    border-top: 1px solid rgba(255,255,255,.09);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    color: #909bb3;
    font-size: 11px;
    font-weight: 500;
  }

  .site-footer .footer-bottom a {
    color: #b9b4ff;
    text-decoration: none;
  }

  .site-footer .footer-bottom a:hover {
    color: #fff;
  }

  .site-footer .footer-back {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    white-space: nowrap;
  }

  .site-footer .footer-back span {
    width: 31px;
    height: 31px;
    border: 1px solid #424662;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 16px;
    transition: background .2s;
  }

  .site-footer .footer-back:hover span {
    background: #655ceb;
    border-color: #655ceb;
  }

  @media (max-width:1199px) {
    .closing-cta .closing-cta__inner {
      padding: 48px 46px;
      grid-template-columns: minmax(0,1fr) minmax(300px,.8fr);
    }

    .closing-cta__photo--one {
      left: 7%;
    }

    .closing-cta__photo--two {
      right: 0;
    }

    .site-footer .footer-main {
      gap: 30px;
    }
  }

  @media (max-width:900px) {
    .closing-cta {
      padding: 52px 0 42px;
    }

    .closing-cta .closing-cta__inner {
      padding: 42px;
      grid-template-columns: minmax(0,1fr) 270px;
      min-height: 390px;
      gap: 5px;
    }

    .closing-cta__showcase {
      height: 260px;
    }

    .closing-cta__halo {
      width: 245px;
      height: 245px;
      top: 5px;
      left: 0;
    }

    .closing-cta__photo--one {
      width: 163px;
      height: 216px;
      left: 0;
    }

    .closing-cta__photo--two {
      width: 136px;
      height: 162px;
      right: 0;
    }

    .closing-cta__floating {
      left: -20px;
      bottom: -4px;
    }

    .site-footer .footer-main {
      grid-template-columns: 1.5fr repeat(2,minmax(0,1fr));
      gap: 32px;
    }

    .site-footer .footer-links:last-child {
      grid-column: 2 / span 2;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 13px 25px;
      align-items: center;
    }

    .site-footer .footer-links:last-child h3 {
      width: 100%;
      margin: 0;
    }
  }

  @media (max-width:690px) {
    .closing-cta {
      padding: 36px 0 32px;
    }

    .closing-cta .closing-cta__inner {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 30px;
      padding: 35px 27px 20px;
      min-height: 0;
      border-radius: 26px;
    }

    .closing-cta h2 {
      font-size: clamp(34px,8vw,46px);
      line-height: 1.12;
      margin: 12px 0;
    }

    .closing-cta__copy>p {
      font-size: 13px;
      line-height: 1.75;
    }

    .closing-cta__actions {
      margin-top: 21px;
      gap: 18px;
    }

    .closing-cta__primary {
      padding: 14px 19px;
    }

    .closing-cta__secondary {
      font-size: 12px;
    }

    .closing-cta__footnote {
      margin-top: 22px;
      font-size: 9px;
    }

    .closing-cta__showcase {
      width: 100%;
      height: 250px;
    }

    .closing-cta__halo {
      width: 230px;
      height: 230px;
      left: 13%;
      top: 0;
    }

    .closing-cta__photo--one {
      width: 174px;
      height: 225px;
      left: 13%;
    }

    .closing-cta__photo--two {
      width: 142px;
      height: 155px;
      right: 5%;
    }

    .closing-cta__floating {
      left: -9px;
      bottom: 8px;
      transform: rotate(-2deg);
    }

    .site-footer .footer-main {
      padding: 47px 0 42px;
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 34px 19px;
    }

    .site-footer .footer-brand-col {
      grid-column: 1 / -1;
    }

    .site-footer .footer-brand-col p {
      max-width: 310px;
    }

    .site-footer .footer-links:last-child {
      grid-column: auto;
      flex-direction: column;
      align-items: flex-start;
      gap: 13px;
    }

    .site-footer .footer-links:last-child h3 {
      margin: 0 0 9px;
    }

    .site-footer .footer-bottom {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: 21px 0 27px;
      gap: 12px;
    }
  }

  @media (max-width:390px) {
    .closing-cta .closing-cta__inner {
      padding: 29px 20px 15px;
    }

    .closing-cta__actions {
      gap: 11px;
    }

    .closing-cta__showcase {
      height: 225px;
    }

    .closing-cta__photo--one {
      height: 200px;
      width: 150px;
      left: 8%;
    }

    .closing-cta__photo--two {
      height: 136px;
      width: 118px;
    }

    .closing-cta__floating {
      left: 0;
      bottom: 0;
    }

    .site-footer .footer-links a {
      font-size: 12px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .closing-cta__primary,
    .closing-cta__secondary,
    .site-footer .footer-links a,
    .site-footer .footer-back span {
      transition: none;
    }
  }
}

/* ==================================================
   07. Editorial Content & Contact
================================================== */

@scope (
  html:is(
    [data-vyora-page="about.html"],
    [data-vyora-style-group="g04"],
    [data-vyora-page="contact.html"],
    [data-vyora-page="faq.html"],
    [data-vyora-page="testimonial.html"]
  )
) {
  .vyora-editorial {
    --v-ink: #171c2e;
    --v-indigo: #655ceb;
    --v-muted: #566078;
    --v-soft: #f6f7fb;
    color: var(--v-ink);
    font-family: "Manrope",sans-serif;
    font-size: 15px;
    line-height: 1.6;
    background: #fff;
  }

  .vyora-editorial .site-header {
    position: relative;
    top: auto;
    backdrop-filter: none;
  }

  .vyora-editorial main {
    overflow: hidden;
  }

  .vyora-editorial h1,
  .vyora-editorial h2,
  .vyora-editorial h3 {
    letter-spacing: -.048em;
    line-height: 1.17;
  }

  .vyora-editorial em {
    font-style: normal;
    color: var(--v-indigo);
  }

  .vyora-editorial a {
    text-decoration: none;
  }

  .vyora-editorial button,
  .vyora-editorial input,
  .vyora-editorial textarea,
  .vyora-editorial select {
    font-family: inherit;
  }

  .vyora-editorial button:focus-visible,
  .vyora-editorial a:focus-visible,
  .vyora-editorial input:focus-visible,
  .vyora-editorial textarea:focus-visible,
  .vyora-editorial select:focus-visible {
    outline: 3px solid #aaa2ff;
    outline-offset: 3px;
  }

  .vyora-editorial [hidden] {
    display: none!important;
  }

  .vyora-editorial .container-wide {
    width: min(100% - 76px,1280px);
  }

  .journal-breadcrumb {
    padding-top: 28px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: #8990a5;
    font-size: 12px;
    font-weight: 700;
  }

  .journal-breadcrumb strong {
    color: #171c2e;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .journal-breadcrumb a:hover {
    color: #655ceb;
  }

  .eyelabel {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #655ceb;
    font-size: 10px;
    letter-spacing: .19em;
    font-weight: 800;
    text-transform: uppercase;
  }

  .eyelabel span {
    font-size: 18px;
  }

  .journal-intro {
    padding: 74px 0 54px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 26px;
  }

  .journal-intro h1 {
    font-size: clamp(44px,6vw,86px);
    font-weight: 800;
    margin: 14px 0 16px;
    letter-spacing: -.07em;
  }

  .journal-intro p {
    font-size: 16px;
    line-height: 1.85;
    color: #59627a;
    max-width: 680px;
    margin: 0;
  }

  .journal-intro__stamp {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .13em;
    line-height: 1.65;
    text-align: center;
    color: #655ceb;
    width: 148px;
    height: 148px;
    border: 1px solid #d9d5ff;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: rotate(8deg);
    flex: 0 0 auto;
    position: relative;
  }

  .journal-intro__stamp span {
    position: absolute;
    bottom: 20px;
    left: 23px;
    font-size: 20px;
  }

  .journal-feature {
    background: linear-gradient(110deg,#f5f4fe,#ecebff);
    border: 1px solid #ebe9fa;
    border-radius: 30px;
    overflow: hidden;
    display: grid;
    grid-template-columns: .99fr 1.01fr;
    min-height: 446px;
  }

  .journal-feature__photo {
    position: relative;
    min-height: 390px;
    background: #d9daea;
    overflow: hidden;
  }

  .journal-feature__photo img {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset: 0;
    object-fit: cover;
    object-position: center 30%;
  }

  .journal-feature__content {
    padding: 54px clamp(28px,4.5vw,72px);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
  }

  .journal-feature__pill {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    border-radius: 40px;
    background: white;
    color: #6056d7;
    letter-spacing: .12em;
    padding: 9px 15px;
    font-size: 10px;
    font-weight: 800;
    margin-bottom: 28px;
  }

  .journal-feature__pill span {
    font-size: 14px;
  }

  .journal-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #7b829b;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .12em;
    font-weight: 800;
  }

  .journal-meta>span:first-child {
    color: #655ceb;
  }

  .journal-meta i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #c5c8d7;
  }

  .journal-feature h2 {
    font-size: clamp(32px,3.7vw,56px);
    font-weight: 800;
    letter-spacing: -.06em;
    line-height: 1.1;
    margin: 19px 0;
  }

  .journal-feature__content>p {
    font-size: 15px;
    line-height: 1.8;
    color: #59627a;
    max-width: 400px;
    margin: 0 0 26px;
  }

  .journal-primary {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    background: #171c2e;
    color: #fff;
    padding: 15px 23px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 800;
    transition: .2s;
  }

  .journal-primary:hover {
    color: #fff;
    background: #5148cf;
    transform: translateY(-2px);
  }

  .journal-list {
    padding: 105px 0 92px;
  }

  .journal-section-top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 34px;
  }

  .journal-section-top h2 {
    font-size: clamp(32px,4vw,55px);
    font-weight: 800;
    margin: 14px 0 0;
  }

  .journal-section-top>p {
    color: #626b83;
    font-size: 13px;
    margin: 0 0 5px;
  }

  .journal-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-bottom: 14px;
    padding-bottom: 17px;
    border-bottom: 1px solid #ececf5;
  }

  .journal-tabs {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
  }

  .journal-tabs button {
    background: none;
    border: 1px solid transparent;
    border-radius: 30px;
    color: #646c83;
    font-weight: 800;
    font-size: 12px;
    padding: 10px 17px;
    transition: .2s;
  }

  .journal-tabs button:hover {
    background: #f6f5ff;
    color: #655ceb;
  }

  .journal-tabs button.is-active {
    background: #eeecff;
    border-color: #dcd7ff;
    color: #5349d1;
  }

  .journal-search {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f7f8fc;
    border: 1px solid #e8eaf2;
    border-radius: 14px;
    padding: 10px 14px;
    min-width: 205px;
    max-width: 280px;
  }

  .journal-search span:first-child {
    color: #655ceb;
    font-size: 22px;
    line-height: 1;
  }

  .journal-search input {
    outline: 0;
    border: 0;
    width: 100%;
    background: transparent;
    color: #171c2e;
    font-size: 12px;
    min-width: 0;
  }

  .journal-result-count {
    font-size: 11px;
    font-weight: 700;
    color: #8a91a6;
    letter-spacing: .03em;
    margin: 0 0 22px;
  }

  .journal-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 40px 24px;
  }

  .journal-card {
    min-width: 0;
  }

  .journal-card__image {
    display: block;
    position: relative;
    overflow: hidden;
    aspect-ratio: 1.27/1;
    border-radius: 21px;
    background: #f0eff9;
  }

  .journal-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s;
  }

  .journal-card__image:hover img {
    transform: scale(1.055);
  }

  .journal-card:nth-child(4) .journal-card__image img {
    object-fit: contain;
    padding: 24px;
    background: linear-gradient(135deg,#e9e8fb,#e2e4f2);
  }

  .journal-card:nth-child(3) .journal-card__image img {
    object-position: center 35%;
  }

  .journal-card__body {
    padding: 20px 5px 0;
  }

  .journal-card h3 {
    font-size: 22px;
    letter-spacing: -.047em;
    font-weight: 800;
    margin: 12px 0;
    line-height: 1.32;
  }

  .journal-card h3 a {
    color: #171c2e;
  }

  .journal-card h3 a:hover {
    color: #655ceb;
  }

  .journal-card__body>p {
    font-size: 13px;
    color: #59627a;
    line-height: 1.8;
    margin: 0 0 15px;
  }

  .journal-read {
    font-size: 12px;
    font-weight: 800;
    color: #5b50d8;
    border-bottom: 1px solid #b6b1ff;
    padding-bottom: 4px;
  }

  .journal-read span {
    padding-right: 8px;
  }

  .journal-no-results {
    padding: 55px;
    text-align: center;
    border-radius: 20px;
    background: #f7f7fc;
  }

  .journal-no-results strong {
    font-size: 24px;
  }

  .journal-no-results p {
    color: #626b83;
  }

  .journal-no-results button {
    border: 0;
    border-radius: 9px;
    padding: 12px 18px;
    background: #655ceb;
    color: #fff;
  }

  .journal-bridge {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 43px 54px;
    background: #171c2e;
    color: white;
    border-radius: 26px;
    margin-bottom: 90px;
    gap: 25px;
  }

  .journal-bridge>span {
    color: #b9b5ff;
    font-size: 10px;
    letter-spacing: .2em;
    font-weight: 800;
  }

  .journal-bridge>div {
    display: flex;
    align-items: center;
    gap: 54px;
  }

  .journal-bridge h2 {
    font-size: clamp(22px,3vw,39px);
    font-weight: 800;
    margin: 0;
  }

  .journal-bridge a {
    font-size: 12px;
    font-weight: 800;
    background: white;
    padding: 13px 18px;
    border-radius: 9px;
    color: #171c2e;
    white-space: nowrap;
  }

  .article-hero {
    margin-top: 49px;
    background: linear-gradient(110deg,#f9f9fd,#f0efff);
    border-radius: 26px;
    display: grid;
    grid-template-columns: 1fr .86fr;
    overflow: hidden;
    min-height: 530px;
  }

  .article-hero__copy {
    padding: 60px clamp(24px,4vw,70px);
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
  }

  .article-back {
    font-size: 12px;
    font-weight: 800;
    color: #655ceb;
    margin-bottom: 48px;
  }

  .article-hero h1 {
    font-size: clamp(34px,4.7vw,67px);
    line-height: 1.1;
    font-weight: 800;
    margin: 20px 0;
    max-width: 670px;
  }

  .article-hero__copy>p {
    font-size: 16px;
    color: #58627b;
    line-height: 1.85;
    max-width: 550px;
    margin: 0 0 32px;
  }

  .article-hero__image {
    position: relative;
    min-height: 470px;
    background: #deddf2;
  }

  .article-hero__image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
  }

  .article-author {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .article-author__mark {
    width: 44px;
    height: 44px;
    background: #171c2e;
    color: white;
    border-radius: 13px;
    display: grid;
    place-items: center;
    font-size: 22px;
    font-weight: 800;
  }

  .article-author__mark span {
    color: #938aff;
  }

  .article-author div {
    display: flex;
    flex-direction: column;
    line-height: 1.7;
  }

  .article-author strong {
    font-size: 12px;
  }

  .article-author div span {
    font-size: 11px;
    color: #68718b;
  }

  .article-content-layout {
    display: grid;
    grid-template-columns: 270px minmax(0,760px);
    gap: clamp(45px,7vw,125px);
    padding-top: 90px;
    padding-bottom: 100px;
  }

  .article-side {
    align-self: start;
    position: sticky;
    top: 35px;
  }

  .article-side nav {
    display: grid;
    margin-top: 22px;
    gap: 2px;
  }

  .article-side nav a {
    font-size: 12px;
    color: #626b83;
    display: flex;
    gap: 15px;
    align-items: flex-start;
    padding: 13px 3px;
    border-bottom: 1px solid #e9eaf3;
    line-height: 1.5;
  }

  .article-side nav a span {
    font-weight: 700;
    color: #171c2e;
  }

  .article-side nav a:hover,
  .article-side nav a:hover span {
    color: #655ceb;
  }

  .article-side__share {
    padding: 28px 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .article-side__share>span:first-child {
    font-size: 10px;
    font-weight: 800;
    color: #8d91a9;
    letter-spacing: .13em;
  }

  .article-side__share button {
    border: 0;
    background: #f0efff;
    color: #5148d3;
    font-size: 12px;
    font-weight: 800;
    border-radius: 9px;
    padding: 12px 16px;
  }

  .article-copy-status {
    font-size: 11px;
    color: #616881;
  }

  .article-body {
    font-size: 16px;
    line-height: 1.98;
    color: #535d75;
  }

  .article-body .article-lede {
    font-size: 19px;
    line-height: 1.8;
    color: #313a51;
    font-weight: 600;
    padding-bottom: 32px;
    border-bottom: 1px solid #edeef5;
    margin: 0 0 38px;
  }

  .article-body section {
    margin-bottom: 43px;
    scroll-margin-top: 30px;
  }

  .article-body h2 {
    font-size: clamp(25px,2.6vw,34px);
    font-weight: 800;
    color: #171c2e;
    margin: 0 0 15px;
  }

  .article-body p {
    margin: 0 0 22px;
  }

  .article-takeaway {
    background: #f2f1fe;
    border-right: 4px solid #655ceb;
    padding: 22px 28px;
    border-radius: 15px 0 0 15px;
    margin-top: 40px;
  }

  .article-takeaway span {
    font-size: 10px;
    letter-spacing: .16em;
    color: #655ceb;
    font-weight: 800;
  }

  .article-takeaway p {
    font-size: 18px;
    color: #252b41;
    font-weight: 750;
    margin: 10px 0 0;
  }

  .article-bottom {
    border-top: 1px solid #edeef4;
    padding: 60px 0 96px;
  }

  .article-bottom h2 {
    font-size: 37px;
    font-weight: 800;
    margin: 12px 0 28px;
  }

  .article-related {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 24px;
  }

  .article-related__card {
    background: #f8f8fd;
    padding: 13px;
    border-radius: 19px;
    display: flex;
    align-items: center;
    gap: 20px;
    color: #171c2e;
  }

  .article-related__card:hover {
    color: #655ceb;
  }

  .article-related__card img {
    height: 145px;
    width: 165px;
    object-fit: cover;
    border-radius: 12px;
    flex-shrink: 0;
    background: #eeedff;
  }

  .article-related__card>div {
    padding-left: 12px;
  }

  .article-related__card span {
    font-size: 10px;
    letter-spacing: .1em;
    color: #665ee1;
    font-weight: 800;
  }

  .article-related__card h3 {
    font-size: 19px;
    margin: 10px 0 13px;
    font-weight: 800;
  }

  .article-related__card b {
    font-size: 11px;
    color: #655ceb;
  }

  .contact-hero {
    margin-top: 45px;
    display: grid;
    grid-template-columns: 1.12fr .88fr;
    align-items: center;
    min-height: 455px;
    background: linear-gradient(105deg,#f8f9fe,#eeecff);
    border-radius: 29px;
    overflow: hidden;
  }

  .contact-hero__copy {
    padding: 55px clamp(28px,5.2vw,82px);
  }

  .contact-hero h1 {
    font-size: clamp(43px,5.7vw,82px);
    font-weight: 800;
    letter-spacing: -.075em;
    margin: 19px 0;
  }

  .contact-hero__copy>p {
    font-size: 16px;
    line-height: 1.85;
    max-width: 600px;
    color: #5a647c;
    margin: 0;
  }

  .contact-highlight {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 32px;
  }

  .contact-highlight>span {
    display: grid;
    place-items: center;
    min-width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #dedaff;
    color: #5e54df;
    font-size: 23px;
  }

  .contact-highlight>div {
    display: flex;
    flex-direction: column;
  }

  .contact-highlight strong {
    font-size: 13px;
    color: #171c2e;
  }

  .contact-highlight small {
    font-size: 11px;
    color: #727a93;
  }

  .contact-art {
    height: 440px;
    position: relative;
    display: grid;
    place-items: center;
  }

  .contact-art__orb {
    position: absolute;
    width: 410px;
    height: 410px;
    border-radius: 50%;
    background: linear-gradient(160deg,#dcd7ff,#f3f2ff);
    left: 2%;
    top: 25px;
  }

  .contact-art__card {
    position: relative;
    width: 320px;
    min-height: 275px;
    padding: 25px;
    background: white;
    border: 1px solid #e9e8f4;
    border-radius: 27px;
    box-shadow: 0 29px 80px rgba(70,64,130,.16);
    transform: rotate(-7deg);
    z-index: 1;
  }

  .contact-art__dots {
    display: flex;
    gap: 5px;
  }

  .contact-art__dots i {
    background: #d1cffa;
    width: 9px;
    height: 9px;
    border-radius: 50%;
  }

  .contact-art__dots i:first-child {
    background: #655ceb;
  }

  .contact-art__avatar {
    height: 76px;
    width: 76px;
    border-radius: 20px;
    margin: 30px 0 17px;
    background: #171c2e;
    display: grid;
    place-items: center;
    color: white;
    font-size: 40px;
    font-weight: 800;
    letter-spacing: -.1em;
  }

  .contact-art__avatar span {
    color: #938aff;
  }

  .contact-art__line {
    background: #e9e9f5;
    border-radius: 6px;
    height: 10px;
    margin: 11px 0;
  }

  .contact-art__line--a {
    width: 75%;
  }

  .contact-art__line--b {
    width: 55%;
  }

  .contact-art__reply {
    position: absolute;
    left: -30px;
    bottom: 28px;
    transform: rotate(6deg);
    font-size: 16px;
    font-weight: 800;
    padding: 14px 22px;
    background: #655ceb;
    color: #fff;
    border-radius: 14px;
    box-shadow: 0 12px 25px #655ceb46;
  }

  .contact-art__reply span {
    color: #dbd7ff;
    padding-right: 10px;
  }

  .contact-art__badge {
    position: absolute;
    top: 48px;
    left: 10px;
    background: #fff;
    color: #655ceb;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
    padding: 13px 15px;
    border-radius: 10px;
    transform: rotate(8deg);
    z-index: 2;
  }

  .contact-content {
    display: grid;
    grid-template-columns: minmax(0,1.42fr) minmax(270px,.75fr);
    gap: 30px;
    align-items: start;
    padding-top: 90px;
    padding-bottom: 85px;
  }

  .contact-form-panel {
    padding: 42px clamp(24px,4vw,55px);
    border: 1px solid #e9eaf3;
    border-radius: 24px;
    box-shadow: 0 17px 44px #171c2e08;
  }

  .contact-form-panel h2,
  .contact-faq h2 {
    font-size: clamp(30px,3.3vw,47px);
    font-weight: 800;
    margin: 12px 0 13px;
  }

  .contact-form-sub {
    font-size: 13px;
    line-height: 1.8;
    color: #5f6980;
    margin: 0 0 30px;
    max-width: 630px;
  }

  .contact-field-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
  }

  #vyora-contact-form label {
    font-size: 12px;
    font-weight: 800;
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin: 0 0 20px;
    color: #222a3e;
  }

  #vyora-contact-form label span {
    color: #655ceb;
  }

  #vyora-contact-form input,
  #vyora-contact-form select,
  #vyora-contact-form textarea {
    width: 100%;
    border: 1px solid #e2e5f0;
    background: #fbfbfe;
    border-radius: 11px;
    padding: 14px 15px;
    color: #1e2436;
    font-size: 13px;
    font-weight: 600;
    outline: 0;
    transition: border-color .2s,box-shadow .2s;
    resize: vertical;
  }

  #vyora-contact-form input:focus,
  #vyora-contact-form select:focus,
  #vyora-contact-form textarea:focus {
    border-color: #7b73f0;
    box-shadow: 0 0 0 3px #655ceb16;
    background: white;
  }

  #vyora-contact-form textarea {
    min-height: 150px;
  }

  .contact-form-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
  }

  .contact-form-bottom p {
    font-size: 11px;
    color: #767f95;
    margin: 0;
  }

  .contact-form-bottom button {
    background: #655ceb;
    border: 0;
    border-radius: 11px;
    padding: 15px 20px;
    color: white;
    font-weight: 800;
    font-size: 12px;
    white-space: nowrap;
  }

  .contact-form-bottom button:hover {
    background: #5148d2;
  }

  .contact-form-bottom button span {
    margin-right: 15px;
  }

  .contact-form-feedback {
    background: #fff4f4;
    color: #9c3038;
    padding: 14px;
    border-radius: 10px;
    font-size: 12px;
    margin-top: 14px;
  }

  .contact-side {
    padding: 37px;
    border-radius: 24px;
    background: #171c2e;
    color: white;
    position: relative;
    overflow: hidden;
    min-height: 560px;
  }

  .contact-side::after {
    content: "";
    width: 270px;
    height: 270px;
    border: 55px solid #655ceb2f;
    position: absolute;
    left: -150px;
    bottom: -130px;
    border-radius: 50%;
  }

  .contact-side__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #b7b1ff;
    font-weight: 800;
    font-size: 10px;
    letter-spacing: .15em;
  }

  .contact-side__top span:last-child {
    font-size: 19px;
  }

  .contact-side h3 {
    font-size: clamp(28px,3vw,41px);
    color: white;
    line-height: 1.18;
    font-weight: 800;
    margin: 35px 0 15px;
  }

  .contact-side p {
    font-size: 13px;
    line-height: 1.9;
    color: #b0b8cf;
  }

  .contact-side__line {
    height: 1px;
    background: #ffffff22;
    margin: 27px 0;
  }

  .contact-info-item {
    display: flex;
    gap: 14px;
    margin-bottom: 26px;
    position: relative;
    z-index: 1;
  }

  .contact-info-icon {
    height: 39px;
    width: 39px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #ffffff16;
    color: #d8d4ff;
    font-size: 21px;
  }

  .contact-info-item div {
    display: flex;
    flex-direction: column;
    gap: 7px;
  }

  .contact-info-item strong {
    font-size: 12px;
  }

  .contact-info-item small {
    font-size: 11px;
    line-height: 1.75;
    color: #b7bfd0;
  }

  .contact-info-item a {
    font-size: 11px;
    color: #b8b1ff;
    font-weight: 800;
  }

  .contact-side__bottom {
    border-top: 1px solid #ffffff26;
    padding-top: 25px;
    margin-top: 40px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .15em;
    color: #a7afca;
  }

  .contact-side__bottom span {
    color: #ccc6ff;
  }

  .contact-faq {
    display: grid;
    grid-template-columns: .65fr 1fr;
    gap: 65px;
    padding: 0 0 100px;
  }

  .contact-faq>div>p {
    font-size: 13px;
    color: #68718a;
    line-height: 1.7;
  }

  .contact-faq__items details {
    border-bottom: 1px solid #e8e9f2;
    padding: 4px 0;
  }

  .contact-faq__items summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    font-size: 15px;
    font-weight: 800;
    padding: 20px 0;
    cursor: pointer;
  }

  .contact-faq__items summary::-webkit-details-marker {
    display: none;
  }

  .contact-faq__items summary span {
    font-size: 21px;
    color: #655ceb;
  }

  .contact-faq__items details[open] summary span {
    transform: rotate(45deg);
  }

  .contact-faq__items details p {
    margin: 0 0 22px;
    font-size: 13px;
    color: #606a81;
    line-height: 1.8;
  }

  .contact-faq__items a {
    color: #655ceb;
    font-weight: 800;
  }

  .contact-preview-dialog {
    width: min(92vw,580px);
    max-width: 580px;
    border: 0;
    border-radius: 24px;
    padding: 32px;
    box-shadow: 0 30px 100px #171c2e3d;
    color: #171c2e;
  }

  .contact-preview-dialog::backdrop {
    background: #111625a6;
    backdrop-filter: blur(4px);
  }

  .contact-preview__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .contact-preview__top button {
    border: 0;
    background: #f1f0ff;
    border-radius: 50%;
    width: 34px;
    height: 34px;
    font-size: 22px;
  }

  .contact-preview-dialog h2 {
    font-size: 32px;
    font-weight: 800;
    margin: 15px 0;
  }

  .contact-preview-dialog>p {
    font-size: 13px;
    color: #5b657d;
  }

  .contact-preview-dialog textarea {
    width: 100%;
    margin: 15px 0;
    resize: vertical;
    border: 1px solid #e6e6f3;
    background: #f8f8fd;
    padding: 14px;
    font-size: 12px;
    border-radius: 13px;
    color: #171c2e;
    line-height: 1.8;
  }

  .contact-preview__actions {
    display: flex;
    gap: 12px;
  }

  .contact-preview__actions button {
    border: 0;
    border-radius: 10px;
    background: #655ceb;
    color: white;
    font-size: 12px;
    font-weight: 800;
    padding: 13px 17px;
  }

  .contact-preview__actions button+button {
    background: #f0efff;
    color: #171c2e;
  }

  #contact-copy-feedback {
    font-size: 12px;
    color: #5148cc;
    margin-top: 15px;
  }

  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
  }

  @media (max-width:1100px) {
    .journal-feature {
      min-height: 400px;
    }

    .journal-feature__content {
      padding: 35px;
    }

    .journal-grid {
      gap: 30px 18px;
    }

    .contact-content {
      grid-template-columns: minmax(0,1.3fr) minmax(250px,.8fr);
    }

    .contact-side {
      padding: 26px;
    }

    .article-content-layout {
      grid-template-columns: 205px minmax(0,1fr);
      gap: 45px;
    }
  }

  @media (max-width:820px) {
    .vyora-editorial .container-wide {
      width: min(100% - 40px,1280px);
    }

    .journal-intro {
      padding: 50px 0 40px;
    }

    .journal-intro__stamp {
      display: none;
    }

    .journal-feature {
      grid-template-columns: 1fr;
    }

    .journal-feature__photo {
      min-height: 350px;
    }

    .journal-feature__content {
      padding: 36px;
    }

    .journal-list {
      padding: 75px 0;
    }

    .journal-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .journal-controls {
      align-items: flex-start;
      flex-direction: column;
    }

    .journal-search {
      width: 100%;
      max-width: none;
    }

    .journal-bridge {
      margin-bottom: 70px;
      padding: 30px;
    }

    .article-hero {
      grid-template-columns: 1fr;
    }

    .article-hero__copy {
      padding: 43px;
    }

    .article-back {
      margin-bottom: 26px;
    }

    .article-hero__image {
      min-height: 360px;
    }

    .article-content-layout {
      grid-template-columns: 1fr;
      padding-top: 48px;
      padding-bottom: 55px;
    }

    .article-side {
      position: static;
    }

    .article-side nav {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    .article-side nav a {
      border: 0;
      border-radius: 7px;
      background: #f5f5fb;
      padding: 10px;
    }

    .article-side__share {
      padding-bottom: 0;
    }

    .contact-hero {
      grid-template-columns: 1fr;
    }

    .contact-hero__copy {
      padding: 44px;
    }

    .contact-art {
      height: 295px;
    }

    .contact-art__orb {
      left: 50%;
      transform: translateX(-50%);
      top: -50px;
      width: 340px;
      height: 340px;
    }

    .contact-art__card {
      transform: rotate(-4deg) scale(.8);
    }

    .contact-content {
      grid-template-columns: 1fr;
      padding-top: 65px;
    }

    .contact-side {
      min-height: auto;
    }

    .contact-faq {
      grid-template-columns: 1fr;
      gap: 15px;
    }
  }

  @media (max-width:540px) {
    .vyora-editorial .container-wide {
      width: min(100% - 30px,1280px);
    }

    .journal-breadcrumb {
      padding-top: 19px;
      font-size: 11px;
    }

    .journal-intro {
      padding: 36px 0 28px;
    }

    .journal-intro h1 {
      font-size: 44px;
      line-height: 1.12;
    }

    .journal-intro p,
    .article-hero__copy>p,
    .contact-hero__copy>p {
      font-size: 14px;
    }

    .journal-feature {
      border-radius: 20px;
    }

    .journal-feature__photo {
      min-height: 270px;
    }

    .journal-feature__content {
      padding: 26px;
    }

    .journal-feature h2 {
      font-size: 35px;
    }

    .journal-feature__pill {
      margin-bottom: 18px;
    }

    .journal-list {
      padding: 64px 0;
    }

    .journal-section-top {
      align-items: flex-start;
      flex-direction: column;
    }

    .journal-section-top h2 {
      font-size: 36px;
    }

    .journal-grid {
      grid-template-columns: 1fr;
      gap: 36px;
    }

    .journal-card__image {
      aspect-ratio: 1.45/1;
    }

    .journal-card h3 {
      font-size: 21px;
    }

    .journal-tabs {
      flex-wrap: nowrap;
      max-width: 100%;
      width: 100%;
      overflow-x: auto;
      scrollbar-width: none;
    }

    .journal-tabs::-webkit-scrollbar {
      display: none;
    }

    .journal-tabs button {
      white-space: nowrap;
      flex: none;
    }

    .journal-bridge {
      flex-direction: column;
      align-items: flex-start;
      margin-bottom: 45px;
      padding: 27px;
    }

    .journal-bridge>div {
      flex-direction: column;
      align-items: flex-start;
      gap: 22px;
    }

    .article-hero {
      margin-top: 28px;
      border-radius: 18px;
    }

    .article-hero__copy {
      padding: 28px 22px;
    }

    .article-hero h1 {
      font-size: 40px;
    }

    .article-hero__image {
      min-height: 280px;
    }

    .article-content-layout {
      gap: 32px;
    }

    .article-body .article-lede {
      font-size: 17px;
    }

    .article-body {
      font-size: 14px;
    }

    .article-related {
      grid-template-columns: 1fr;
    }

    .article-related__card img {
      width: 117px;
      height: 115px;
    }

    .article-related__card h3 {
      font-size: 16px;
    }

    .article-bottom {
      padding: 44px 0;
    }

    .article-bottom h2 {
      font-size: 30px;
    }

    .contact-hero {
      margin-top: 27px;
      border-radius: 20px;
    }

    .contact-hero__copy {
      padding: 31px 25px 0;
    }

    .contact-hero h1 {
      font-size: 45px;
    }

    .contact-art {
      height: 250px;
    }

    .contact-art__card {
      transform: rotate(-4deg) scale(.72);
    }

    .contact-art__badge {
      left: 14px;
    }

    .contact-content {
      padding-top: 49px;
      gap: 20px;
      padding-bottom: 65px;
    }

    .contact-form-panel {
      padding: 26px 20px;
    }

    .contact-field-pair {
      grid-template-columns: 1fr;
      gap: 0;
    }

    .contact-form-bottom {
      align-items: stretch;
      flex-direction: column;
    }

    .contact-form-bottom button {
      width: 100%;
    }

    .contact-side h3 {
      font-size: 32px;
    }

    .contact-faq {
      padding-bottom: 65px;
    }

    .contact-preview-dialog {
      padding: 22px;
    }

    .contact-preview__actions {
      flex-wrap: wrap;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .journal-card img,
    .journal-primary {
      transition: none!important;
    }
  }

  #vyora-contact-form label .contact-field-caption {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    line-height: 1.35;
    font-size: 12px;
    color: #222a3e;
    font-weight: 800;
  }

  #vyora-contact-form label .contact-field-caption b {
    color: #655ceb;
  }

  .vyora-contact-page .contact-content--no-hero {
    padding-top: 28px;
  }

  @media (max-width:820px) {
    .vyora-contact-page .contact-content--no-hero {
      padding-top: 24px;
    }
  }

  @media (max-width:540px) {
    .vyora-contact-page .contact-content--no-hero {
      padding-top: 16px;
    }
  }
}

/* ==================================================
   08. Shopping Cart & Checkout
================================================== */

@scope (
  html:is(
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"],
    [data-vyora-style-group="g05"],
    [data-vyora-page="confirmation.html"]
  )
) {
  :scope {
    --oc-ink: #171c2e;
    --oc-indigo: #655ceb;
    --oc-soft: #f7f7fc;
    --oc-muted: #5c657b;
    --oc-stroke: #e7e9f2;
  }

  .vyora-order-page {
    font-family: "Manrope","Segoe UI",sans-serif;
    color: var(--oc-ink);
    background: #fff;
  }

  .vyora-order-page * {
    box-sizing: border-box;
  }

  .vyora-order-page [hidden] {
    display: none!important;
  }

  .vyora-order-page .vyora-order-main {
    padding-bottom: 78px;
  }

  .vyora-order-page .order-breadcrumb {
    display: flex;
    gap: 13px;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    color: #848ba0;
    padding: 27px 0 16px;
  }

  .order-breadcrumb a {
    color: #66718b;
    text-decoration: none;
  }

  .order-breadcrumb a:hover {
    color: var(--oc-indigo);
  }

  .order-breadcrumb strong {
    color: var(--oc-ink);
    font-weight: 800;
  }

  .order-heading {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding-top: 42px;
    padding-bottom: 35px;
  }

  .order-eyebrow {
    color: var(--oc-indigo);
    font-weight: 800;
    font-size: 11px;
    letter-spacing: .16em;
  }

  .order-eyebrow span {
    font-size: 17px;
    vertical-align: -2px;
    margin-left: 9px;
  }

  .order-heading h1 {
    font-size: clamp(36px,4.6vw,66px);
    letter-spacing: -.072em;
    line-height: 1.12;
    font-weight: 800;
    margin: 16px 0 12px;
  }

  .order-heading h1 em {
    color: var(--oc-indigo);
    font-style: normal;
  }

  .order-heading p {
    font-size: 15px;
    line-height: 1.7;
    color: #59647b;
    margin: 0;
    max-width: 660px;
    font-weight: 500;
  }

  .order-heading__shape {
    flex: 0 0 225px;
    height: 135px;
    border-radius: 23px;
    background: linear-gradient(135deg,#f3f1ff,#eae7ff);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    transform: rotate(4deg);
    border: 1px solid #e7e3ff;
  }

  .order-heading__shape span {
    font-size: 65px;
    font-weight: 800;
    letter-spacing: -.1em;
    color: #655ceb;
    line-height: 1;
  }

  .order-heading__shape small {
    font-size: 8px;
    color: #8981be;
    letter-spacing: .2em;
    font-weight: 800;
  }

  .order-steps {
    display: flex;
    gap: 20px;
    align-items: center;
    padding: 23px 0;
    border-top: 1px solid var(--oc-stroke);
    border-bottom: 1px solid var(--oc-stroke);
    color: #8b94a6;
    margin: 0 0 39px;
  }

  .order-steps>span {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 12px;
    white-space: nowrap;
    font-weight: 700;
  }

  .order-steps>span>span {
    background: #f1f2f8;
    color: #8a93a7;
    border-radius: 50%;
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    font-size: 10px;
    font-weight: 800;
  }

  .order-steps i {
    height: 1px;
    flex: 1;
    max-width: 90px;
    background: var(--oc-stroke);
  }

  .order-steps .order-steps__active {
    color: #5147d3;
  }

  .order-steps .order-steps__active>span {
    background: #655ceb;
    color: #fff;
  }

  .page-checkout [data-step="bag"] {
    color: #4c5c76;
  }

  .page-checkout [data-step="bag"]>span {
    background: #e9e7ff;
    color: #6257dc;
  }

  .page-checkout [data-step="checkout"] {
    color: #5147d3;
  }

  .page-checkout [data-step="checkout"]>span {
    background: #655ceb;
    color: #fff;
  }

  .order-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(300px,380px);
    gap: clamp(25px,4.7vw,73px);
    align-items: start;
  }

  .order-primary {
    min-width: 0;
  }

  .order-panel-title {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid var(--oc-stroke);
    padding: 0 0 19px;
  }

  .order-caption {
    font-size: 10px;
    letter-spacing: .13em;
    font-weight: 800;
    color: #665de3;
  }

  .order-panel-title h2 {
    font-size: 27px;
    font-weight: 800;
    letter-spacing: -.045em;
    margin: 7px 0 0;
  }

  .item-count {
    display: inline-block;
    vertical-align: middle;
    font-size: 11px;
    font-weight: 800;
    color: #655ceb;
    background: #f0eeff;
    padding: 7px 11px;
    border-radius: 50px;
    margin-right: 10px;
    letter-spacing: 0;
  }

  .order-text-link {
    color: #4b48a6;
    text-decoration: none;
    font-weight: 800;
    font-size: 12px;
    padding-bottom: 5px;
    white-space: nowrap;
  }

  .order-text-link:hover {
    color: #171c2e;
  }

  .order-items {
    min-height: 20px;
  }

  .order-item {
    display: grid;
    grid-template-columns: 135px minmax(0,1fr) auto;
    gap: 22px;
    align-items: center;
    padding: 25px 0;
    border-bottom: 1px solid var(--oc-stroke);
  }

  .order-item__media {
    background: #f4f4fa;
    border-radius: 19px;
    width: 135px;
    height: 145px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }

  .order-item__media:hover {
    background: #efedff;
  }

  .order-item__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .order-item__category {
    color: #655ceb;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-weight: 800;
    font-size: 10px;
    display: block;
  }

  .order-item__name {
    display: block;
    font-weight: 800;
    color: #202641;
    font-size: 17px;
    line-height: 1.35;
    margin: 8px 0;
    text-decoration: none;
  }

  .order-item__name:hover {
    color: #655ceb;
  }

  .order-item__details {
    display: block;
    color: #758099;
    font-size: 12px;
    font-weight: 600;
  }

  .order-item__actions {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-top: 19px;
  }

  .order-quantity {
    display: flex;
    gap: 0;
    align-items: center;
    background: #f6f6fc;
    border: 1px solid #e8e8f4;
    border-radius: 11px;
    height: 40px;
  }

  .order-quantity button {
    background: transparent;
    border: 0;
    color: #424b65;
    min-width: 35px;
    height: 38px;
    font-size: 19px;
  }

  .order-quantity button:hover:not(:disabled) {
    color: #655ceb;
  }

  .order-quantity button:disabled {
    opacity: .28;
    cursor: not-allowed;
  }

  .order-quantity span {
    min-width: 24px;
    text-align: center;
    font-size: 12px;
    font-weight: 800;
  }

  .order-remove {
    border: 0;
    background: transparent;
    color: #8d6076;
    font-size: 12px;
    font-weight: 750;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .order-remove:hover {
    color: #af2c46;
  }

  .order-item__price {
    text-align: left;
    align-self: center;
    white-space: nowrap;
  }

  .order-item__price strong {
    display: block;
    font-size: 18px;
    font-weight: 800;
  }

  .order-item__price small {
    display: block;
    color: #8b93a8;
    margin-top: 8px;
    font-size: 11px;
  }

  .cart-bottom {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 24px 0 0;
  }

  .cart-bottom a {
    font-size: 13px;
    color: #5d55da;
    text-decoration: none;
    font-weight: 800;
  }

  .order-clear {
    font-size: 12px;
    border: 0;
    background: transparent;
    color: #778096;
    text-decoration: underline;
    text-underline-offset: 3px;
    font-weight: 700;
  }

  .order-benefits {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 44px;
  }

  .order-benefits>div {
    border: 1px solid #ececf6;
    background: #fafaff;
    padding: 16px;
    border-radius: 15px;
    display: grid;
    column-gap: 11px;
    grid-template-columns: auto 1fr;
    align-items: center;
  }

  .order-benefits>div>span {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 11px;
    background: #eeecff;
    color: #655ceb;
    font-size: 20px;
  }

  .order-benefits strong {
    font-size: 11px;
    font-weight: 800;
  }

  .order-benefits small {
    font-size: 10px;
    color: #727c93;
    margin-top: 3px;
  }

  .order-summary {
    border-radius: 27px;
    background: #f8f8fd;
    border: 1px solid #ededf7;
    padding: 32px 29px;
    box-shadow: 0 22px 54px rgba(23,28,46,.035);
  }

  .order-summary h2 {
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -.055em;
    margin: 10px 0 28px;
  }

  .summary-line {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    color: #5f6981;
    font-size: 13px;
    font-weight: 600;
    margin: 18px 0;
  }

  .summary-line strong {
    white-space: nowrap;
    color: #171c2e;
    font-size: 14px;
    font-weight: 800;
  }

  .summary-line small {
    font-size: 11px;
    color: #9199a8;
  }

  .summary-note {
    color: #717b92;
    font-size: 11px;
    line-height: 1.75;
    background: #fff;
    padding: 12px 14px;
    border: 1px solid #eeeeF6;
    border-radius: 12px;
    margin: 16px 0;
  }

  .summary-divider {
    border-top: 1px solid #e2e3f0;
    margin: 24px 0;
  }

  .summary-total {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
    margin-bottom: 25px;
  }

  .summary-total span {
    font-size: 14px;
    font-weight: 800;
  }

  .summary-total strong {
    font-size: 25px;
    letter-spacing: -.04em;
    font-weight: 800;
    color: #171c2e;
  }

  .coupon-block {
    border-top: 1px solid #e2e3f0;
    padding-top: 24px;
    margin-top: 4px;
  }

  .coupon-block label {
    display: block;
    font-weight: 800;
    font-size: 12px;
    color: #2b3148;
    margin-bottom: 10px;
  }

  .coupon-control {
    display: flex;
    border: 1px solid #e0e1ed;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    height: 47px;
  }

  .coupon-control input {
    min-width: 0;
    flex: 1;
    border: 0;
    padding: 0 13px;
    background: transparent;
    outline: 0;
    font-size: 12px;
    font-weight: 700;
    color: #1d2340;
  }

  .coupon-control:focus-within {
    outline: 2px solid #a9a2ff;
  }

  .coupon-control button {
    border: 0;
    background: #e9e6ff;
    color: #544bcb;
    padding: 0 15px;
    font-size: 12px;
    font-weight: 800;
  }

  .coupon-control button:hover {
    background: #dedaff;
  }

  .coupon-feedback {
    color: #6d7489;
    font-size: 10px;
    line-height: 1.6;
    margin: 9px 0 20px;
  }

  .order-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    text-decoration: none;
    background: #655ceb;
    color: #fff;
    border: 0;
    border-radius: 13px;
    padding: 17px 22px;
    font-size: 13px;
    font-weight: 800;
    min-height: 54px;
    transition: background .2s,transform .2s;
  }

  .order-button:hover {
    color: #fff;
    background: #5048d3;
    transform: translateY(-1px);
  }

  .order-button--full {
    width: 100%;
  }

  .order-button--full span {
    margin-right: auto;
    font-size: 18px;
  }

  .order-button.is-disabled,
  .order-button:disabled {
    opacity: .45;
    pointer-events: none;
    cursor: not-allowed;
  }

  .order-secondary-link {
    display: block;
    text-align: center;
    color: #6a5fe7;
    text-decoration: none;
    font-weight: 800;
    font-size: 12px;
    margin-top: 15px;
  }

  .order-secondary-link:hover {
    color: #171c2e;
  }

  .order-summary__end {
    border-top: 1px solid #e4e5f0;
    margin-top: 26px;
    padding-top: 23px;
    color: #8686aa;
    letter-spacing: .11em;
    font-size: 10px;
    font-weight: 800;
  }

  .order-summary__end>span {
    color: #655ceb;
    font-size: 18px;
    margin-left: 7px;
  }

  .order-empty {
    text-align: center;
    background: #f8f8ff;
    border: 1px dashed #d9d5fc;
    padding: 63px 25px;
    border-radius: 21px;
    margin: 23px 0;
  }

  .order-empty>span {
    display: grid;
    place-items: center;
    margin: 0 auto 20px;
    background: #eae7ff;
    border-radius: 20px;
    color: #655ceb;
    font-size: 38px;
    width: 75px;
    height: 75px;
  }

  .order-empty h3 {
    font-size: 27px;
    font-weight: 800;
  }

  .order-empty p {
    color: #65718b;
    font-size: 14px;
    max-width: 410px;
    line-height: 1.8;
    margin: 0 auto 22px;
  }

  .order-demo-note {
    max-width: 1200px;
    margin: 40px auto 0;
    padding: 0 25px;
    color: #738096;
    text-align: center;
    font-size: 11px;
    line-height: 1.8;
  }

  .order-demo-note span {
    color: #655ceb;
    font-size: 15px;
    font-weight: 800;
    margin-left: 7px;
  }

  .site-bag-count {
    position: absolute;
    left: -7px;
    top: -7px;
    border-radius: 999px;
    min-width: 17px;
    height: 17px;
    display: grid;
    place-items: center;
    background: #655ceb;
    color: #fff;
    font-size: 9px;
    font-weight: 800;
    padding: 0 4px;
  }

  .cart-shortcut {
    position: relative;
  }

  .order-heading--checkout {
    padding-bottom: 34px;
  }

  .checkout-guest {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    border-radius: 17px;
    background: #efedff;
    padding: 22px 25px;
    margin-bottom: 25px;
  }

  .checkout-guest strong {
    font-weight: 800;
    font-size: 14px;
  }

  .checkout-guest>div>span {
    margin-left: 10px;
    color: #655ceb;
    font-size: 20px;
  }

  .checkout-guest p {
    margin: 5px 32px 0 0;
    color: #646b86;
    font-size: 12px;
  }

  .checkout-guest a {
    font-size: 12px;
    white-space: nowrap;
    font-weight: 800;
    text-decoration: none;
    color: #4b45c6;
  }

  .checkout-card {
    border: 1px solid #e9eaf3;
    padding: 32px;
    border-radius: 24px;
    margin-bottom: 22px;
    box-shadow: 0 8px 32px rgba(23,28,46,.022);
  }

  .checkout-card__title {
    display: flex;
    align-items: center;
    gap: 17px;
    margin-bottom: 26px;
  }

  .checkout-number {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: #efedff;
    color: #655ceb;
    font-size: 12px;
    font-weight: 800;
  }

  .checkout-card__title h2 {
    font-size: 23px;
    letter-spacing: -.04em;
    font-weight: 800;
    margin: 3px 0 0;
  }

  .checkout-card__title h2 small {
    font-size: 11px;
    color: #818aa2;
    letter-spacing: 0;
    font-weight: 600;
  }

  .checkout-fields {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
  }

  .field {
    min-width: 0;
  }

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

  .field label {
    display: block;
    font-size: 12px;
    font-weight: 800;
    color: #31374e;
    margin-bottom: 9px;
  }

  .field label span {
    color: #655ceb;
  }

  .field input,
  .field select {
    width: 100%;
    height: 54px;
    border-radius: 12px;
    border: 1px solid #e2e5ee;
    padding: 0 15px;
    background: #fbfbff;
    color: #242c44;
    outline: 0;
    font-size: 13px;
    font-weight: 600;
    box-shadow: none;
  }

  .field input:focus,
  .field select:focus {
    background: #fff;
    border-color: #9c94ff;
    box-shadow: 0 0 0 3px #655ceb19;
  }

  .field input::placeholder {
    color: #929aad;
    font-weight: 500;
  }

  .field [aria-invalid="true"] {
    border-color: #bc4c61;
    box-shadow: 0 0 0 3px #bc4c6115;
  }

  .field-error {
    display: block;
    margin-top: 7px;
    color: #aa364d;
    font-size: 11px;
    font-weight: 700;
  }

  .shipping-choices {
    display: grid;
    gap: 12px;
  }

  .shipping-choice {
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 83px;
    padding: 15px 18px;
    border: 1px solid #e5e7f0;
    border-radius: 15px;
    cursor: pointer;
    transition: border-color .2s,background .2s;
  }

  .shipping-choice.is-selected {
    background: #f7f5ff;
    border-color: #aca5ff;
  }

  .shipping-choice input {
    accent-color: #655ceb;
    width: 16px;
    height: 16px;
  }

  .shipping-choice__icon {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    background: #eeeafd;
    color: #655ceb;
    font-size: 21px;
  }

  .shipping-choice__text {
    flex: 1;
  }

  .shipping-choice__text strong {
    display: block;
    font-size: 13px;
    font-weight: 800;
    color: #252d45;
  }

  .shipping-choice__text small {
    display: block;
    color: #737c93;
    font-size: 11px;
    margin-top: 4px;
  }

  .shipping-choice>b {
    font-size: 13px;
    color: #20253b;
  }

  .preview-payment {
    display: flex;
    gap: 17px;
    padding: 18px;
    border: 1px solid #ddd9ff;
    border-radius: 16px;
    background: #f7f6ff;
  }

  .preview-payment>span {
    display: grid;
    place-items: center;
    width: 41px;
    height: 41px;
    flex: 0 0 41px;
    border-radius: 13px;
    background: #e5e1ff;
    color: #5d52d2;
    font-size: 23px;
  }

  .preview-payment strong {
    font-size: 13px;
    font-weight: 800;
  }

  .preview-payment p {
    color: #5e6781;
    font-size: 12px;
    line-height: 1.7;
    margin: 6px 0 0;
  }

  .checkout-agreement {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 24px 0 19px;
    color: #505b73;
    font-size: 12px;
    line-height: 1.75;
    cursor: pointer;
  }

  .checkout-agreement input {
    margin-top: 3px;
    accent-color: #655ceb;
    flex: none;
    width: 16px;
    height: 16px;
  }

  .checkout-submit:disabled {
    background: #a7a4cc;
  }

  .checkout-feedback {
    padding: 15px 17px;
    margin-top: 14px;
    border-radius: 13px;
    line-height: 1.7;
    font-size: 12px;
    font-weight: 700;
  }

  .checkout-feedback--error {
    background: #fff1f4;
    color: #923e52;
  }

  .checkout-feedback--success {
    background: #eefaf5;
    color: #235f4e;
  }

  .summary-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  .summary-topline a {
    font-size: 11px;
    color: #655ceb;
    text-decoration: none;
    font-weight: 800;
  }

  .order-summary--checkout h2 {
    margin: 10px 0 24px;
  }

  .checkout-items {
    display: grid;
    gap: 16px;
  }

  .checkout-item {
    display: grid;
    grid-template-columns: 61px minmax(0,1fr) auto;
    gap: 13px;
    align-items: center;
  }

  .checkout-item__media {
    height: 66px;
    width: 61px;
    background: #eeedf7;
    border-radius: 12px;
    display: grid;
    place-items: center;
    position: relative;
  }

  .checkout-item__media img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }

  .checkout-item__badge {
    position: absolute;
    top: -7px;
    left: -7px;
    color: #fff;
    background: #655ceb;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
  }

  .checkout-item__name a {
    font-size: 12px;
    font-weight: 800;
    color: #222a44;
    text-decoration: none;
    line-height: 1.45;
    display: block;
  }

  .checkout-item__name a:hover {
    color: #655ceb;
  }

  .checkout-item__name small {
    display: block;
    color: #858fa7;
    font-size: 10px;
    margin-top: 5px;
  }

  .checkout-item>strong {
    white-space: nowrap;
    font-size: 12px;
  }

  .checkout-empty {
    font-size: 13px;
    color: #65708b;
    line-height: 1.7;
  }

  .checkout-empty a {
    font-weight: 800;
    color: #655ceb;
  }

  .checkout-form--empty {
    opacity: .6;
    pointer-events: none;
  }

  @media (max-width:1160px) {
    .order-layout {
      grid-template-columns: minmax(0,1fr) minmax(280px,340px);
      gap: 28px;
    }

    .order-item {
      grid-template-columns: 112px minmax(0,1fr) auto;
      gap: 14px;
    }

    .order-item__media {
      width: 112px;
      height: 126px;
    }

    .order-item__name {
      font-size: 15px;
    }

    .order-item__actions {
      gap: 12px;
    }

    .order-summary {
      padding: 27px 23px;
    }
  }

  @media (max-width:900px) {
    .order-layout {
      grid-template-columns: 1fr;
    }

    .order-summary {
      max-width: none;
    }

    .order-heading__shape {
      flex-basis: 160px;
      height: 110px;
    }

    .order-heading__shape span {
      font-size: 48px;
    }

    .order-layout--checkout .order-summary {
      grid-row: 1;
    }

    .order-summary--checkout {
      padding: 24px;
    }

    .checkout-items {
      display: grid;
      grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .checkout-item {
      min-width: 0;
    }
  }

  @media (max-width:620px) {
    .order-heading {
      padding-top: 22px;
      padding-bottom: 26px;
    }

    .order-heading h1 {
      font-size: 39px;
      letter-spacing: -.065em;
      margin: 11px 0 12px;
    }

    .order-heading p {
      font-size: 13px;
    }

    .order-heading__shape {
      display: none;
    }

    .order-eyebrow {
      font-size: 9px;
    }

    .order-breadcrumb {
      font-size: 11px;
      padding: 17px 0 12px;
    }

    .order-steps {
      gap: 9px;
      margin-bottom: 25px;
      padding: 15px 0;
    }

    .order-steps>span {
      font-size: 10px;
      gap: 5px;
    }

    .order-steps>span>span {
      width: 22px;
      height: 22px;
      font-size: 9px;
    }

    .order-steps i {
      min-width: 8px;
    }

    .order-layout {
      gap: 27px;
    }

    .order-panel-title h2 {
      font-size: 21px;
    }

    .order-text-link {
      font-size: 10px;
    }

    .item-count {
      font-size: 9px;
      margin-right: 5px;
      padding: 5px 8px;
    }

    .order-item {
      grid-template-columns: 88px minmax(0,1fr);
      gap: 13px;
      padding: 19px 0;
      position: relative;
    }

    .order-item__media {
      width: 88px;
      height: 104px;
      border-radius: 12px;
    }

    .order-item__name {
      font-size: 13px;
    }

    .order-item__details {
      font-size: 10px;
    }

    .order-item__category {
      font-size: 8px;
    }

    .order-item__actions {
      margin-top: 12px;
      gap: 13px;
    }

    .order-item__price {
      grid-column: 2;
      text-align: right;
      margin-top: -6px;
    }

    .order-item__price strong {
      font-size: 15px;
    }

    .order-item__price small {
      display: none;
    }

    .order-quantity {
      height: 34px;
    }

    .order-quantity button {
      height: 32px;
      min-width: 30px;
    }

    .order-quantity span {
      min-width: 20px;
    }

    .order-benefits {
      grid-template-columns: 1fr;
      margin-top: 25px;
      gap: 8px;
    }

    .order-summary {
      padding: 25px 20px;
      border-radius: 21px;
    }

    .order-summary h2 {
      font-size: 25px;
    }

    .order-empty {
      padding: 47px 18px;
    }

    .checkout-guest {
      padding: 17px;
      gap: 12px;
    }

    .checkout-guest strong {
      font-size: 12px;
    }

    .checkout-guest p {
      font-size: 11px;
    }

    .checkout-card {
      padding: 23px 19px;
      border-radius: 18px;
      margin-bottom: 14px;
    }

    .checkout-card__title h2 {
      font-size: 19px;
    }

    .checkout-fields {
      grid-template-columns: 1fr;
      gap: 15px;
    }

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

    .checkout-item {
      grid-template-columns: 52px minmax(0,1fr) auto;
      gap: 10px;
    }

    .checkout-items {
      grid-template-columns: 1fr;
    }

    .checkout-item__media {
      width: 52px;
      height: 56px;
    }

    .checkout-guest a {
      font-size: 11px;
    }

    .order-demo-note {
      margin-top: 28px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .order-button,
    .shipping-choice {
      transition: none;
    }
  }

  @media (max-width:390px) {
    .order-panel-title {
      flex-wrap: wrap;
      align-items: start;
    }

    .order-panel-title .order-text-link {
      margin-right: auto;
    }

    .order-item__info {
      min-width: 0;
    }

    .order-item__name {
      overflow-wrap: anywhere;
    }
  }

  @media (max-width:900px) {
    .order-layout {
      grid-template-columns: minmax(0,1fr);
    }

    .order-primary,
    .order-summary {
      min-width: 0;
    }
  }

  @media (max-width:390px) {
    .order-panel-title>div {
      min-width: 0;
    }

    .order-panel-title h2 {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 6px;
    }

    .order-panel-title .item-count {
      margin-right: 0;
    }

    .order-panel-title .order-text-link {
      font-size: 10px;
    }
  }

  @media (max-width:350px) {
    .order-steps [data-step="done"] {
      font-size: 0;
      gap: 0;
    }

    .order-steps [data-step="done"]::after {
      content: "Done";
      font-size: 9px;
      margin-right: 5px;
    }
  }
}

/* ==================================================
   09. Catalog, Filters & Product Cards
================================================== */

@scope (
  html:is(
    [data-vyora-page="category.html"],
    [data-vyora-page="single-product.html"]
  )
) {
  .vyora-category-page {
    background: #fff;
    color: #171c2e;
    font-family: "Manrope",Arial,sans-serif;
  }

  .vyora-category-page .commerce-container {
    max-width: 1480px;
  }

  .vyora-category-page svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .vyora-category-page h1,
  .vyora-category-page h2,
  .vyora-category-page h3,
  .vyora-category-page h4,
  .vyora-category-page p {
    font-family: inherit;
  }

  .vyora-category-page button,
  .vyora-category-page input,
  .vyora-category-page select {
    font-family: inherit;
  }

  .vyora-category-page [hidden] {
    display: none!important;
  }

  .vyora-category-page .commerce-nav__group.commerce-nav__active>summary {
    color: #655ceb;
  }

  .vyora-category-page .bag-counter {
    position: absolute;
    left: -3px;
    top: -3px;
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #655ceb;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
  }

  .catalog-crumb {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 22px 0 20px;
    color: #878b9e;
    font-size: 12px;
    font-weight: 700;
  }

  .catalog-crumb a {
    color: #7c8092;
  }

  .catalog-crumb a:hover {
    color: #655ceb;
  }

  .catalog-crumb>span:last-child {
    color: #171c2e;
  }

  .catalog-hero {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    position: relative;
    min-height: 420px;
    overflow: hidden;
    border-radius: 30px;
    background: linear-gradient(116deg,#f8f8fe 0%,#f4f3ff 60%,#eae8ff 100%);
  }

  .catalog-hero__copy {
    position: relative;
    z-index: 2;
    padding: 59px 76px 50px 20px;
  }

  .catalog-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 10px;
    letter-spacing: .16em;
    color: #645dda;
    font-weight: 800;
  }

  .catalog-eyebrow__star {
    font-size: 19px;
    line-height: 1;
  }

  .catalog-eyebrow__divider {
    height: 1px;
    background: #b6b1ec;
    width: 32px;
  }

  .catalog-hero h1 {
    max-width: 660px;
    margin: 22px 0 15px;
    font-size: clamp(44px,4.5vw,71px);
    font-weight: 800;
    letter-spacing: -.065em;
    line-height: 1.12;
  }

  .catalog-hero h1 em {
    display: block;
    font-style: normal;
    color: #655ceb;
  }

  .catalog-hero__copy>p {
    max-width: 525px;
    margin: 0;
    color: #7b8297;
    font-size: 14px;
    line-height: 1.95;
    font-weight: 500;
  }

  .catalog-hero__action {
    display: inline-flex;
    align-items: center;
    gap: 24px;
    margin-top: 25px;
    background: #171c2e;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    border-radius: 12px;
    padding: 16px 21px;
    transition: background .2s,transform .2s;
  }

  .catalog-hero__action:hover {
    background: #655ceb;
    color: #fff;
    transform: translateY(-2px);
  }

  .catalog-hero__action svg {
    width: 16px;
    height: 16px;
  }

  .catalog-hero__note {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 37px;
    color: #9596b2;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .14em;
  }

  .catalog-hero__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #655ceb;
    box-shadow: 0 0 0 4px rgba(101,92,235,.12);
  }

  .catalog-hero__art {
    position: relative;
    min-height: 400px;
  }

  .catalog-hero__halo {
    position: absolute;
    left: 1%;
    top: -27%;
    width: 640px;
    height: 640px;
    max-width: 100%;
    background: radial-gradient(circle,#dedaff 0%,#d7d3fb 47%,transparent 65%);
    border-radius: 50%;
    opacity: .8;
  }

  .catalog-hero__poster {
    position: absolute;
    border: 7px solid #fff;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 56px rgba(30,34,73,.16);
    overflow: hidden;
  }

  .catalog-hero__poster img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
  }

  .catalog-hero__poster--main {
    width: 260px;
    height: 345px;
    left: 24%;
    top: 28px;
    transform: rotate(6deg);
  }

  .catalog-hero__poster--accent {
    width: 187px;
    height: 212px;
    left: 6%;
    bottom: 25px;
    transform: rotate(-10deg);
    background: #e8e7f6;
  }

  .catalog-hero__poster--accent img {
    object-fit: contain;
  }

  .catalog-hero__float {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 10px;
    right: 2%;
    bottom: 69px;
    z-index: 2;
    background: #fff;
    border: 1px solid #efedfc;
    color: #36384b;
    padding: 13px 17px;
    border-radius: 11px;
    box-shadow: 0 16px 40px rgba(20,20,60,.1);
    font-size: 11px;
    font-weight: 800;
    transform: rotate(-4deg);
  }

  .catalog-hero__float span {
    color: #655ceb;
    font-size: 21px;
  }

  .catalog-discovery {
    padding-top: 80px;
    padding-bottom: 63px;
    border-bottom: 1px solid #edeef4;
  }

  .catalog-discovery__top {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 25px;
    margin-bottom: 24px;
  }

  .catalog-section-kicker {
    font-size: 10px;
    letter-spacing: .17em;
    color: #655ceb;
    font-weight: 800;
    margin: 0 0 13px;
  }

  .catalog-discovery h2 {
    font-size: clamp(27px,3vw,38px);
    line-height: 1.2;
    letter-spacing: -.05em;
    font-weight: 800;
    margin: 0;
  }

  .catalog-discovery__top>span {
    color: #989bad;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
  }

  .category-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .category-chip {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 13px 17px;
    border-radius: 12px;
    border: 1px solid #e7e8f2;
    background: #fff;
    color: #40485f;
    font-size: 12px;
    font-weight: 800;
    transition: background .18s,border-color .18s,color .18s;
  }

  .category-chip span {
    font-size: 10px;
    color: #9a9eb0;
    font-weight: 800;
  }

  .category-chip:hover {
    border-color: #aca4f9;
    color: #554bda;
  }

  .category-chip.is-active {
    background: #eeeaff;
    border-color: #d5ceff;
    color: #554bda;
  }

  .category-chip.is-active span {
    color: #655ceb;
  }

  .catalog-content {
    padding-top: 69px;
    padding-bottom: 95px;
  }

  .catalog-title-row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 32px;
  }

  .catalog-title-row h2 {
    font-weight: 800;
    font-size: clamp(31px,3.4vw,45px);
    line-height: 1.1;
    letter-spacing: -.055em;
    margin: 0;
  }

  .catalog-title-row h2 span {
    color: #655ceb;
  }

  .catalog-demo-note {
    font-size: 11px;
    color: #9b9fb1;
    margin: 0 0 6px;
    text-align: left;
  }

  .catalog-layout {
    display: grid;
    grid-template-columns: minmax(210px,248px) minmax(0,1fr);
    gap: 35px;
    align-items: start;
  }

  .filter-sidebar {
    border: 1px solid #ececf4;
    background: #fff;
    border-radius: 18px;
    padding: 24px 24px 27px;
    min-width: 0;
  }

  .filter-sidebar__header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    border-bottom: 1px solid #ededf4;
    padding-bottom: 23px;
    margin-bottom: 26px;
  }

  .filter-sidebar__header span {
    color: #989bb2;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .15em;
  }

  .filter-sidebar__header h3 {
    margin: 6px 0 0;
    font-weight: 800;
    font-size: 19px;
    letter-spacing: -.05em;
  }

  .filter-sidebar__close {
    display: none;
  }

  .filter-block {
    border: none;
    margin: 0 0 27px;
    padding: 0 0 25px;
    border-bottom: 1px solid #f0f0f4;
    min-width: 0;
  }

  .filter-block legend,
  .filter-block h4 {
    float: none;
    width: auto;
    margin: 0 0 18px;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 800;
    color: #23293e;
  }

  .filter-option,
  .filter-check {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0 0 14px;
    color: #687084;
    font-size: 12px;
    font-weight: 650;
    cursor: pointer;
  }

  .filter-option:last-child,
  .filter-check:last-child {
    margin-bottom: 0;
  }

  .filter-option input,
  .filter-check input {
    appearance: none;
    -webkit-appearance: none;
    display: inline-block;
    width: 17px;
    height: 17px;
    margin: 0;
    border: 1.5px solid #d6d8e4;
    flex: none;
    transition: background .15s;
    border-color .15s
  }

  .filter-option input {
    border-radius: 50%;
  }

  .filter-check input {
    border-radius: 5px;
  }

  .filter-option input:checked {
    border: 5px solid #655ceb;
  }

  .filter-check input:checked {
    background: #655ceb;
    border-color: #655ceb;
    box-shadow: inset 0 0 0 3px #655ceb;
  }

  .filter-check input:checked:after {
    content: "✓";
    color: white;
    display: block;
    line-height: 14px;
    font-size: 12px;
    text-align: center;
    font-weight: 800;
  }

  .filter-option:has(input:checked),
  .filter-check:has(input:checked) {
    color: #302b68;
  }

  .filter-option small {
    margin-right: auto;
    color: #aaadbd;
    font-weight: 700;
    font-size: 10px;
  }

  .filter-block__line {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .filter-block__line h4 {
    margin-bottom: 20px;
  }

  .filter-block__line output {
    font-size: 12px;
    font-weight: 800;
    color: #655ceb;
    align-self: start;
  }

  #price-limit {
    display: block;
    width: 100%;
    margin: 0;
    accent-color: #655ceb;
    cursor: pointer;
  }

  .price-extents {
    display: flex;
    justify-content: space-between;
    color: #9fa3b0;
    font-size: 10px;
    font-weight: 700;
    margin-top: 9px;
  }

  .filter-clear {
    display: flex;
    justify-content: space-between;
    width: 100%;
    border: 1px solid #e6e3fc;
    background: #f8f7ff;
    color: #5e55cf;
    padding: 14px 15px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
  }

  .filter-clear:hover {
    background: #eeeaff;
  }

  .catalog-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    border-top: 1px solid #eaeaf1;
    border-bottom: 1px solid #eaeaf1;
    padding: 13px 0;
  }

  .catalog-toolbar__start,
  .catalog-toolbar__end {
    display: flex;
    align-items: center;
    gap: 13px;
    color: #838a9c;
    font-size: 12px;
    font-weight: 700;
  }

  .catalog-toolbar__end label {
    white-space: nowrap;
  }

  .catalog-toolbar select {
    border: 1px solid #e7e8f1;
    background: #fff;
    border-radius: 10px;
    padding: 11px 13px 11px 30px;
    color: #23273a;
    font-size: 12px;
    font-weight: 800;
    outline-offset: 2px;
  }

  .mobile-filter-button {
    display: none;
  }

  .catalog-search-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 19px 0 21px;
  }

  .catalog-search {
    height: 48px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    border: 1px solid #e6e8f1;
    border-radius: 12px;
    background: #fff;
    padding: 0 15px;
    color: #9399ac;
    margin: 0;
  }

  .catalog-search:focus-within {
    border-color: #9991f5;
    box-shadow: 0 0 0 3px #655ceb11;
  }

  .catalog-search svg {
    width: 17px;
    height: 17px;
    flex: none;
  }

  .catalog-search input {
    border: none;
    outline: none;
    min-width: 0;
    flex: 1;
    width: 100%;
    background: transparent;
    color: #1f2539;
    font-size: 12px;
  }

  .catalog-search input::placeholder {
    color: #aaaebe;
  }

  .catalog-search__hint {
    font-size: 12px;
    color: #b1b3c2;
    border: 1px solid #eaebf3;
    border-radius: 4px;
    padding: 0 5px;
  }

  .catalog-saved-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #e6e8f1;
    border-radius: 11px;
    background: #fff;
    padding: 12px 15px;
    font-size: 12px;
    color: #72778a;
    font-weight: 800;
    white-space: nowrap;
  }

  .catalog-saved-toggle[aria-pressed="true"] {
    color: #655ceb;
    background: #f4f2ff;
    border-color: #d6d0ff;
  }

  .catalog-saved-toggle small {
    color: #9a91f9;
    font-weight: 800;
  }

  .catalog-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 31px 18px;
  }

  .catalog-card {
    min-width: 0;
    animation: catalog-enter .3s ease-out both;
  }

  .catalog-card__media {
    position: relative;
    isolation: isolate;
    aspect-ratio: 1 / 1.12;
    overflow: hidden;
    border-radius: 16px;
    background: #f5f6fa;
  }

  .catalog-card__image {
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
  }

  .catalog-card__image img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    transition: transform .38s cubic-bezier(.2,.7,.2,1);
  }

  .catalog-card__media--portrait .catalog-card__image img {
    object-fit: cover;
    object-position: center top;
  }

  .catalog-card__media--shoe {
    background: #929abd;
  }

  .catalog-card__media--shoe .catalog-card__image img {
    object-fit: contain;
  }

  .catalog-card__media--illustration {
    background: #f4f3fb;
  }

  .catalog-card__media--illustration .catalog-card__image img {
    width: 87%;
    height: 87%;
    object-fit: contain;
  }

  .catalog-card__media:hover .catalog-card__image img {
    transform: scale(1.055);
  }

  .catalog-card__tag {
    position: absolute;
    top: 14px;
    right: 14px;
    background: #fff;
    border-radius: 7px;
    padding: 8px 10px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .045em;
    color: #6459db;
    z-index: 2;
  }

  .catalog-card__heart {
    position: absolute;
    top: 12px;
    left: 12px;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 1px solid #ffffffb5;
    border-radius: 50%;
    background: #ffffffed;
    color: #45475a;
    z-index: 2;
    transition: color .2s,background .2s;
  }

  .catalog-card__heart svg {
    width: 18px;
    height: 18px;
  }

  .catalog-card__heart[aria-pressed="true"] {
    color: #655ceb;
    background: #ece9ff;
  }

  .catalog-card__heart[aria-pressed="true"] svg {
    fill: #655ceb22;
  }

  .catalog-card__quick {
    position: absolute;
    z-index: 3;
    bottom: 12px;
    right: 12px;
    left: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    color: #171c2e;
    padding: 12px 14px;
    border: 0;
    border-radius: 9px;
    font-weight: 800;
    font-size: 11px;
    transform: translateY(calc(100% + 17px));
    opacity: 0;
    transition: transform .2s,opacity .2s;
  }

  .catalog-card__media:hover .catalog-card__quick,
  .catalog-card__quick:focus-visible {
    transform: translateY(0);
    opacity: 1;
  }

  .catalog-card__details {
    padding: 18px 2px 0;
  }

  .catalog-card__category {
    color: #7c77bc;
    letter-spacing: .11em;
    text-transform: uppercase;
    font-size: 9px;
    font-weight: 800;
  }

  .catalog-card h3 {
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -.025em;
    margin: 8px 0 7px;
    color: #171c2e;
    line-height: 1.45;
  }

  .catalog-card__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .catalog-card__bottom strong {
    font-size: 13px;
    color: #171c2e;
    font-weight: 800;
  }

  .catalog-card__add {
    display: grid;
    place-items: center;
    border: 1px solid #e7e6f6;
    background: #f6f5ff;
    width: 35px;
    height: 35px;
    color: #655ceb;
    border-radius: 9px;
    font-weight: 600;
    font-size: 23px;
    line-height: 1;
  }

  .catalog-card__add:hover {
    background: #655ceb;
    color: #fff;
    border-color: #655ceb;
  }

  .active-filters {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 18px;
    flex-wrap: wrap;
  }

  .active-filters button {
    border: 1px solid #dbd7fc;
    color: #645bd1;
    background: #f6f5ff;
    font-size: 11px;
    font-weight: 750;
    padding: 7px 10px;
    border-radius: 8px;
  }

  .catalog-empty {
    text-align: center;
    padding: 80px 20px;
    background: #f8f8fd;
    border-radius: 19px;
    color: #656c82;
  }

  .catalog-empty span {
    display: block;
    color: #655ceb;
    font-size: 35px;
  }

  .catalog-empty h3 {
    margin: 12px 0 9px;
    font-size: 22px;
    color: #171c2e;
    font-weight: 800;
  }

  .catalog-empty p {
    font-size: 13px;
  }

  .catalog-empty button {
    border: 0;
    background: #655ceb;
    color: #fff;
    border-radius: 9px;
    padding: 12px 20px;
    font-size: 12px;
    font-weight: 800;
  }

  .catalog-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 9px;
    margin-top: 51px;
  }

  .catalog-pagination button {
    display: grid;
    place-items: center;
    min-width: 40px;
    height: 40px;
    border: 1px solid #e7e8f1;
    border-radius: 10px;
    color: #595f73;
    background: #fff;
    font-weight: 800;
    font-size: 12px;
  }

  .catalog-pagination button:hover {
    background: #f5f3ff;
    color: #655ceb;
  }

  .catalog-pagination button.is-active {
    background: #655ceb;
    color: white;
    border-color: #655ceb;
  }

  .catalog-pagination button:disabled {
    opacity: .3;
    cursor: not-allowed;
  }

  #pagination-pages {
    display: flex;
    gap: 8px;
  }

  .catalog-last-call {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 70px;
    padding: 35px 46px!important;
    background: linear-gradient(120deg,#f4f3ff,#fafaff);
    border-radius: 20px;
  }

  .catalog-last-call span {
    font-size: 9px;
    color: #655ceb;
    letter-spacing: .16em;
    font-weight: 800;
  }

  .catalog-last-call h2 {
    font-size: clamp(26px,3vw,39px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -.05em;
    margin: 10px 0 9px;
  }

  .catalog-last-call h2 em {
    font-style: normal;
    color: #655ceb;
  }

  .catalog-last-call p {
    font-size: 12px;
    color: #85899c;
    margin: 0;
  }

  .catalog-last-call>a {
    background: #171c2e;
    color: #fff;
    border-radius: 10px;
    padding: 15px 20px;
    font-size: 12px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    gap: 15px;
    white-space: nowrap;
  }

  .catalog-last-call>a:hover {
    background: #655ceb;
    color: white;
  }

  .catalog-last-call svg {
    width: 16px;
    height: 16px;
  }

  .catalog-modal {
    border: 0;
    padding: 0;
    border-radius: 22px;
    background: #fff;
    color: #171c2e;
    box-shadow: 0 32px 115px rgba(9,11,25,.28);
    width: min(92vw,800px);
    max-width: 800px;
    overflow: visible;
    grid-template-columns: 1fr 1fr;
  }

  .catalog-modal[open] {
    display: grid;
  }

  .catalog-modal::backdrop {
    background: rgba(12,16,33,.65);
    backdrop-filter: blur(3px);
  }

  .catalog-modal__image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    background: #f3f2fc;
    border-radius: 0 22px 22px 0;
    overflow: hidden;
  }

  .catalog-modal__image img {
    max-height: 400px;
    max-width: 100%;
    object-fit: contain;
  }

  .catalog-modal__info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 44px 34px;
  }

  .catalog-modal__info>span {
    font-size: 11px;
    color: #655ceb;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: .1em;
  }

  .catalog-modal__info h2 {
    margin: 13px 0 6px;
    font-size: clamp(22px,2.5vw,35px);
    font-weight: 800;
    letter-spacing: -.05em;
  }

  .catalog-modal__sub {
    color: #8a8fa0;
    font-size: 12px;
  }

  .catalog-modal__info strong {
    font-size: 23px;
    font-weight: 800;
    margin: 8px 0 18px;
  }

  .catalog-modal__info>p:last-of-type {
    color: #8790a2;
    font-size: 12px;
    line-height: 1.8;
  }

  .catalog-modal__add {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #655ceb;
    color: #fff;
    border: 0;
    border-radius: 10px;
    padding: 15px;
    margin-top: 18px;
    font-size: 12px;
    font-weight: 800;
  }

  .catalog-modal__close {
    position: absolute;
    z-index: 5;
    left: -10px;
    top: -10px;
    background: #fff;
    color: #171c2e;
    width: 37px;
    height: 37px;
    border-radius: 50%;
    border: 1px solid #eee;
    display: grid;
    place-items: center;
    box-shadow: 0 4px 10px #0001;
  }

  .bag-overlay {
    position: fixed;
    inset: 0;
    background: rgba(12,16,33,.44);
    z-index: 997;
  }

  .bag-drawer {
    position: fixed;
    z-index: 998;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(100%,435px);
    background: #fff;
    box-shadow: -25px 0 70px rgba(12,16,33,.2);
    transform: translateX(-105%);
    transition: transform .27s ease;
    display: flex;
    flex-direction: column;
    visibility: hidden;
  }

  .bag-drawer.is-open {
    transform: translateX(0);
    visibility: visible;
  }

  .bag-drawer__header {
    padding: 29px 28px 20px;
    border-bottom: 1px solid #ececf3;
    display: flex;
    justify-content: space-between;
    gap: 15px;
    align-items: start;
  }

  .bag-drawer__header span {
    font-size: 10px;
    font-weight: 800;
    color: #655ceb;
    letter-spacing: .15em;
  }

  .bag-drawer__header h2 {
    font-size: 25px;
    font-weight: 800;
    letter-spacing: -.04em;
    margin: 8px 0 0;
  }

  .bag-drawer__header small {
    font-size: 12px;
    color: #8b8d9c;
    font-weight: 600;
  }

  .bag-drawer__close {
    display: grid;
    place-items: center;
    background: #f6f5fc;
    border: 0;
    border-radius: 9px;
    width: 38px;
    height: 38px;
  }

  .bag-drawer__items {
    flex: 1;
    overflow: auto;
    padding: 18px 24px;
  }

  .bag-item {
    display: grid;
    grid-template-columns: 74px 1fr auto;
    gap: 13px;
    align-items: center;
    padding: 13px 0;
    border-bottom: 1px solid #f0f0f5;
  }

  .bag-item img {
    width: 74px;
    height: 76px;
    border-radius: 10px;
    background: #f4f3fa;
    object-fit: contain;
  }

  .bag-item strong {
    display: block;
    font-size: 12px;
  }

  .bag-item small {
    display: block;
    font-size: 11px;
    color: #8b8e9d;
    margin-top: 6px;
  }

  .bag-item button {
    background: transparent;
    border: 0;
    color: #8c8fa0;
    font-size: 17px;
    align-self: start;
  }

  .bag-drawer__footer {
    border-top: 1px solid #ececf3;
    padding: 22px 28px 28px;
  }

  .bag-drawer__footer>div {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    font-weight: 800;
  }

  .bag-drawer__footer p {
    margin: 13px 0;
    font-size: 11px;
    line-height: 1.7;
    color: #888e9d;
  }

  .bag-drawer__footer>button {
    width: 100%;
    border: 0;
    border-radius: 10px;
    background: #655ceb;
    color: #fff;
    padding: 14px;
    font-size: 12px;
    font-weight: 800;
  }

  .bag-empty {
    text-align: center;
    padding: 48px 18px;
    color: #8b91a5;
    font-size: 13px;
  }

  .catalog-toast {
    position: fixed;
    z-index: 1000;
    left: 24px;
    bottom: 24px;
    background: #171c2e;
    color: #fff;
    padding: 14px 22px;
    border-radius: 11px;
    box-shadow: 0 12px 35px #171c2e42;
    transform: translateY(100px);
    opacity: 0;
    pointer-events: none;
    font-size: 12px;
    font-weight: 750;
    transition: transform .25s,opacity .25s;
  }

  .catalog-toast.is-visible {
    transform: translateY(0);
    opacity: 1;
  }

  @keyframes catalog-enter {
    from {
      opacity: .35;
      transform: translateY(7px);
    }

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

  @media (max-width:1260px) {
    .catalog-hero__copy {
      padding-right: 48px;
    }

    .catalog-hero__poster--main {
      left: 24%;
      width: 230px;
      height: 320px;
    }

    .catalog-hero__poster--accent {
      left: 6%;
      width: 160px;
      height: 195px;
    }

    .catalog-layout {
      grid-template-columns: 220px minmax(0,1fr);
      gap: 24px;
    }

    .filter-sidebar {
      padding: 22px 18px;
    }

    .catalog-grid {
      gap: 28px 15px;
    }
  }

  @media (max-width:1050px) {
    .catalog-hero {
      min-height: 370px;
    }

    .catalog-hero__copy {
      padding: 48px 40px 45px 0;
    }

    .catalog-hero h1 {
      font-size: clamp(39px,5vw,60px);
    }

    .catalog-hero__poster--main {
      left: 23%;
      width: 206px;
      height: 275px;
      top: 42px;
    }

    .catalog-hero__poster--accent {
      left: 4%;
      width: 144px;
      height: 167px;
    }

    .catalog-hero__float {
      right: 0;
      bottom: 45px;
    }

    .catalog-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .catalog-demo-note {
      display: none;
    }
  }

  @media (max-width:790px) {
    .catalog-hero {
      grid-template-columns: 1fr;
      min-height: 0;
    }

    .catalog-hero__copy {
      padding: 40px 36px 0;
    }

    .catalog-hero h1 {
      font-size: clamp(43px,6.7vw,63px);
    }

    .catalog-hero__art {
      min-height: 300px;
      margin-top: 5px;
    }

    .catalog-hero__poster--main {
      width: 195px;
      height: 257px;
      left: 33%;
      top: 18px;
    }

    .catalog-hero__poster--accent {
      width: 149px;
      height: 173px;
      left: 18%;
      bottom: 8px;
    }

    .catalog-hero__float {
      right: 15%;
      bottom: 38px;
    }

    .catalog-hero__note {
      display: none;
    }

    .catalog-discovery {
      padding-top: 52px;
      padding-bottom: 42px;
    }

    .catalog-content {
      padding-top: 51px;
    }

    .catalog-layout {
      display: block;
    }

    .filter-sidebar {
      position: fixed;
      z-index: 995;
      right: 0;
      top: 0;
      bottom: 0;
      width: min(350px,89vw);
      overflow: auto;
      border-radius: 0;
      transform: translateX(110%);
      transition: transform .25s;
      box-shadow: 15px 0 50px #171c2e20;
      padding: 30px 23px;
      visibility: hidden;
    }

    .filter-sidebar.is-open {
      transform: translateX(0);
      visibility: visible;
    }

    .filter-sidebar__close {
      display: grid;
      place-items: center;
      border: 0;
      border-radius: 8px;
      background: #f4f3fa;
      width: 35px;
      height: 35px;
    }

    .filters-backdrop:not([hidden]) {
      display: block;
      position: fixed;
      inset: 0;
      background: #1317258c;
      z-index: 994;
    }

    .mobile-filter-button {
      display: inline-flex;
      gap: 7px;
      align-items: center;
      border: 1px solid #e6e5f4;
      background: #f5f3ff;
      color: #5d55cf;
      padding: 11px 13px;
      border-radius: 9px;
      font-size: 12px;
      font-weight: 800;
    }

    .mobile-filter-button svg {
      width: 16px;
      height: 16px;
    }

    .catalog-last-call {
      margin-bottom: 48px;
    }

    .catalog-title-row {
      margin-bottom: 20px;
    }
  }

  @media (max-width:550px) {
    .catalog-crumb {
      padding: 16px 0;
      font-size: 11px;
    }

    .catalog-hero {
      border-radius: 19px;
    }

    .catalog-hero__copy {
      padding: 35px 24px 0;
    }

    .catalog-hero h1 {
      font-size: clamp(37px,10.5vw,51px);
      line-height: 1.13;
      margin-block: 18px 13px;
    }

    .catalog-hero__copy>p {
      font-size: 12px;
      line-height: 1.75;
    }

    .catalog-hero__action {
      margin-top: 19px;
      font-size: 11px;
      padding: 13px 16px;
    }

    .catalog-hero__art {
      min-height: 250px;
    }

    .catalog-hero__poster--main {
      width: 150px;
      height: 204px;
      left: 35%;
      top: 10px;
    }

    .catalog-hero__poster--accent {
      width: 120px;
      height: 132px;
      left: 9%;
      bottom: 18px;
    }

    .catalog-hero__float {
      right: 6%;
      bottom: 21px;
      font-size: 9px;
      padding: 8px;
    }

    .catalog-hero__halo {
      height: 330px;
      width: 330px;
      left: 10%;
      top: -20px;
    }

    .catalog-discovery__top {
      align-items: start;
      flex-direction: column;
      gap: 8px;
    }

    .catalog-discovery__top>span {
      font-size: 10px;
    }

    .category-chips {
      gap: 8px;
    }

    .category-chip {
      padding: 10px 11px;
      font-size: 10px;
      border-radius: 9px;
      gap: 6px;
    }

    .category-chip span {
      font-size: 9px;
    }

    .catalog-discovery {
      padding-top: 40px;
      padding-bottom: 36px;
    }

    .catalog-title-row h2 {
      font-size: 30px;
    }

    .catalog-toolbar__start,
    .catalog-toolbar__end {
      gap: 7px;
    }

    .catalog-toolbar select {
      padding: 10px 8px 10px 25px;
      max-width: 140px;
    }

    .catalog-toolbar__end label {
      display: none;
    }

    .catalog-toolbar {
      padding: 10px 0;
    }

    .catalog-toolbar__start>span {
      font-size: 10px;
    }

    .catalog-search-row {
      margin-block: 15px 19px;
      gap: 8px;
    }

    .catalog-search {
      height: 44px;
    }

    .catalog-search input {
      font-size: 11px;
    }

    .catalog-saved-toggle {
      height: 44px;
      padding-inline: 11px;
    }

    .catalog-saved-toggle span {
      display: none;
    }

    .catalog-grid {
      gap: 23px 12px;
    }

    .catalog-card__media {
      border-radius: 11px;
      aspect-ratio: 1 / 1.14;
    }

    .catalog-card__tag {
      top: 8px;
      right: 8px;
      font-size: 7px;
      padding: 6px 7px;
    }

    .catalog-card__heart {
      top: 6px;
      left: 6px;
      width: 30px;
      height: 30px;
    }

    .catalog-card__heart svg {
      width: 16px;
      height: 16px;
    }

    .catalog-card__quick {
      display: none;
    }

    .catalog-card__details {
      padding: 11px 1px 0;
    }

    .catalog-card__category {
      font-size: 8px;
      letter-spacing: .05em;
    }

    .catalog-card h3 {
      font-size: 12px;
      margin: 5px 0 7px;
    }

    .catalog-card__bottom strong {
      font-size: 11px;
    }

    .catalog-card__add {
      width: 30px;
      height: 30px;
      font-size: 20px;
    }

    .catalog-content {
      padding-bottom: 57px;
    }

    .catalog-pagination {
      margin-top: 35px;
    }

    .catalog-last-call {
      display: block;
      padding: 27px!important;
      border-radius: 15px;
    }

    .catalog-last-call>a {
      margin-top: 22px;
    }

    .catalog-modal[open] {
      display: block;
      width: min(94vw,400px);
    }

    .catalog-modal__image {
      min-height: 200px;
      height: 240px;
      border-radius: 20px 20px 0 0;
    }

    .catalog-modal__image img {
      max-height: 240px;
    }

    .catalog-modal__info {
      padding: 25px 23px;
    }

    .catalog-modal__info h2 {
      font-size: 24px;
    }

    .catalog-modal__close {
      left: 5px;
      top: 5px;
    }

    .catalog-toast {
      left: 12px;
      bottom: 14px;
      right: 12px;
      text-align: center;
    }
  }

  @media (hover:none) {
    .catalog-card__quick {
      display: none;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .catalog-card,
    .catalog-card__quick,
    .catalog-card__image img,
    .catalog-toast,
    .bag-drawer,
    .filter-sidebar {
      animation: none;
      transition: none;
    }
  }

    .vyora-category-page .visually-hidden {
    position: absolute!important;
    width: 1px!important;
    height: 1px!important;
    padding: 0!important;
    margin: -1px!important;
    overflow: hidden!important;
    clip: rect(0,0,0,0)!important;
    white-space: nowrap!important;
    border: 0!important;
  }

  .vyora-category-page .catalog-content {
    padding-top: 26px;
  }

  .vyora-category-page .catalog-title-row h1 {
    font-weight: 800;
    font-size: clamp(31px, 3.4vw, 45px);
    line-height: 1.1;
    letter-spacing: -.055em;
    margin: 0;
  }

  .vyora-category-page .catalog-title-row h1 span {
    color: #655ceb;
  }

  @media (max-width:790px) {
    .vyora-category-page .catalog-content {
      padding-top: 20px;
    }
  }

  @media (max-width:550px) {
    .vyora-category-page .catalog-content {
      padding-top: 12px;
    }

    .vyora-category-page .catalog-title-row h1 {
      font-size: 30px;
    }
  }

  .vyora-category-page .catalog-card__details h3 a {
    color: inherit;
    text-decoration: none;
  }

  .vyora-category-page .catalog-card__details h3 a:hover {
    color: #655ceb;
  }

  .catalog-card__more {
    display: inline-flex;
    margin-top: 9px;
    color: #6158e7;
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
  }

  .catalog-card__more:hover,
  .catalog-modal__detail:hover {
    color: #171c2e;
  }

  .catalog-modal__detail {
    display: inline-flex;
    margin-top: 17px;
    color: #655ceb;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
  }
}

/* ==================================================
   10. Login & Registration
================================================== */

@scope (
  html:is(
    [data-vyora-style-group="g12"]
  )
) {
  :scope {
    --auth-ink: #171c2e;
    --auth-indigo: #655ceb;
    --auth-muted: #59647b;
    --auth-line: #e5e7f1;
  }

  .vyora-auth-page {
    color: var(--auth-ink);
    font-family: "Manrope","Segoe UI",sans-serif;
    background: #fff;
  }

  .vyora-auth-page .auth-main {
    padding-bottom: 78px;
  }

  .vyora-auth-page .auth-breadcrumb {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 24px 0 25px;
    font-size: 12px;
    font-weight: 650;
    color: #717c93;
  }

  .vyora-auth-page .auth-breadcrumb strong {
    color: #222a44;
    font-weight: 800;
  }

  .vyora-auth-page .auth-breadcrumb a:hover {
    color: var(--auth-indigo);
  }

  .vyora-auth-page .auth-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,.95fr);
    min-height: 690px;
    border: 1px solid #e9e9f4;
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 20px 68px rgba(23,28,46,.045);
  }

  .vyora-auth-page .auth-story {
    position: relative;
    min-width: 0;
    overflow: hidden;
    background: linear-gradient(155deg,#eeedff 1%,#f4f2ff 48%,#e6e1ff 100%);
    padding: 38px 46px 29px;
    display: flex;
    flex-direction: column;
    isolation: isolate;
  }

  .vyora-auth-page .auth-story__glow {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    left: -210px;
    bottom: -190px;
    width: 660px;
    height: 660px;
    background: radial-gradient(circle,#d1c9ff 0%,#e5e0ff 49%,transparent 70%);
  }

  .vyora-auth-page .auth-story__top {
    position: relative;
    z-index: 2;
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .16em;
    color: #655ceb;
  }

  .vyora-auth-page .auth-story__top>span:last-child {
    margin-right: auto;
    color: #8d8bad;
    font-size: 10px;
    letter-spacing: .08em;
  }

  .vyora-auth-page .auth-story__asterisk {
    font-size: 17px;
    color: #655ceb;
  }

  .vyora-auth-page .auth-story__copy {
    position: relative;
    z-index: 2;
    margin-top: 56px;
    max-width: 520px;
  }

  .vyora-auth-page .auth-story__eyebrow {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .13em;
    color: #6f6aa4;
  }

  .vyora-auth-page .auth-story__copy h2 {
    font-size: clamp(40px,4vw,69px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -.067em;
    margin: 13px 0 16px;
    color: #171c2e;
  }

  .vyora-auth-page .auth-story__copy h2 em {
    color: var(--auth-indigo);
    font-style: normal;
  }

  .vyora-auth-page .auth-story__copy p {
    font-size: 15px;
    line-height: 1.85;
    color: #525c78;
    max-width: 430px;
    margin: 0;
  }

  .vyora-auth-page .auth-story__visual {
    position: relative;
    margin-top: auto;
    height: 300px;
    min-height: 260px;
    isolation: isolate;
  }

  .vyora-auth-page .auth-story__visual::before {
    content: "";
    position: absolute;
    left: 15%;
    bottom: 0;
    width: 340px;
    height: 280px;
    background: #dbd6ff;
    border-radius: 50% 50% 8% 8%;
    transform: rotate(-12deg);
    opacity: .72;
  }

  .vyora-auth-page .auth-story__photo {
    position: absolute;
    left: 4%;
    bottom: -13px;
    width: 206px;
    height: 258px;
    border: 7px solid #fff;
    border-radius: 21px;
    overflow: hidden;
    transform: rotate(9deg);
    box-shadow: 0 22px 43px #38317a30;
    background: #f5d5e5;
  }

  .vyora-auth-page .auth-story__photo img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center 12%;
    display: block;
  }

  .vyora-auth-page .auth-story__product {
    position: absolute;
    right: 5%;
    bottom: 4px;
    z-index: 2;
    width: 285px;
    height: 174px;
    border: 7px solid #fff;
    border-radius: 23px;
    background: #d5d7e9;
    transform: rotate(-9deg);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 20px 43px #38317a30;
    overflow: hidden;
  }

  .vyora-auth-page .auth-story__product img {
    display: block;
    max-width: 96%;
    max-height: 93%;
    object-fit: contain;
  }

  .vyora-auth-page .auth-story__floating {
    position: absolute;
    z-index: 3;
    top: 24px;
    right: 0;
    background: #fff;
    color: #5147c8;
    border-radius: 13px;
    transform: rotate(-4deg);
    padding: 14px 18px;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 13px 30px #30267f20;
  }

  .vyora-auth-page .auth-story__bottom {
    display: flex;
    gap: 20px;
    align-items: center;
    letter-spacing: .14em;
    font-size: 10px;
    font-weight: 800;
    color: #8b87af;
    margin-top: 27px;
    position: relative;
    z-index: 2;
  }

  .vyora-auth-page .auth-story__bottom span:last-child {
    margin-right: auto;
    color: #655ceb;
    font-size: 21px;
  }

  .vyora-auth-page .auth-form-panel {
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 46px clamp(28px,4.4vw,78px) 37px;
    min-width: 0;
  }

  .vyora-auth-page .auth-panel-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #6c64e3;
    letter-spacing: .13em;
    font-size: 10px;
    font-weight: 800;
  }

  .vyora-auth-page .auth-stage-indicator {
    color: #9197a9;
    letter-spacing: .04em;
    font-size: 10px;
  }

  .vyora-auth-page .auth-form-head {
    margin: 28px 0 30px;
  }

  .vyora-auth-page .auth-form-head h1 {
    font-size: clamp(35px,3.2vw,52px);
    line-height: 1.13;
    font-weight: 800;
    letter-spacing: -.07em;
    margin: 0 0 13px;
    color: #171c2e;
  }

  .vyora-auth-page .auth-form-head h1 em {
    font-style: normal;
    color: var(--auth-indigo);
  }

  .vyora-auth-page .auth-form-head>p {
    margin: 0;
    color: #5f6980;
    font-size: 15px;
    line-height: 1.7;
  }

  .vyora-auth-page .auth-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
  }

  .vyora-auth-page .auth-field {
    min-width: 0;
  }

  .vyora-auth-page .auth-field label {
    display: block;
    color: #272e41;
    font-size: 13px;
    font-weight: 800;
    margin: 0 0 9px;
  }

  .vyora-auth-page .auth-label-row {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 12px;
  }

  .vyora-auth-page .auth-inline {
    border: 0;
    padding: 0;
    background: transparent;
    color: #655ceb;
    font-size: 12px;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 4px;
  }

  .vyora-auth-page .auth-inline:hover {
    color: #3831b0;
  }

  .vyora-auth-page .auth-input {
    position: relative;
    display: flex;
    align-items: center;
    height: 58px;
    border: 1px solid #e3e6f1;
    border-radius: 14px;
    background: #f9faff;
    transition: box-shadow .18s ease,border .18s ease,background .18s ease;
  }

  .vyora-auth-page .auth-input:focus-within {
    border-color: #a9a2ff;
    background: #fff;
    box-shadow: 0 0 0 4px #655ceb19;
  }

  .vyora-auth-page .auth-input>svg {
    width: 20px;
    height: 20px;
    margin-right: 18px;
    color: #878eaa;
    flex: none;
  }

  .vyora-auth-page .auth-input input {
    flex: 1;
    min-width: 0;
    height: 100%;
    padding: 0 15px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #171c2e;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    box-shadow: none;
  }

  .vyora-auth-page .auth-input input::placeholder {
    color: #8d95a8;
    font-weight: 500;
    opacity: 1;
  }

  .vyora-auth-page .auth-input:has(input[aria-invalid="true"]) {
    border-color: #cd616b;
    box-shadow: 0 0 0 3px #cd616b11;
  }

  .vyora-auth-page .auth-visibility {
    border: 0;
    background: transparent;
    color: #7d849b;
    padding: 10px 4px 10px 15px;
    display: grid;
    place-items: center;
    flex: none;
  }

  .vyora-auth-page .auth-visibility:hover,
  .vyora-auth-page .auth-visibility[aria-pressed="true"] {
    color: var(--auth-indigo);
  }

  .vyora-auth-page .auth-visibility svg {
    width: 20px;
    height: 20px;
  }

  .vyora-auth-page .auth-error {
    color: #a33b49;
    font-size: 11px;
    font-weight: 650;
    margin: 7px 0 0;
  }

  .vyora-auth-page .auth-helper {
    color: #66718b;
    font-size: 11px;
    font-weight: 600;
    margin: 8px 0 0;
  }

  .vyora-auth-page .password-strength {
    display: flex;
    gap: 5px;
    margin-top: 10px;
  }

  .vyora-auth-page .password-strength span {
    height: 4px;
    flex: 1;
    border-radius: 99px;
    background: #e6e8f0;
    transition: background .2s;
  }

  .vyora-auth-page .password-strength[data-strength="1"] span:nth-child(-n/**/+1) {
    background: #d66b73;
  }

  .vyora-auth-page .password-strength[data-strength="2"] span:nth-child(-n/**/+2) {
    background: #d3a34d;
  }

  .vyora-auth-page .password-strength[data-strength="3"] span:nth-child(-n/**/+3) {
    background: #7475ec;
  }

  .vyora-auth-page .password-strength[data-strength="4"] span:nth-child(-n/**/+4) {
    background: #288579;
  }

  .vyora-auth-page .auth-submit {
    margin-top: 2px;
    height: 57px;
    border-radius: 14px;
    border: 0;
    background: #655ceb;
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 22px;
    font-size: 14px;
    font-weight: 800;
    transition: background .2s,transform .2s,box-shadow .2s;
    box-shadow: 0 13px 23px #655ceb29;
  }

  .vyora-auth-page .auth-submit:hover {
    background: #5046d0;
    transform: translateY(-1px);
    box-shadow: 0 16px 25px #655ceb35;
  }

  .vyora-auth-page .auth-submit span {
    font-size: 22px;
    font-weight: 500;
  }

  .vyora-auth-page .auth-form-feedback,
  .vyora-auth-page .auth-inline-note {
    background: #f1f0ff;
    color: #403a9b;
    border: 1px solid #dedaff;
    border-radius: 12px;
    padding: 13px 15px;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.7;
  }

  .vyora-auth-page .auth-divider {
    position: relative;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 8px 0 0;
    color: #8791a5;
    font-size: 11px;
    white-space: nowrap;
  }

  .vyora-auth-page .auth-divider::before,
  .vyora-auth-page .auth-divider::after {
    content: "";
    height: 1px;
    background: #e9eaf2;
    flex: 1;
  }

  .vyora-auth-page .auth-guest {
    min-height: 44px;
    border: 1px solid #e7e7f2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 800;
    color: #353d53;
  }

  .vyora-auth-page .auth-guest:hover {
    background: #f7f6ff;
    border-color: #d7d4ff;
    color: #5147c8;
  }

  .vyora-auth-page .auth-switch {
    margin: 24px 0 0;
    text-align: center;
    color: #566177;
    font-size: 13px;
    font-weight: 600;
  }

  .vyora-auth-page .auth-switch a {
    color: #574eda;
    text-decoration: underline;
    text-underline-offset: 4px;
    font-weight: 800;
    margin-right: 6px;
  }

  .vyora-auth-page .auth-switch a:hover {
    color: #3930b8;
  }

  .vyora-auth-page .auth-demo-note {
    margin: 23px 0 0;
    padding-top: 17px;
    border-top: 1px solid #ececf3;
    font-size: 11px;
    line-height: 1.75;
    color: #657087;
  }

  .vyora-auth-page .auth-demo-note span {
    margin-left: 6px;
    color: #655ceb;
    font-weight: 800;
    font-size: 14px;
  }

  .vyora-auth-page .auth-perks {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 16px;
    margin-top: 27px;
  }

  .vyora-auth-page .auth-perks>div {
    display: flex;
    align-items: center;
    gap: 11px;
    background: #f8f8fc;
    border-radius: 13px;
    padding: 17px 19px;
    font-size: 12px;
    font-weight: 800;
    color: #3c445c;
  }

  .vyora-auth-page .auth-perks>div span {
    display: grid;
    place-items: center;
    background: #ebe9ff;
    color: #5e55e2;
    flex: none;
    width: 29px;
    height: 29px;
    border-radius: 9px;
    font-size: 17px;
  }

  .vyora-auth-page .auth-register .auth-story__copy {
    margin-top: 42px;
  }

  .vyora-auth-page .auth-register .auth-story__visual {
    height: 290px;
  }

  .vyora-auth-page .auth-register .auth-form-head {
    margin: 20px 0 21px;
  }

  .vyora-auth-page .auth-register .auth-form {
    gap: 12px;
  }

  .vyora-auth-page .auth-register .auth-field label {
    margin-bottom: 7px;
  }

  .vyora-auth-page .auth-register .auth-input {
    height: 53px;
  }

  .vyora-auth-page .auth-register .auth-switch {
    margin-top: 17px;
  }

  .vyora-auth-page .auth-register .auth-demo-note {
    margin-top: 17px;
    padding-top: 14px;
  }

  .vyora-auth-page .auth-register .auth-form-panel {
    padding-top: 35px;
    padding-bottom: 32px;
  }

  .vyora-auth-page :is(a,button,input,summary):focus-visible {
    outline: 3px solid #aaa3ff;
    outline-offset: 3px;
  }

  @media (max-width:1190px) {
    .vyora-auth-page .auth-layout {
      grid-template-columns: 1fr 1fr;
    }

    .vyora-auth-page .auth-story {
      padding-inline: 32px;
    }

    .vyora-auth-page .auth-story__copy h2 {
      font-size: clamp(40px,4.8vw,57px);
    }

    .vyora-auth-page .auth-story__product {
      width: 240px;
    }

    .vyora-auth-page .auth-story__photo {
      width: 188px;
    }

    .vyora-auth-page .auth-form-panel {
      padding-inline: 32px;
    }
  }

  @media (max-width:850px) {
    .vyora-auth-page .auth-layout {
      grid-template-columns: 1fr;
      border-radius: 24px;
    }

    .vyora-auth-page .auth-story {
      min-height: 250px;
      padding: 30px 35px;
    }

    .vyora-auth-page .auth-story__copy {
      margin: 20px 0 0;
      max-width: 540px;
    }

    .vyora-auth-page .auth-story__copy h2 {
      font-size: 43px;
      margin: 8px 0 8px;
    }

    .vyora-auth-page .auth-story__copy p {
      font-size: 13px;
    }

    .vyora-auth-page .auth-story__visual,
    .vyora-auth-page .auth-story__bottom {
      display: none;
    }

    .vyora-auth-page .auth-form-panel {
      padding: 38px 35px 36px;
    }

    .vyora-auth-page .auth-form-head {
      margin: 22px 0 24px;
    }

    .vyora-auth-page .auth-register .auth-story {
      min-height: 245px;
    }

    .vyora-auth-page .auth-register .auth-story__copy {
      margin-top: 20px;
    }

    .vyora-auth-page .auth-register .auth-form-panel {
      padding: 37px 35px;
    }

    .vyora-auth-page .auth-perks {
      gap: 9px;
    }

    .vyora-auth-page .auth-perks>div {
      padding: 14px 12px;
      font-size: 11px;
    }
  }

  @media (max-width:550px) {
    .vyora-auth-page .auth-main {
      padding-bottom: 40px;
    }

    .vyora-auth-page .auth-breadcrumb {
      padding: 16px 0 16px;
      font-size: 10px;
      gap: 9px;
    }

    .vyora-auth-page .auth-layout {
      border-radius: 19px;
    }

    .vyora-auth-page .auth-story {
      padding: 21px 23px;
      min-height: 220px;
    }

    .vyora-auth-page .auth-story__copy {
      margin-top: 18px;
    }

    .vyora-auth-page .auth-story__copy h2 {
      font-size: 36px;
      line-height: 1.09;
    }

    .vyora-auth-page .auth-story__copy p {
      font-size: 12px;
      line-height: 1.65;
    }

    .vyora-auth-page .auth-story__top {
      font-size: 9px;
    }

    .vyora-auth-page .auth-story__top>span:last-child {
      font-size: 8px;
    }

    .vyora-auth-page .auth-story__eyebrow {
      font-size: 8px;
    }

    .vyora-auth-page .auth-form-panel,
    .vyora-auth-page .auth-register .auth-form-panel {
      padding: 27px 22px 24px;
    }

    .vyora-auth-page .auth-form-head h1 {
      font-size: 37px;
    }

    .vyora-auth-page .auth-form-head {
      margin: 21px 0 23px;
    }

    .vyora-auth-page .auth-form-head>p {
      font-size: 13px;
    }

    .vyora-auth-page .auth-input {
      height: 55px;
    }

    .vyora-auth-page .auth-field label {
      font-size: 12px;
    }

    .vyora-auth-page .auth-input input {
      font-size: 13px;
    }

    .vyora-auth-page .auth-form {
      gap: 15px;
    }

    .vyora-auth-page .auth-perks {
      grid-template-columns: 1fr;
      gap: 9px;
      margin-top: 15px;
    }

    .vyora-auth-page .auth-perks>div {
      padding: 12px 16px;
    }

    .vyora-auth-page .auth-register .auth-story {
      min-height: 208px;
    }

    .vyora-auth-page .auth-register .auth-form {
      gap: 13px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .vyora-auth-page .auth-input,
    .vyora-auth-page .auth-submit,
    .vyora-auth-page .password-strength span {
      transition: none;
    }
  }
}

/* ==================================================
   11. About, Testimonials & FAQ
================================================== */

@scope (
  html:is(
    [data-vyora-page="about.html"],
    [data-vyora-style-group="g04"],
    [data-vyora-page="faq.html"],
    [data-vyora-page="testimonial.html"]
  )
) {
  .vyora-stage19 {
    --v19-ink: #171c2e;
    --v19-indigo: #655ceb;
    --v19-muted: #59627a;
    --v19-line: #e5e7f1;
    --v19-soft: #f7f7fd;
    color: var(--v19-ink);
  }

  .vyora-stage19 *,
  .vyora-editorial .journal-layout-switch * {
    box-sizing: border-box;
  }

  .vyora-stage19 .container-wide {
    max-width: 1340px;
  }

  .v19-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-radius: 13px;
    padding: 17px 23px;
    background: var(--v19-ink);
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
    transition: background .2s ease,transform .2s ease;
  }

  .v19-button:hover {
    color: white;
    background: #39366d;
    transform: translateY(-2px);
  }

  .v19-link {
    font-size: 13px;
    font-weight: 800;
    color: #312f5e;
    text-decoration: none;
    padding-bottom: 6px;
    border-bottom: 1px solid #aaa1ef;
  }

  .v19-link:hover {
    color: var(--v19-indigo);
  }

  .vyora-stage19 em {
    font-style: normal;
    color: var(--v19-indigo);
  }

  .vyora-stage19 p {
    color: var(--v19-muted);
  }

  .vyora-stage19 h1,
  .vyora-stage19 h2,
  .vyora-stage19 h3 {
    letter-spacing: -.045em;
  }

  .brand-hero {
    display: grid;
    grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr);
    gap: 7%;
    align-items: center;
    padding: 70px 0 95px;
    min-height: 640px;
  }

  .brand-hero h1 {
    font-size: clamp(48px,5vw,82px);
    line-height: 1.06;
    font-weight: 800;
    margin: 23px 0;
    color: var(--v19-ink);
  }

  .brand-hero__copy>p {
    font-size: 16px;
    line-height: 1.9;
    max-width: 555px;
  }

  .brand-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
    margin-top: 29px;
  }

  .brand-hero__micro {
    font-size: 10px;
    color: #9890d7;
    letter-spacing: .18em;
    font-weight: 800;
    margin-top: 63px;
  }

  .brand-hero__art {
    min-height: 555px;
    position: relative;
    padding: 15px 55px 0 75px;
  }

  .brand-hero__art::before {
    position: absolute;
    content: "";
    inset: 5% 1% 10% 9%;
    border-radius: 48% 48% 42% 42%;
    background: linear-gradient(145deg,#eeecff,#faf9ff);
  }

  .brand-hero__image {
    position: relative;
    width: 83%;
    height: 500px;
    border: 10px solid white;
    border-radius: 185px 185px 25px 25px;
    overflow: hidden;
    box-shadow: 0 24px 70px #171c2e1a;
  }

  .brand-hero__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
  }

  .brand-hero__offset {
    position: absolute;
    width: 43%;
    height: 235px;
    left: 0;
    bottom: 0;
    border: 9px solid white;
    overflow: hidden;
    border-radius: 20px;
    box-shadow: 0 28px 45px #171c2e1a;
    transform: rotate(7deg);
  }

  .brand-hero__offset img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .brand-hero__art-label {
    position: absolute;
    top: 12%;
    left: -2%;
    font-size: 10px;
    letter-spacing: .13em;
    color: #727590;
    font-weight: 800;
    writing-mode: vertical-rl;
  }

  .brand-hero__art-label b {
    font-size: 18px;
    color: #655ceb;
  }

  .brand-story {
    padding: 65px 0 115px;
    border-top: 1px solid var(--v19-line);
    display: grid;
    grid-template-columns: 35% minmax(0,1fr);
    gap: 10%;
  }

  .brand-story__label {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 280px;
  }

  .brand-story__motif {
    font-size: 125px;
    color: #e9e7ff;
    line-height: 1;
  }

  .brand-story h2,
  .brand-values h2,
  .brand-explore h2,
  .voices-feed h2,
  .voices-feature h2,
  .faq-body h2 {
    font-weight: 800;
    font-size: clamp(38px,4vw,59px);
    line-height: 1.13;
    margin: 0 0 25px;
  }

  .brand-story p {
    font-size: 16px;
    line-height: 2;
    max-width: 760px;
    margin: 0 0 20px;
  }

  .brand-story__note {
    font-size: 11px;
    color: #797b94;
    display: block;
    margin-top: 27px;
    border-right: 3px solid #ada4ff;
    padding: 8px 15px;
  }

  .brand-values {
    background: #f6f6fc;
    padding: 100px 0 110px;
  }

  .brand-values__heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 25px;
    margin-bottom: 40px;
  }

  .brand-values h2 {
    margin: 0;
  }

  .brand-values__grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
  }

  .brand-values__grid article {
    background: #fff;
    border: 1px solid #eeeeF7;
    border-radius: 25px;
    padding: 35px 31px;
    min-height: 295px;
  }

  .brand-values__number {
    font-size: 11px;
    letter-spacing: .15em;
    color: #8a8fa8;
    font-weight: 800;
  }

  .brand-values__icon {
    margin: 32px 0 18px;
    font-size: 39px;
    color: #655ceb;
    line-height: 1;
  }

  .brand-values__grid h3 {
    font-size: 22px;
    font-weight: 800;
    margin-bottom: 13px;
  }

  .brand-values__grid p {
    line-height: 1.85;
    font-size: 13px;
    margin: 0;
  }

  .brand-explore {
    padding: 105px 0;
    display: grid;
    grid-template-columns: 47% minmax(0,1fr);
    gap: 9%;
    align-items: center;
  }

  .brand-explore__photo {
    border-radius: 24px;
    overflow: hidden;
    height: 460px;
    background: #f2f2fa;
  }

  .brand-explore__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
  }

  .brand-explore__copy>p {
    font-size: 15px;
    line-height: 1.9;
    max-width: 530px;
  }

  .brand-explore h2 {
    margin: 20px 0;
  }

  .brand-explore__links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 20px;
    margin-top: 28px;
  }

  .brand-explore__links a {
    display: flex;
    justify-content: space-between;
    text-decoration: none;
    color: #20283b;
    border-bottom: 1px solid #e3e5ee;
    padding: 15px 0;
    font-weight: 800;
    font-size: 13px;
  }

  .brand-explore__links a:hover,
  .brand-explore__links a span {
    color: #655ceb;
  }

  .v19-endcap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 45px 55px!important;
    border-radius: 24px;
    background: #f3f1ff;
    margin-bottom: 95px!important;
  }

  .v19-endcap h2 {
    font-size: clamp(27px,3vw,42px);
    font-weight: 800;
    margin: 15px 0 0;
  }

  .voices-hero {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,.8fr);
    gap: 8%;
    align-items: center;
    min-height: 480px;
    padding: 60px 0 58px;
  }

  .voices-hero h1,
  .faq-hero h1,
  .leftblog-hero h1 {
    font-size: clamp(48px,5.2vw,78px);
    font-weight: 800;
    line-height: 1.08;
    margin: 19px 0 22px;
  }

  .voices-hero p,
  .faq-hero p,
  .leftblog-hero p {
    font-size: 16px;
    line-height: 1.9;
    max-width: 605px;
    margin-bottom: 29px;
  }

  .voices-hero__graphic {
    height: 370px;
    border-radius: 28px;
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: radial-gradient(circle at 50% 50%,#eeecff 0%,#f8f7ff 66%);
  }

  .voices-hero__ring {
    position: absolute;
    width: 460px;
    height: 460px;
    border: 1px dashed #beb8ee;
    border-radius: 50%;
    inset: 50% auto auto 50%;
    transform: translate(-50%,-50%);
  }

  .voices-hero__mark {
    font-family: Georgia,serif;
    color: #655ceb;
    font-size: 320px;
    line-height: 1;
    position: absolute;
    top: 5px;
  }

  .voices-hero__tile {
    position: absolute;
    z-index: 1;
    border-radius: 13px;
    padding: 17px 24px;
    background: #fff;
    box-shadow: 0 15px 45px #171c2e13;
    color: #323751;
    font-size: 13px;
    font-weight: 800;
  }

  .voices-hero__tile.one {
    top: 75px;
    right: 22px;
    transform: rotate(-8deg);
  }

  .voices-hero__tile.two {
    left: 22px;
    bottom: 75px;
    transform: rotate(7deg);
  }

  .voices-disclaimer {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    background: #f8f7ff;
    padding: 18px 24px;
    border-radius: 13px;
    border: 1px solid #ebe7ff;
  }

  .voices-disclaimer>span {
    color: #655ceb;
    font-size: 20px;
  }

  .voices-disclaimer p {
    margin: 0;
    font-size: 13px;
    line-height: 1.75;
  }

  .voices-disclaimer strong {
    color: #282e48;
  }

  .voices-feed {
    padding: 95px 0 70px;
  }

  .voices-feed__heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 25px;
    margin-bottom: 29px;
  }

  .voices-feed__heading p {
    max-width: 300px;
    font-size: 13px;
    line-height: 1.7;
  }

  .voices-feed h2 {
    margin: 13px 0 0;
  }

  .voices-filter {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: 25px;
  }

  .voices-filter button {
    background: #fff;
    border: 1px solid #e4e6f1;
    border-radius: 999px;
    color: #505975;
    font-weight: 800;
    font-size: 12px;
    padding: 11px 20px;
  }

  .voices-filter button.is-active,
  .voices-filter button:hover {
    background: #655ceb;
    color: white;
    border-color: #655ceb;
  }

  .voices-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 18px;
  }

  .voices-card {
    border: 1px solid #e8e9f1;
    background: white;
    border-radius: 23px;
    padding: 28px 27px;
    min-height: 314px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 18px 50px #171c2e06;
  }

  .voices-card[hidden] {
    display: none!important;
  }

  .voices-card__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
  }

  .voices-card__icon {
    font-family: Georgia,serif;
    font-size: 70px;
    color: #655ceb;
    line-height: .8;
  }

  .voices-card__type {
    font-size: 10px;
    font-weight: 800;
    color: #656c87;
    background: #f4f4fb;
    border-radius: 100px;
    padding: 8px 12px;
  }

  .voices-card h3 {
    font-size: 16px;
    font-weight: 800;
  }

  .voices-card blockquote {
    font-size: 15px;
    color: #2d3349;
    line-height: 1.8;
    margin: 10px 0 25px;
    font-weight: 600;
    flex: 1;
  }

  .voices-card__foot {
    display: flex;
    align-items: center;
    gap: 11px;
    border-top: 1px solid #eeeef5;
    padding-top: 16px;
  }

  .voices-card__avatar {
    display: grid;
    place-items: center;
    width: 39px;
    height: 39px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #efedff;
    color: #655ceb;
    font-weight: 800;
  }

  .voices-card__foot>div {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }

  .voices-card__foot strong {
    font-size: 11px;
  }

  .voices-card__foot small {
    font-size: 10px;
    line-height: 1.4;
    color: #7b8097;
  }

  .voices-counter {
    font-size: 12px;
    font-weight: 800;
    text-align: left;
    color: #7b8197;
    margin-top: 18px;
  }

  .voices-feature {
    display: grid;
    grid-template-columns: 47% 1fr;
    align-items: center;
    gap: 8%;
    padding: 45px 0 110px;
  }

  .voices-feature__visual {
    border-radius: 24px;
    height: 350px;
    overflow: hidden;
  }

  .voices-feature__visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
  }

  .voices-feature h2 {
    margin: 17px 0;
  }

  .voices-feature p {
    font-size: 14px;
    line-height: 1.9;
    margin-bottom: 25px;
  }

  .faq-hero {
    display: grid;
    grid-template-columns: 1fr .75fr;
    gap: 6%;
    padding: 56px 0 48px;
    align-items: center;
  }

  .faq-hero h1 {
    max-width: 750px;
  }

  .faq-hero__visual {
    height: 330px;
    position: relative;
    background: #f4f2ff;
    border-radius: 30px;
    display: grid;
    place-items: center;
    overflow: hidden;
  }

  .faq-hero__question {
    font-size: 250px;
    color: #655ceb;
    font-weight: 800;
    line-height: 1;
    position: relative;
    z-index: 1;
    text-shadow: 12px 15px 0 #d9d5ff;
  }

  .faq-hero__badge {
    position: absolute;
    right: 26px;
    top: 55px;
    transform: rotate(-8deg);
    background: white;
    border-radius: 12px;
    padding: 14px 18px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .1em;
    z-index: 2;
    box-shadow: 0 14px 25px #171c2e12;
  }

  .faq-hero__badge span {
    color: #655ceb;
  }

  .faq-hero__orbit {
    position: absolute;
    border: 1px dashed #b9b4eb;
    width: 420px;
    height: 420px;
    border-radius: 50%;
  }

  .faq-search,
  .leftblog-search {
    display: flex;
    align-items: center;
    gap: 13px;
    max-width: 570px;
    background: white;
    border: 1px solid #e2e3ee;
    border-radius: 14px;
    padding: 15px 19px;
    box-shadow: 0 15px 35px #171c2e08;
  }

  .faq-search span,
  .leftblog-search span {
    font-size: 26px;
    color: #655ceb;
    line-height: 1;
  }

  .faq-search input,
  .leftblog-search input {
    outline: 0;
    border: 0;
    background: none;
    min-width: 0;
    width: 100%;
    font-size: 14px;
    color: #242a3c;
  }

  .faq-search:focus-within,
  .leftblog-search:focus-within {
    border-color: #655ceb;
    box-shadow: 0 0 0 3px #655ceb17;
  }

  .faq-note {
    display: flex;
    gap: 12px;
    align-items: center;
    background: #f7f7fc;
    border-radius: 12px;
    padding: 15px 23px;
    color: #616985;
    font-size: 12px;
  }

  .faq-note>span {
    font-size: 21px;
    color: #655ceb;
  }

  .faq-layout {
    display: grid;
    grid-template-columns: minmax(225px,.29fr) minmax(0,.71fr);
    gap: 70px;
    align-items: start;
    padding: 85px 0 125px;
  }

  .faq-sidebar {
    position: sticky;
    top: 25px;
  }

  .faq-filters {
    display: grid;
    gap: 6px;
    margin: 20px 0 30px;
  }

  .faq-filters button,
  .leftblog-filters button {
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #464e65;
    font-weight: 800;
    font-size: 13px;
    padding: 15px;
    display: flex;
    justify-content: space-between;
    text-align: right;
    width: 100%;
  }

  .faq-filters button.is-active,
  .faq-filters button:hover,
  .leftblog-filters button.is-active,
  .leftblog-filters button:hover {
    background: #efedff;
    color: #554ccf;
  }

  .faq-filters button span,
  .leftblog-filters button span {
    font-size: 11px;
    color: #979bb1;
  }

  .faq-sidebar__assist {
    border-radius: 18px;
    padding: 28px;
    background: #171c2e;
    color: white;
  }

  .faq-sidebar__assist span {
    font-size: 10px;
    color: #c2bbff;
    letter-spacing: .1em;
    font-weight: 800;
  }

  .faq-sidebar__assist strong {
    display: block;
    font-size: 21px;
    margin: 20px 0 9px;
  }

  .faq-sidebar__assist p {
    font-size: 12px;
    line-height: 1.8;
    color: #c2c7d7;
  }

  .faq-sidebar__assist a {
    font-size: 12px;
    font-weight: 800;
    color: #d4ceff;
    text-decoration: none;
  }

  .faq-body__head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 14px;
    margin-bottom: 26px;
  }

  .faq-body h2 {
    font-size: clamp(30px,3.5vw,50px);
    margin: 13px 0 0;
  }

  .faq-body__head>span {
    font-size: 12px;
    font-weight: 800;
    color: #757f95;
    white-space: nowrap;
  }

  .faq-questions {
    border-top: 1px solid #e3e5ef;
  }

  .v19-faq {
    border-bottom: 1px solid #e3e5ef;
  }

  .v19-faq[hidden] {
    display: none;
  }

  .v19-faq summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    font-size: 16px;
    font-weight: 800;
    color: #232a40;
    padding: 24px 2px;
  }

  .v19-faq summary::-webkit-details-marker {
    display: none;
  }

  .v19-faq summary b {
    width: 32px;
    height: 32px;
    flex: none;
    border-radius: 50%;
    background: #f2f0ff;
    display: grid;
    place-items: center;
    color: #655ceb;
    font-size: 21px;
  }

  .v19-faq[open] summary b {
    transform: rotate(45deg);
    background: #655ceb;
    color: #fff;
  }

  .v19-faq__answer p {
    padding: 0 0 22px 34px;
    max-width: 760px;
    font-size: 14px;
    line-height: 1.9;
    margin: 0;
  }

  .faq-empty {
    text-align: center;
    background: #f7f6fd;
    padding: 60px 20px;
    border-radius: 18px;
  }

  .faq-empty[hidden] {
    display: none;
  }

  .faq-empty h3 {
    font-weight: 800;
  }

  .faq-empty button {
    border: 0;
    border-radius: 10px;
    background: #655ceb;
    color: white;
    padding: 12px 20px;
    font-weight: 800;
  }

  .journal-layout-switch {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 18px auto 0!important;
  }

  .journal-layout-switch>span {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .1em;
    color: #8a8fa7;
    margin-left: auto;
  }

  .journal-layout-switch a {
    font-size: 12px;
    text-decoration: none;
    border: 1px solid #e3e5f1;
    padding: 10px 14px;
    border-radius: 10px;
    font-weight: 800;
    color: #505a72;
  }

  .journal-layout-switch a:hover,
  .journal-layout-switch a.is-active {
    background: #eeecff;
    border-color: #cbc5ff;
    color: #554bcf;
  }

  .leftblog-hero {
    display: grid;
    grid-template-columns: 1fr 390px;
    min-height: 330px;
    align-items: center;
    background: #f7f6ff;
    border-radius: 28px;
    padding: 45px 52px;
    overflow: hidden;
    position: relative;
  }

  .leftblog-hero h1 {
    font-size: clamp(38px,4vw,59px);
  }

  .leftblog-hero p {
    margin: 0;
  }

  .leftblog-hero__art {
    width: 310px;
    height: 260px;
    justify-self: center;
    transform: rotate(6deg);
    border: 9px solid #fff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 25px 60px #171c2e12;
  }

  .leftblog-hero__art img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
  }

  .leftblog-layout {
    display: grid;
    grid-template-columns: 275px minmax(0,1fr);
    gap: 54px;
    align-items: start;
    padding: 70px 0 100px;
  }

  .leftblog-aside__inside {
    position: sticky;
    top: 25px;
  }

  .leftblog-aside h2 {
    font-size: 28px;
    font-weight: 800;
    line-height: 1.18;
    margin: 15px 0 23px;
  }

  .leftblog-search {
    padding: 11px 14px;
    border-radius: 10px;
  }

  .leftblog-filters {
    margin: 24px 0 35px;
    display: flex;
    flex-direction: column;
    gap: 3px;
  }

  .leftblog-aside__feature {
    background: #171c2e;
    padding: 27px 23px;
    border-radius: 17px;
    color: #fff;
  }

  .leftblog-aside__feature>span {
    font-size: 10px;
    letter-spacing: .12em;
    color: #bcb5ff;
    font-weight: 800;
  }

  .leftblog-aside__feature h3 {
    font-size: 24px;
    line-height: 1.22;
    color: #fff;
    margin: 15px 0 12px;
    font-weight: 800;
  }

  .leftblog-aside__feature p {
    font-size: 12px;
    line-height: 1.8;
    color: #c0c4d6;
  }

  .leftblog-aside__feature a {
    font-size: 12px;
    color: #d2ceff;
    font-weight: 800;
    text-decoration: none;
  }

  .leftblog-results__title {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 12px;
    margin-bottom: 29px;
  }

  .leftblog-results__title h2 {
    font-weight: 800;
    font-size: clamp(29px,3vw,42px);
    margin: 12px 0 0;
  }

  .leftblog-results__title>span {
    color: #81879b;
    font-size: 11px;
    font-weight: 800;
  }

  .leftblog-layout .journal-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 36px 22px;
  }

  .leftblog-layout .journal-card__image {
    aspect-ratio: 1.35/1;
  }

  .leftblog-layout .journal-card h3 {
    font-size: 21px;
  }

  .leftblog-layout .journal-no-results[hidden] {
    display: none;
  }

  @media (max-width:1100px) {
    .brand-hero__art {
      padding: 18px 20px;
    }

    .brand-hero__offset {
      width: 42%;
    }

    .voices-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .faq-layout {
      gap: 36px;
    }

    .leftblog-layout {
      gap: 30px;
    }

    .leftblog-hero {
      grid-template-columns: 1fr 260px;
    }

    .leftblog-hero__art {
      width: 240px;
      height: 240px;
    }

    .brand-values__grid article {
      padding: 27px;
    }
  }

  @media (max-width:820px) {
    .brand-hero {
      grid-template-columns: 1fr;
      gap: 20px;
      padding: 43px 0 65px;
      min-height: 0;
    }

    .brand-hero__copy {
      max-width: 730px;
    }

    .brand-hero__micro {
      margin-top: 35px;
    }

    .brand-hero__art {
      width: min(100%,575px);
      min-height: 500px;
      margin: 0 auto;
    }

    .brand-hero__image {
      height: 465px;
    }

    .brand-story {
      grid-template-columns: 1fr;
      gap: 25px;
      padding: 55px 0 80px;
    }

    .brand-story__label {
      min-height: 0;
    }

    .brand-story__motif {
      display: none;
    }

    .brand-values {
      padding: 70px 0;
    }

    .brand-values__grid {
      grid-template-columns: 1fr;
    }

    .brand-values__grid article {
      min-height: 0;
    }

    .brand-values__icon {
      margin: 14px 0;
    }

    .brand-explore {
      padding: 75px 0;
      gap: 35px;
    }

    .voices-hero {
      grid-template-columns: 1fr;
      gap: 12px;
      padding: 35px 0;
    }

    .voices-hero__graphic {
      height: 280px;
    }

    .voices-feed {
      padding: 65px 0;
    }

    .voices-feature {
      grid-template-columns: 1fr;
      gap: 30px;
      padding-bottom: 75px;
    }

    .faq-hero {
      grid-template-columns: 1fr;
      padding: 30px 0;
    }

    .faq-hero__visual {
      height: 240px;
    }

    .faq-hero__question {
      font-size: 190px;
    }

    .faq-layout {
      grid-template-columns: 1fr;
      gap: 38px;
      padding: 55px 0 80px;
    }

    .faq-sidebar {
      position: static;
    }

    .faq-filters {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
    }

    .faq-filters button {
      width: auto;
      gap: 12px;
      border: 1px solid #e8e8f0;
      padding: 11px 14px;
    }

    .faq-sidebar__assist {
      display: none;
    }

    .leftblog-layout {
      grid-template-columns: 1fr;
    }

    .leftblog-aside__inside {
      position: static;
    }

    .leftblog-filters {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 5px;
      margin: 20px 0;
    }

    .leftblog-filters button {
      width: auto;
      padding: 10px 13px;
      gap: 15px;
      border: 1px solid #eaeaf1;
    }

    .leftblog-aside__feature {
      display: none;
    }
  }

  @media (max-width:570px) {
    .brand-hero h1,
    .voices-hero h1,
    .faq-hero h1 {
      font-size: 43px;
    }

    .brand-hero__copy>p,
    .voices-hero p,
    .faq-hero p {
      font-size: 14px;
    }

    .brand-hero__art {
      min-height: 355px;
      padding: 10px 10px 0;
    }

    .brand-hero__image {
      width: 82%;
      height: 340px;
      border-width: 6px;
      border-radius: 120px 120px 18px 18px;
    }

    .brand-hero__offset {
      width: 42%;
      height: 155px;
      border-width: 6px;
    }

    .brand-hero__art-label {
      display: none;
    }

    .brand-story h2,
    .brand-values h2,
    .brand-explore h2,
    .voices-feature h2,
    .voices-feed h2 {
      font-size: 36px;
    }

    .brand-story p {
      font-size: 14px;
    }

    .brand-values__heading {
      align-items: start;
      flex-direction: column;
    }

    .brand-explore {
      grid-template-columns: 1fr;
    }

    .brand-explore__photo {
      height: 310px;
    }

    .brand-explore__links {
      grid-template-columns: 1fr 1fr;
      gap: 0 12px;
    }

    .brand-explore__links a {
      font-size: 11px;
    }

    .v19-endcap {
      flex-direction: column;
      align-items: flex-start;
      padding: 30px!important;
      margin-bottom: 55px!important;
    }

    .voices-hero__graphic {
      height: 250px;
    }

    .voices-hero__mark {
      font-size: 230px;
    }

    .voices-hero__tile {
      font-size: 11px;
    }

    .voices-hero__tile.one {
      top: 40px;
    }

    .voices-hero__tile.two {
      bottom: 30px;
    }

    .voices-feed__heading {
      align-items: start;
      flex-direction: column;
    }

    .voices-grid {
      grid-template-columns: 1fr;
    }

    .voices-card {
      min-height: 0;
    }

    .voices-feature__visual {
      height: 260px;
    }

    .faq-hero__visual {
      height: 180px;
    }

    .faq-hero__question {
      font-size: 143px;
    }

    .faq-body__head {
      flex-wrap: wrap;
    }

    .faq-body h2 {
      font-size: 34px;
    }

    .v19-faq summary {
      font-size: 14px;
      padding: 20px 2px;
    }

    .v19-faq__answer p {
      font-size: 13px;
    }

    .leftblog-hero {
      grid-template-columns: 1fr;
      padding: 31px 22px;
    }

    .leftblog-hero h1 {
      font-size: 39px;
    }

    .leftblog-hero p {
      font-size: 13px;
    }

    .leftblog-hero__art {
      margin-top: 24px;
      justify-self: start;
      width: 210px;
      height: 170px;
    }

    .journal-layout-switch {
      flex-wrap: wrap;
      justify-content: flex-start;
    }

    .journal-layout-switch>span {
      width: 100%;
      margin-bottom: 6px;
    }

    .leftblog-layout {
      padding: 45px 0 70px;
    }

    .leftblog-layout .journal-grid {
      grid-template-columns: 1fr;
    }

    .leftblog-results__title {
      flex-wrap: wrap;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .v19-button {
      transition: none;
    }
  }
}

/* ==================================================
   12. Customer Dashboard & Orders
================================================== */

@scope (
  html:is(
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"]
  )
) {
  .vyora-account-page {
    --ac-ink: #171c2e;
    --ac-indigo: #655ceb;
    --ac-muted: #59647d;
    --ac-line: #e8eaf3;
    --ac-soft: #f7f7fc;
    color: var(--ac-ink);
    background: #fff;
    font-family: "Manrope",system-ui,sans-serif;
  }

  .vyora-account-page .account-main {
    padding-bottom: 78px;
  }

  .vyora-account-page .account-main a {
    text-decoration: none;
  }

  .vyora-account-page button,
  .vyora-account-page input,
  .vyora-account-page select {
    font: inherit;
  }

  .vyora-account-page [hidden] {
    display: none!important;
  }

  .vyora-account-page .account-heading {
    padding: 50px 0 37px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 228px;
  }

  .vyora-account-page .account-heading h1 {
    font-size: clamp(37px,4.4vw,57px);
    line-height: 1.08;
    letter-spacing: -.064em;
    font-weight: 800;
    margin: 17px 0 15px;
  }

  .vyora-account-page .account-heading h1 em,
  .vyora-account-page .account-panel-heading h2 em {
    font-style: normal;
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-heading p {
    font-size: 14px;
    color: var(--ac-muted);
    margin: 0;
    line-height: 1.8;
  }

  .vyora-account-page .account-heading__monogram {
    width: 162px;
    height: 132px;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(145deg,#f4f2ff,#eae5ff);
    border: 1px solid #ebe8ff;
    border-radius: 25px;
    transform: rotate(5deg);
    font-size: 70px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -.1em;
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-heading__monogram span {
    letter-spacing: normal;
  }

  .vyora-account-page .account-heading__monogram small {
    position: absolute;
    bottom: 15px;
    right: 0;
    left: 0;
    text-align: center;
    font-size: 8px;
    letter-spacing: .15em;
    color: #857ccf;
  }

  .vyora-account-page .account-demo-note {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 19px;
    border: 1px solid #e5e1ff;
    background: #f8f7ff;
    border-radius: 14px;
    color: #5c6381;
    font-size: 12px;
    line-height: 1.7;
    margin-bottom: 30px;
  }

  .vyora-account-page .account-demo-note strong {
    color: #36366a;
  }

  .vyora-account-page .account-note-dot {
    color: var(--ac-indigo);
    font-size: 18px;
    line-height: 1;
  }

  .vyora-account-page .account-layout {
    display: grid;
    grid-template-columns: 266px minmax(0,1fr);
    gap: 30px;
    align-items: start;
  }

  .vyora-account-page .account-sidebar {
    border: 1px solid var(--ac-line);
    border-radius: 23px;
    padding: 25px 16px 21px;
    background: #fff;
    min-width: 0;
  }

  .vyora-account-page .account-sidebar__top {
    padding: 5px 15px 20px;
    border-bottom: 1px solid var(--ac-line);
    margin-bottom: 15px;
  }

  .vyora-account-page .account-sidebar__overline,
  .vyora-account-page .account-kicker,
  .vyora-account-page .account-caption {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-sidebar__top h2 {
    font-size: 24px;
    letter-spacing: -.045em;
    font-weight: 800;
    margin: 9px 0 7px;
  }

  .vyora-account-page .account-sidebar__top h2 span,
  .vyora-account-page .account-panel-heading h2 span {
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-sidebar__top p {
    color: #828aa1;
    font-size: 11px;
    margin: 0;
  }

  .vyora-account-page .account-menu {
    display: grid;
    gap: 6px;
  }

  .vyora-account-page .account-menu__link {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 51px;
    padding: 12px 15px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 750;
    color: #606b82!important;
    transition: color .2s,background .2s;
    position: relative;
  }

  .vyora-account-page .account-menu__link svg {
    color: #8690a7;
    flex: none;
  }

  .vyora-account-page .account-menu__link:hover {
    background: #f7f6ff!important;
    color: var(--ac-indigo)!important;
  }

  .vyora-account-page .account-menu__link:hover svg {
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-menu__link.is-active {
    color: #5049cd!important;
    background: #eeecff!important;
  }

  .vyora-account-page .account-menu__link.is-active svg {
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-menu__link.is-active::before {
    content: "";
    position: absolute;
    right: 0;
    top: 11px;
    bottom: 11px;
    width: 3px;
    border-radius: 3px;
    background: var(--ac-indigo);
  }

  .vyora-account-page .account-menu__chevron {
    margin-right: auto;
    opacity: 0;
    font-weight: 800;
  }

  .vyora-account-page .account-menu__link.is-active .account-menu__chevron,
  .vyora-account-page .account-menu__link:hover .account-menu__chevron {
    opacity: 1;
  }

  .vyora-account-page .account-menu__exit {
    margin-top: 17px;
    border-top: 1px solid var(--ac-line);
    padding-top: 20px;
    border-radius: 0;
  }

  .vyora-account-page .account-sidebar__bottom {
    border-radius: 14px;
    background: #f7f6ff;
    padding: 16px 13px;
    margin-top: 28px;
    color: #8b86ac;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .085em;
  }

  .vyora-account-page .account-sidebar__bottom strong {
    color: #4e47bb;
  }

  .vyora-account-page .account-sidebar__sparkle {
    font-size: 22px;
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-content {
    min-width: 0;
  }

  .vyora-account-page .account-panel {
    min-width: 0;
  }

  .vyora-account-page .account-panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 25px;
    min-height: 80px;
  }

  .vyora-account-page .account-panel-heading h2 {
    font-size: clamp(27px,2.8vw,36px);
    letter-spacing: -.05em;
    font-weight: 800;
    margin: 9px 0;
  }

  .vyora-account-page .account-panel-heading p {
    font-size: 12px;
    color: #6a748d;
    margin: 0;
    line-height: 1.65;
  }

  .vyora-account-page .account-sample-pill {
    font-size: 9px;
    letter-spacing: .09em;
    font-weight: 800;
    color: #6963c8;
    background: #efedff;
    border-radius: 99px;
    padding: 10px 13px;
    white-space: nowrap;
  }

  .vyora-account-page .account-snapshot {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
  }

  .vyora-account-page .account-snapshot-card {
    position: relative;
    border: 1px solid var(--ac-line);
    border-radius: 21px;
    padding: 26px 25px;
    background: #fff;
    min-height: 221px;
    box-shadow: 0 12px 27px rgba(23,28,46,.025);
  }

  .vyora-account-page .account-profile-card {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
  }

  .vyora-account-page .account-profile-card__avatar,
  .vyora-account-page .account-upload__avatar {
    width: 63px;
    height: 63px;
    border-radius: 50%;
    background: linear-gradient(140deg,#6e64f1,#c6c0ff);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -.05em;
    margin-bottom: 17px;
    overflow: hidden;
  }

  .vyora-account-page .account-profile-card__avatar img,
  .vyora-account-page .account-upload__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .vyora-account-page .account-snapshot-card h3 {
    font-weight: 800;
    letter-spacing: -.036em;
    font-size: 21px;
    margin: 8px 0;
  }

  .vyora-account-page .account-snapshot-card p {
    font-size: 12px;
    color: var(--ac-muted);
    margin: 0 0 20px;
    line-height: 1.7;
  }

  .vyora-account-page .account-link {
    font-size: 12px;
    font-weight: 800;
    color: var(--ac-indigo);
    background: transparent;
    border: 0;
    padding: 0;
    text-align: right;
    cursor: pointer;
  }

  .vyora-account-page .account-link:hover {
    text-decoration: underline;
  }

  .vyora-account-page .account-snapshot-card .account-link {
    margin-top: auto;
  }

  .vyora-account-page .account-snapshot-card__icon {
    position: absolute;
    left: 21px;
    top: 22px;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    background: #f2f0ff;
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-address-card .account-caption {
    margin-bottom: 20px;
    display: inline-block;
  }

  .vyora-account-page .account-address-card h3 {
    max-width: 80%;
  }

  .vyora-account-page .account-metrics {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 17px;
    margin: 20px 0 28px;
  }

  .vyora-account-page .account-metrics>div {
    border: 1px solid var(--ac-line);
    border-radius: 18px;
    padding: 18px;
    min-height: 100px;
    display: grid;
    grid-template-columns: 39px 1fr;
    column-gap: 12px;
    align-items: center;
  }

  .vyora-account-page .account-metric-icon {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 39px;
    height: 39px;
    border-radius: 12px;
    background: #eeecff;
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-metrics strong {
    font-size: 23px;
    font-weight: 800;
    align-self: end;
    line-height: 1.3;
    letter-spacing: -.04em;
  }

  .vyora-account-page .account-metrics small {
    font-size: 10px;
    font-weight: 650;
    align-self: start;
    color: #8790a3;
  }

  .vyora-account-page .account-surface {
    background: #fff;
    border: 1px solid var(--ac-line);
    border-radius: 21px;
    padding: 26px;
    min-width: 0;
    box-shadow: 0 12px 30px rgba(23,28,46,.022);
  }

  .vyora-account-page .account-card-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 19px;
  }

  .vyora-account-page .account-card-heading h3 {
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -.04em;
    margin: 9px 0 0;
  }

  .vyora-account-page .account-card-heading p {
    margin: 6px 0 0;
    color: #78849a;
    font-size: 12px;
  }

  .vyora-account-page .account-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .vyora-account-page .account-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 600px;
    font-size: 12px;
    color: #343c53;
  }

  .vyora-account-page .account-table thead {
    background: #f7f6ff;
  }

  .vyora-account-page .account-table th {
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .065em;
    color: #7882a1;
    font-weight: 800;
    text-align: right;
    padding: 16px 12px;
    white-space: nowrap;
  }

  .vyora-account-page .account-table td {
    padding: 18px 12px;
    border-bottom: 1px solid #f0f1f5;
    vertical-align: middle;
  }

  .vyora-account-page .account-table tbody tr:last-child td {
    border-bottom: 0;
  }

  .vyora-account-page .account-table td:first-child {
    font-weight: 800;
    color: #303950;
  }

  .vyora-account-page .account-table .account-link {
    white-space: nowrap;
    font-size: 11px;
  }

  .vyora-account-page .account-table__status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 9px;
    font-size: 10px;
    border-radius: 8px;
    font-weight: 800;
    white-space: nowrap;
  }

  .vyora-account-page .status-processing {
    color: #ad6d18;
    background: #fff1d7;
  }

  .vyora-account-page .status-on-the-way {
    color: #2c68ac;
    background: #e8f3ff;
  }

  .vyora-account-page .status-delivered {
    color: #23825d;
    background: #e1f6ea;
  }

  .vyora-account-page .account-filter-bar {
    display: flex;
    gap: 12px;
    margin-bottom: 22px;
  }

  .vyora-account-page .account-search {
    flex: 1;
  }

  .vyora-account-page .account-filter-bar input,
  .vyora-account-page .account-filter-bar select {
    min-height: 47px;
    padding: 0 13px;
    border-radius: 11px;
    border: 1px solid #e6e8f1;
    background: #fbfbff;
    color: #303a53;
    font-size: 12px;
    outline: 0;
    width: 100%;
  }

  .vyora-account-page .account-filter-bar select {
    width: 190px;
  }

  .vyora-account-page .account-muted {
    color: #7e889c;
    font-size: 13px;
    margin: 24px 0 6px;
  }

  .vyora-account-page .account-detail-card {
    padding-bottom: 17px;
  }

  .vyora-account-page .account-detail-top {
    display: grid;
    grid-template-columns: 1fr 1fr .95fr;
    gap: 14px;
    margin-top: 27px;
    margin-bottom: 26px;
  }

  .vyora-account-page .account-detail-address,
  .vyora-account-page .account-detail-summary {
    background: #f9f9ff;
    border: 1px solid #edecf9;
    border-radius: 15px;
    padding: 22px;
    min-height: 174px;
  }

  .vyora-account-page .account-detail-address strong {
    display: block;
    font-size: 14px;
    margin-top: 15px;
  }

  .vyora-account-page .account-detail-address p {
    font-size: 12px;
    color: var(--ac-muted);
    line-height: 1.85;
    margin: 9px 0 0;
  }

  .vyora-account-page .account-detail-summary dl {
    margin: 17px 0 0;
  }

  .vyora-account-page .account-detail-summary dl>div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 11px;
    font-size: 12px;
    color: #68748c;
  }

  .vyora-account-page .account-detail-summary dt {
    font-weight: 500;
  }

  .vyora-account-page .account-detail-summary dd {
    font-weight: 800;
    color: #282f44;
    margin: 0;
    text-align: left;
  }

  .vyora-account-page .account-detail-summary dl>.account-detail-summary__total {
    border-top: 1px solid #e5e5f0;
    padding-top: 12px;
    margin-top: 15px;
    font-weight: 800;
  }

  .vyora-account-page .account-detail-summary__total dd {
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-progress {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    position: relative;
    gap: 10px;
    margin: 16px 0 32px;
    padding: 8px 12px;
  }

  .vyora-account-page .account-progress:before {
    content: "";
    position: absolute;
    top: 24px;
    right: 12%;
    left: 12%;
    height: 2px;
    background: #ebeaf5;
  }

  .vyora-account-page .account-progress__step {
    position: relative;
    text-align: center;
    font-size: 11px;
    font-weight: 700;
    color: #a0a6b5;
    z-index: 1;
  }

  .vyora-account-page .account-progress__step span {
    display: grid;
    place-items: center;
    width: 35px;
    height: 35px;
    margin: 0 auto 12px;
    background: #fff;
    border: 1.5px dashed #bfc3da;
    color: #a6acc0;
    border-radius: 50%;
    font-weight: 800;
    font-size: 11px;
  }

  .vyora-account-page .account-progress__step.is-done span {
    background: var(--ac-indigo);
    border-color: var(--ac-indigo);
    color: #fff;
  }

  .vyora-account-page .account-progress__step.is-current span {
    background: #efedff;
    border: 2px solid var(--ac-indigo);
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-progress__step.is-done,
  .vyora-account-page .account-progress__step.is-current {
    color: #43446c;
  }

  .vyora-account-page .account-detail-items__heading,
  .vyora-account-page .account-detail-item {
    display: grid;
    grid-template-columns: minmax(0,1.6fr) 90px 54px 90px;
    align-items: center;
    gap: 11px;
  }

  .vyora-account-page .account-detail-items__heading {
    background: #f8f7ff;
    border-radius: 11px;
    padding: 14px 17px;
    color: #727c98;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .09em;
  }

  .vyora-account-page .account-detail-items__heading>span {
    text-align: left;
  }

  .vyora-account-page .account-detail-item {
    padding: 14px 17px;
    border-bottom: 1px solid #f0f0f5;
    font-size: 12px;
  }

  .vyora-account-page .account-detail-item:last-child {
    border-bottom: 0;
  }

  .vyora-account-page .account-detail-item>span {
    text-align: left;
    font-weight: 700;
  }

  .vyora-account-page .account-detail-product {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
  }

  .vyora-account-page .account-detail-product img {
    width: 56px;
    height: 59px;
    object-fit: contain;
    border-radius: 10px;
    background: #f0eef9;
    flex: none;
  }

  .vyora-account-page .account-detail-product a {
    font-weight: 800;
    color: #263047;
    font-size: 12px;
    line-height: 1.5;
  }

  .vyora-account-page .account-detail-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #eceef4;
    padding-top: 20px;
    margin-top: 15px;
    color: #8b93a7;
    font-size: 11px;
    line-height: 1.65;
  }

  .vyora-account-page .account-detail-bottom a {
    color: var(--ac-indigo);
    font-weight: 800;
    white-space: nowrap;
  }

  .vyora-account-page .account-wishlist-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 16px;
  }

  .vyora-account-page .account-wishlist-item {
    display: grid;
    grid-template-columns: 100px minmax(0,1fr);
    gap: 14px;
    border: 1px solid #e8eaf2;
    border-radius: 16px;
    padding: 14px;
    min-width: 0;
  }

  .vyora-account-page .account-wishlist-image {
    width: 100px;
    height: 118px;
    background: #f3f2fa;
    display: grid;
    place-items: center;
    border-radius: 12px;
    overflow: hidden;
  }

  .vyora-account-page .account-wishlist-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .vyora-account-page .account-wishlist-info {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .vyora-account-page .account-wishlist-info small {
    color: var(--ac-indigo);
    font-weight: 800;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .08em;
  }

  .vyora-account-page .account-wishlist-info a {
    font-size: 12px;
    font-weight: 800;
    color: #252f45;
    line-height: 1.55;
    margin: 7px 0;
  }

  .vyora-account-page .account-wishlist-info strong {
    font-size: 13px;
  }

  .vyora-account-page .account-wishlist-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 9px;
  }

  .vyora-account-page .account-wishlist-actions button {
    border: 1px solid #e4e4ee;
    background: #fff;
    border-radius: 8px;
    padding: 7px 9px;
    font-size: 10px;
    font-weight: 800;
    color: #615cc2;
  }

  .vyora-account-page .account-wishlist-actions button:first-child {
    background: #655ceb;
    color: #fff;
    border-color: #655ceb;
  }

  .vyora-account-page .account-wishlist-empty {
    padding: 75px 20px;
    text-align: center;
  }

  .vyora-account-page .account-wishlist-empty__icon {
    color: var(--ac-indigo);
    background: #eeecff;
    width: 70px;
    height: 70px;
    display: grid;
    place-items: center;
    border-radius: 20px;
    margin: 0 auto 22px;
  }

  .vyora-account-page .account-wishlist-empty h3 {
    font-weight: 800;
    font-size: 23px;
    letter-spacing: -.04em;
  }

  .vyora-account-page .account-wishlist-empty p {
    font-size: 13px;
    line-height: 1.7;
    color: var(--ac-muted);
    max-width: 340px;
    margin: 10px auto 25px;
  }

  .vyora-account-page .account-cta {
    display: inline-flex;
    gap: 13px;
    align-items: center;
    justify-content: center;
    border: none;
    background: var(--ac-indigo);
    color: #fff!important;
    font-size: 12px;
    font-weight: 800;
    padding: 15px 20px;
    border-radius: 12px;
    cursor: pointer;
  }

  .vyora-account-page .account-cta:hover {
    background: #5048d5;
  }

  .vyora-account-page .account-settings-card {
    margin-bottom: 20px;
  }

  .vyora-account-page .account-settings-form {
    display: grid;
    grid-template-columns: minmax(0,1fr) 175px;
    gap: 24px;
  }

  .vyora-account-page .account-settings-fields {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 17px;
    align-self: start;
  }

  .vyora-account-page .account-field {
    min-width: 0;
  }

  .vyora-account-page .account-field--wide {
    grid-column: 1/-1;
  }

  .vyora-account-page .account-field label {
    display: block;
    font-size: 12px;
    font-weight: 800;
    color: #3e4760;
    margin: 0 0 9px;
  }

  .vyora-account-page .account-field label small {
    font-size: 10px;
    font-weight: 600;
    color: #828ba0;
  }

  .vyora-account-page .account-field input {
    border: 1px solid #e5e7f0;
    border-radius: 10px;
    height: 49px;
    padding: 0 14px;
    background: #fcfcff;
    outline: none;
    width: 100%;
    font-size: 12px;
    color: #343d58;
  }

  .vyora-account-page .account-field input:focus,
  .vyora-account-page .account-filter-bar :focus-visible {
    border-color: #a39bff;
    box-shadow: 0 0 0 3px rgba(101,92,235,.11);
  }

  .vyora-account-page .account-upload {
    grid-column: 2;
    grid-row: 1/3;
    border-radius: 16px;
    background: #f9f8ff;
    border: 1px solid #eeecfb;
    display: flex;
    align-items: center;
    text-align: center;
    flex-direction: column;
    padding: 23px 12px 17px;
    align-self: start;
  }

  .vyora-account-page .account-upload__avatar {
    width: 94px;
    height: 94px;
    font-size: 31px;
    margin-bottom: 15px;
  }

  .vyora-account-page .account-upload strong {
    font-size: 12px;
    font-weight: 800;
  }

  .vyora-account-page .account-upload>span,
  .vyora-account-page .account-upload>small {
    font-size: 10px;
    color: #838ba4;
    line-height: 1.5;
    margin-top: 6px;
  }

  .vyora-account-page .account-upload__button {
    border-radius: 9px;
    background: #eeebff;
    color: #6158cb;
    font-weight: 800;
    font-size: 11px;
    padding: 10px 16px;
    margin-top: 14px;
    cursor: pointer;
  }

  .vyora-account-page .account-upload input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
  }

  .vyora-account-page .account-settings-actions {
    grid-column: 1/-1;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 4px;
  }

  .vyora-account-page .account-form-status {
    color: #40775b;
    font-size: 11px;
    line-height: 1.6;
    font-weight: 800;
    max-width: 400px;
  }

  .vyora-account-page .account-security-notice {
    background: #f7f7fe;
    border: 1px solid #e9e8f8;
    padding: 20px;
    border-radius: 14px;
    display: flex;
    align-items: flex-start;
    gap: 15px;
    color: var(--ac-indigo);
  }

  .vyora-account-page .account-security-notice strong {
    font-size: 13px;
    color: #222a46;
  }

  .vyora-account-page .account-security-notice p {
    font-size: 12px;
    line-height: 1.8;
    color: #68748b;
    margin: 7px 0 0;
  }

  .vyora-account-page .account-footer-note {
    max-width: 1150px;
    margin: 39px auto 0;
    padding: 0 20px;
    color: #7b839b;
    text-align: center;
    font-size: 11px;
    line-height: 1.8;
  }

  @media (max-width:1120px) {
    .vyora-account-page .account-layout {
      grid-template-columns: 230px minmax(0,1fr);
      gap: 19px;
    }

    .vyora-account-page .account-metrics {
      gap: 9px;
    }

    .vyora-account-page .account-metrics>div {
      padding: 13px;
      grid-template-columns: 32px 1fr;
    }

    .vyora-account-page .account-metric-icon {
      width: 32px;
      height: 32px;
    }

    .vyora-account-page .account-detail-top {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .vyora-account-page .account-detail-summary {
      grid-column: 1/-1;
    }

    .vyora-account-page .account-wishlist-grid {
      grid-template-columns: 1fr;
    }
  }

  @media (max-width:900px) {
    .vyora-account-page .account-layout {
      grid-template-columns: 1fr;
    }

    .vyora-account-page .account-sidebar {
      padding: 16px;
      border-radius: 19px;
    }

    .vyora-account-page .account-sidebar__top {
      padding: 4px 10px 14px;
    }

    .vyora-account-page .account-sidebar__top p {
      display: none;
    }

    .vyora-account-page .account-sidebar__bottom {
      display: none;
    }

    .vyora-account-page .account-menu {
      display: flex;
      gap: 9px;
      overflow-x: auto;
      padding-bottom: 4px;
      scrollbar-width: thin;
    }

    .vyora-account-page .account-menu__link {
      white-space: nowrap;
      min-height: 42px;
      gap: 8px;
      padding: 10px 13px;
      flex: 0 0 auto;
    }

    .vyora-account-page .account-menu__link.is-active:before {
      display: none;
    }

    .vyora-account-page .account-menu__chevron {
      display: none;
    }

    .vyora-account-page .account-menu__exit {
      margin-top: 0;
      border-top: 0;
      padding-top: 10px;
      border-radius: 12px;
    }

    .vyora-account-page .account-heading {
      padding-top: 30px;
      min-height: 200px;
    }
  }

  @media (max-width:640px) {
    .vyora-account-page .account-main {
      padding-bottom: 50px;
    }

    .vyora-account-page .account-heading {
      padding: 20px 0 25px;
      min-height: auto;
    }

    .vyora-account-page .account-heading h1 {
      font-size: 38px;
      margin: 13px 0 11px;
    }

    .vyora-account-page .account-heading p {
      font-size: 12px;
    }

    .vyora-account-page .account-heading__monogram {
      display: none;
    }

    .vyora-account-page .account-demo-note {
      font-size: 11px;
      padding: 12px 14px;
    }

    .vyora-account-page .account-panel-heading {
      align-items: flex-start;
      min-height: 0;
      flex-wrap: wrap;
    }

    .vyora-account-page .account-panel-heading h2 {
      font-size: 29px;
    }

    .vyora-account-page .account-panel-heading p {
      font-size: 11px;
    }

    .vyora-account-page .account-snapshot {
      grid-template-columns: 1fr;
    }

    .vyora-account-page .account-snapshot-card {
      min-height: 180px;
      padding: 22px;
    }

    .vyora-account-page .account-metrics {
      grid-template-columns: repeat(3,minmax(0,1fr));
      gap: 8px;
    }

    .vyora-account-page .account-metrics>div {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      min-height: 100px;
      gap: 5px;
      padding: 12px;
    }

    .vyora-account-page .account-metrics strong {
      font-size: 21px;
      align-self: flex-start;
    }

    .vyora-account-page .account-metrics small {
      font-size: 9px;
    }

    .vyora-account-page .account-surface {
      padding: 18px;
      border-radius: 16px;
    }

    .vyora-account-page .account-card-heading h3 {
      font-size: 19px;
    }

    .vyora-account-page .account-detail-top {
      grid-template-columns: 1fr;
    }

    .vyora-account-page .account-detail-summary {
      grid-column: auto;
    }

    .vyora-account-page .account-progress {
      padding: 8px 0;
      gap: 3px;
    }

    .vyora-account-page .account-progress__step {
      font-size: 9px;
    }

    .vyora-account-page .account-progress__step span {
      width: 31px;
      height: 31px;
    }

    .vyora-account-page .account-progress:before {
      right: 11%;
      left: 11%;
      top: 23px;
    }

    .vyora-account-page .account-detail-items__heading,
    .vyora-account-page .account-detail-item {
      grid-template-columns: minmax(0,1fr) 48px 37px 58px;
      padding-right: 8px;
      padding-left: 8px;
      gap: 4px;
    }

    .vyora-account-page .account-detail-product {
      gap: 7px;
    }

    .vyora-account-page .account-detail-product img {
      width: 35px;
      height: 42px;
    }

    .vyora-account-page .account-detail-product a {
      font-size: 10px;
    }

    .vyora-account-page .account-detail-items__heading {
      font-size: 8px;
    }

    .vyora-account-page .account-detail-item>span {
      font-size: 10px;
    }

    .vyora-account-page .account-settings-form {
      grid-template-columns: 1fr;
    }

    .vyora-account-page .account-upload {
      grid-column: 1;
      grid-row: 2;
    }

    .vyora-account-page .account-settings-fields {
      grid-template-columns: 1fr;
    }

    .vyora-account-page .account-field--wide {
      grid-column: auto;
    }

    .vyora-account-page .account-filter-bar {
      flex-wrap: wrap;
    }

    .vyora-account-page .account-filter-bar select {
      width: 100%;
    }

    .vyora-account-page .account-footer-note {
      margin-top: 23px;
    }
  }

  @media (max-width:380px) {
    .vyora-account-page .account-wishlist-item {
      grid-template-columns: 75px minmax(0,1fr);
      gap: 9px;
      padding: 10px;
    }

    .vyora-account-page .account-wishlist-image {
      width: 75px;
      height: 90px;
    }

    .vyora-account-page .account-sample-pill {
      font-size: 8px;
      padding: 8px 11px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .vyora-account-page * {
      scroll-behavior: auto!important;
      transition: none!important;
    }
  }

  @media (max-width:640px) {
    .vyora-account-page .account-menu {
      display: grid;
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 6px;
      overflow: visible;
    }

    .vyora-account-page .account-menu__link {
      min-width: 0;
      white-space: normal;
      font-size: 11px;
      padding: 9px 10px;
      line-height: 1.5;
    }

    .vyora-account-page .account-menu__link svg {
      width: 18px;
      height: 18px;
    }

    .vyora-account-page .account-table-container {
      overflow: visible;
    }

    .vyora-account-page .account-table {
      display: block;
      width: 100%;
      min-width: 0;
    }

    .vyora-account-page .account-table thead {
      display: none;
    }

    .vyora-account-page .account-table tbody {
      display: grid;
      gap: 12px;
    }

    .vyora-account-page .account-table tbody tr {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      border: 1px solid #e8eaf3;
      border-radius: 13px;
      padding: 14px;
    }

    .vyora-account-page .account-table tbody td {
      display: flex;
      min-width: 0;
      flex-direction: column;
      gap: 4px;
      border: 0;
      padding: 0;
      font-size: 11px;
    }

    .vyora-account-page .account-table tbody td:before {
      content: attr(data-label);
      display: block;
      color: #8890ab;
      font-size: 9px;
      font-weight: 800;
      letter-spacing: .06em;
      text-transform: uppercase;
    }

    .vyora-account-page .account-table tbody td:last-child {
      align-self: end;
    }
  }

  .vyora-account-page .order-breadcrumb {
    padding-bottom: 14px;
  }

  .vyora-account-page .account-layout {
    margin-top: 20px;
    grid-template-columns: 248px minmax(0,1fr);
    gap: 26px;
  }

  .vyora-account-page .account-sidebar {
    border-color: #e6e8f2;
    padding: 22px 15px;
    border-radius: 19px;
    box-shadow: 0 12px 32px rgba(23,28,46,.034);
  }

  .vyora-account-page .account-sidebar__top {
    padding: 4px 14px 18px;
  }

  .vyora-account-page .account-sidebar__top h2 {
    font-size: 22px;
    margin: 9px 0 1px;
  }

  .vyora-account-page .account-menu {
    gap: 5px;
  }

  .vyora-account-page .account-menu__link {
    font-size: 13px;
    min-height: 50px;
    padding: 11px 14px;
    font-weight: 750;
  }

  .vyora-account-page .account-menu__link:focus-visible {
    outline: 2px solid #655ceb;
    outline-offset: 3px;
  }

  .vyora-account-page .account-panel-heading {
    margin-bottom: 22px;
    min-height: 62px;
  }

  .vyora-account-page .account-panel-heading h2 {
    font-size: clamp(29px,2.7vw,36px);
    margin: 5px 0;
  }

  .vyora-account-page .account-panel-heading p {
    font-size: 13px;
    line-height: 1.75;
    color: #5d6680;
  }

  .vyora-account-page .account-caption,
  .vyora-account-page .account-sidebar__overline,
  .vyora-account-page .account-kicker {
    font-size: 11px;
  }

  .vyora-account-page .account-snapshot-card {
    border-radius: 18px;
    box-shadow: 0 10px 28px rgba(23,28,46,.04);
  }

  .vyora-account-page .account-surface {
    border-radius: 18px;
    box-shadow: 0 12px 30px rgba(23,28,46,.032);
  }

  .vyora-account-page .account-card-heading h3 {
    font-size: 22px;
  }

  .vyora-account-page .account-snapshot-card p,
  .vyora-account-page .account-card-heading p {
    font-size: 13px;
    color: #59647d;
  }

  .vyora-account-page .account-metrics small {
    font-size: 11px;
    color: #67728c;
  }

  .vyora-account-page .account-table {
    font-size: 13px;
  }

  .vyora-account-page .account-table th {
    font-size: 11px;
  }

  .vyora-account-page .account-link {
    font-size: 13px;
  }

  .vyora-account-page .account-table .account-link {
    font-size: 12px;
  }

  .vyora-account-page .account-field input {
    font-size: 13px;
  }

  .vyora-account-page .account-footer-note {
    margin-top: 28px;
    text-align: right;
    max-width: 1280px;
    padding-inline: 22px;
    color: #737c94;
  }

  .vyora-account-page .account-signout-card {
    padding: 45px;
    max-width: 760px;
  }

  .vyora-account-page .account-signout-icon {
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    background: #eeecff;
    color: #655ceb;
    font-weight: 800;
    font-size: 32px;
    border-radius: 18px;
    margin-bottom: 22px;
  }

  .vyora-account-page .account-signout-card h3 {
    font-size: 27px;
    font-weight: 800;
    letter-spacing: -.04em;
    margin-bottom: 12px;
  }

  .vyora-account-page .account-signout-card p {
    color: #59647d;
    line-height: 1.85;
    max-width: 530px;
    margin-bottom: 25px;
  }

  .vyora-account-page .account-signout-actions {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
  }

  .vyora-account-page .account-secondary-cta {
    color: #5d55d7;
    font-weight: 800;
    font-size: 13px;
    padding: 13px 18px;
  }

  @media (max-width:1100px) {
    .vyora-account-page .account-layout {
      grid-template-columns: 215px minmax(0,1fr);
      gap: 18px;
    }
  }

  @media (max-width:900px) {
    .vyora-account-page .account-layout {
      grid-template-columns: 1fr;
      margin-top: 12px;
    }

    .vyora-account-page .account-sidebar {
      padding: 14px;
    }

    .vyora-account-page .account-panel-heading {
      margin-top: 4px;
    }
  }

  @media (max-width:640px) {
    .vyora-account-page .account-layout {
      gap: 20px;
    }

    .vyora-account-page .account-menu__link {
      font-size: 12px;
    }

    .vyora-account-page .account-sidebar__top h2 {
      font-size: 19px;
    }

    .vyora-account-page .account-signout-card {
      padding: 26px;
    }

    .vyora-account-page .account-footer-note {
      font-size: 10px;
    }
  }
}

/* ==================================================
   13. Checkout Confirmation
================================================== */

@scope (
  html:is(
    [data-vyora-page="confirmation.html"]
  )
) {
  .page-confirmation {
    --c-ink: #171c2e;
    --c-purple: #655ceb;
    --c-muted: #59647c;
    --c-rule: #e9e9f3;
  }

  .page-confirmation [hidden] {
    display: none!important;
  }

  .confirmation-main {
    padding-bottom: 90px;
  }

  .page-confirmation .order-steps {
    margin-bottom: 28px;
  }

  .page-confirmation .order-steps [data-step="bag"],
  .page-confirmation .order-steps [data-step="checkout"] {
    color: #545d74;
  }

  .page-confirmation .order-steps [data-step="bag"]>span,
  .page-confirmation .order-steps [data-step="checkout"]>span {
    background: #ecebff;
    color: #655ceb;
  }

  .confirmation-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1.16fr) minmax(290px,.84fr);
    align-items: center;
    gap: 42px;
    min-height: 407px;
    background: linear-gradient(115deg,#f8f8fd 4%,#ece9ff 100%);
    padding: 58px clamp(30px,5.5vw,90px);
    border-radius: 29px;
    overflow: hidden;
    isolation: isolate;
  }

  .confirmation-hero__copy {
    position: relative;
    z-index: 2;
    max-width: 660px;
  }

  .confirmation-eyebrow {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    color: #5950cc;
    font-weight: 800;
    font-size: 11px;
    letter-spacing: .14em;
  }

  .confirmation-eyebrow span {
    font-size: 18px;
    line-height: 1;
  }

  .confirmation-hero h1 {
    font-size: clamp(39px,4.3vw,66px);
    font-weight: 800;
    letter-spacing: -.07em;
    line-height: 1.12;
    margin: 21px 0 19px;
    max-width: 700px;
  }

  .confirmation-hero h1 em {
    font-style: normal;
    color: #655ceb;
  }

  .confirmation-hero__lead {
    font-size: 15px;
    color: #535e79;
    line-height: 1.85;
    font-weight: 500;
    margin: 0;
    max-width: 575px;
  }

  .confirmation-hero__lead strong {
    color: #323953;
    font-weight: 800;
  }

  .confirmation-hero__actions,
  .confirmation-empty__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
    margin-top: 28px;
  }

  .confirmation-primary-link {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 22px;
    background: #171c2e;
    color: #fff!important;
    border-radius: 13px;
    padding: 16px 24px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
    min-height: 51px;
    transition: transform .2s,background .2s;
  }

  .confirmation-primary-link:hover {
    background: #31386a;
    transform: translateY(-2px);
  }

  .confirmation-plain-link {
    font-size: 13px;
    font-weight: 800;
    color: #5148bf!important;
    text-decoration: none;
  }

  .confirmation-plain-link:hover {
    text-decoration: underline;
    text-underline-offset: 5px;
  }

  .confirmation-hero__art {
    min-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
  }

  .confirmation-halo {
    width: 370px;
    height: 370px;
    position: absolute;
    right: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    background: linear-gradient(145deg,#dbd6ff,#f8f8ff);
    border: 1px solid #dfdbfb;
    box-shadow: 0 0 0 30px #e9e6fc55;
  }

  .confirmation-visual-card {
    background: #fff;
    position: relative;
    transform: rotate(8deg);
    width: min(285px,100%);
    height: 295px;
    border-radius: 22px;
    padding: 25px;
    box-shadow: 0 30px 75px rgba(63,54,126,.17);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid #eeeef7;
  }

  .confirmation-visual-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .confirmation-visual-card__monogram {
    font-weight: 800;
    font-size: 29px;
    letter-spacing: -.1em;
    color: #171c2e;
  }

  .confirmation-visual-card__monogram span {
    color: #655ceb;
  }

  .confirmation-visual-card__dot {
    color: #655ceb;
    font-size: 30px;
  }

  .confirmation-visual-card__lines {
    display: grid;
    gap: 13px;
  }

  .confirmation-visual-card__lines b {
    height: 18px;
    width: 62%;
    background: #e3dfff;
    border-radius: 8px;
  }

  .confirmation-visual-card__lines i {
    height: 9px;
    width: 85%;
    background: #eceef7;
    border-radius: 8px;
  }

  .confirmation-visual-card__lines i:nth-of-type(2) {
    width: 73%;
  }

  .confirmation-visual-card__lines em {
    height: 9px;
    width: 48%;
    background: #eceef7;
    border-radius: 8px;
  }

  .confirmation-visual-card__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #eeeef7;
    padding-top: 14px;
    font-size: 9px;
    color: #807baa;
    font-weight: 800;
    letter-spacing: .13em;
  }

  .confirmation-visual-card__bottom span {
    font-size: 19px;
    color: #655ceb;
  }

  .confirmation-visual-sticker {
    position: absolute;
    z-index: 1;
    right: 7%;
    bottom: 10%;
    background: #171c2e;
    color: #fff;
    border-radius: 11px;
    transform: rotate(-8deg);
    padding: 16px 20px;
    font-weight: 800;
    letter-spacing: .12em;
    font-size: 9px;
    box-shadow: 0 14px 30px rgba(23,28,46,.12);
  }

  .confirmation-visual-sticker span {
    color: #aea5ff;
    margin-right: 9px;
  }

  .confirmation-disclaimer {
    margin-top: 28px;
    margin-bottom: 67px;
    border: 1px solid #ddd9fa;
    background: #f8f7ff;
    border-radius: 17px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 19px 22px;
  }

  .confirmation-disclaimer__icon {
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    border-radius: 10px;
    background: #e9e6ff;
    display: grid;
    place-items: center;
    color: #574bd2;
    font-size: 18px;
    font-weight: 800;
  }

  .confirmation-disclaimer p {
    font-size: 13px;
    line-height: 1.8;
    color: #555f79;
    margin: 0;
  }

  .confirmation-disclaimer strong {
    color: #28314d;
  }

  .confirmation-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 25px;
  }

  .confirmation-section-heading h1 {
    font-size: clamp(28px,3.3vw,41px);
    letter-spacing: -.06em;
    font-weight: 800;
    margin: 10px 0 8px;
  }

  .confirmation-section-heading h1 em {
    color: #655ceb;
    font-style: normal;
  }

  .confirmation-timestamp {
    font-size: 12px;
    color: #737d94;
    margin: 0;
    font-weight: 600;
  }

  .confirmation-print {
    border: 1px solid #e2e2ee;
    background: #fff;
    border-radius: 12px;
    padding: 12px 16px;
    color: #353a57;
    font-weight: 800;
    font-size: 12px;
  }

  .confirmation-print:hover {
    border-color: #655ceb;
    color: #655ceb;
  }

  .confirmation-print span {
    margin-left: 8px;
    font-size: 17px;
  }

  .confirmation-grid {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(290px,360px);
    gap: 25px;
    align-items: start;
  }

  .confirmation-products,
  .confirmation-totals {
    border: 1px solid var(--c-rule);
    border-radius: 24px;
    background: #fff;
    padding: 30px;
    min-width: 0;
  }

  .confirmation-totals {
    background: #f8f8fd;
  }

  .confirmation-panel-heading {
    display: flex;
    gap: 10px;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--c-rule);
    padding-bottom: 21px;
  }

  .confirmation-panel-heading h3 {
    margin: 0;
    font-size: 20px;
    letter-spacing: -.045em;
    font-weight: 800;
  }

  .confirmation-panel-heading>span {
    color: #655ceb;
    background: #eeecff;
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
  }

  .confirmation-product {
    display: grid;
    grid-template-columns: 86px minmax(0,1fr) auto;
    gap: 17px;
    align-items: center;
    padding: 21px 0;
    border-bottom: 1px solid var(--c-rule);
  }

  .confirmation-product__image {
    width: 86px;
    height: 91px;
    background: #f5f4fb;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 15px;
    overflow: hidden;
  }

  .confirmation-product__image img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }

  .confirmation-product__name {
    font-size: 14px;
    font-weight: 800;
    color: #232941;
    text-decoration: none;
  }

  .confirmation-product__name:hover {
    color: #655ceb;
  }

  .confirmation-product__meta {
    margin-top: 7px;
    color: #69738d;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.6;
  }

  .confirmation-product__price {
    font-size: 14px;
    font-weight: 800;
    color: #1b2135;
    white-space: nowrap;
  }

  .confirmation-products__footer {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 23px;
    font-size: 12px;
    color: #6b748b;
  }

  .confirmation-products__footer a {
    color: #5750cc;
    text-decoration: none;
    font-weight: 800;
  }

  .confirmation-totals h3 {
    font-size: 25px;
    letter-spacing: -.06em;
    margin: 9px 0 30px;
    font-weight: 800;
  }

  .confirmation-total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    font-size: 13px;
    margin: 18px 0;
    color: #58627a;
  }

  .confirmation-total-row strong {
    color: #171c2e;
    white-space: nowrap;
    font-size: 14px;
  }

  .confirmation-total-divider {
    border-top: 1px solid #dcdeee;
    margin: 30px 0 24px;
  }

  .confirmation-estimated {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
  }

  .confirmation-estimated span {
    font-size: 14px;
    font-weight: 800;
  }

  .confirmation-estimated strong {
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -.04em;
    white-space: nowrap;
  }

  .confirmation-totals__note {
    font-size: 11px;
    line-height: 1.75;
    color: #66728b;
    background: #fff;
    border: 1px solid #ebebf5;
    border-radius: 12px;
    padding: 13px;
    margin: 21px 0;
  }

  .confirmation-edit-link {
    display: flex;
    justify-content: space-between;
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
    color: #5149d2;
    padding: 13px 0;
  }

  .confirmation-edit-link:hover {
    color: #171c2e;
  }

  .confirmation-info-strip {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 13px;
    margin-top: 23px;
  }

  .confirmation-info-strip>div {
    display: flex;
    gap: 13px;
    align-items: start;
    border: 1px solid #ededf5;
    border-radius: 17px;
    padding: 21px 17px;
  }

  .confirmation-info-strip>div>span {
    width: 34px;
    height: 34px;
    border-radius: 11px;
    flex: 0 0 34px;
    display: grid;
    place-items: center;
    background: #efedff;
    color: #655ceb;
    font-size: 22px;
  }

  .confirmation-info-strip strong {
    font-size: 12px;
    font-weight: 800;
  }

  .confirmation-info-strip p {
    font-size: 11px;
    color: #65718b;
    line-height: 1.7;
    margin: 5px 0 0;
  }

  .confirmation-empty {
    text-align: center;
    border: 1px solid #e7e4fb;
    background: #faf9ff;
    padding: 65px 28px;
    border-radius: 26px;
    max-width: 960px;
  }

  .confirmation-empty__symbol {
    width: 78px;
    height: 78px;
    border-radius: 22px;
    background: #eae7ff;
    color: #655ceb;
    font-size: 43px;
    display: grid;
    place-items: center;
    margin: 0 auto 22px;
  }

  .confirmation-empty h1 {
    font-size: clamp(30px,3.7vw,47px);
    letter-spacing: -.07em;
    font-weight: 800;
    margin: 14px 0;
  }

  .confirmation-empty h1 em {
    font-style: normal;
    color: #655ceb;
  }

  .confirmation-empty p {
    color: #626d83;
    font-size: 14px;
    line-height: 1.8;
    max-width: 590px;
    margin: 0 auto;
  }

  .confirmation-empty__actions {
    justify-content: center;
  }

  @media (max-width:1000px) {
    .confirmation-hero {
      grid-template-columns: minmax(0,1fr) 280px;
      gap: 17px;
      padding: 50px 36px;
    }

    .confirmation-halo {
      width: 280px;
      height: 280px;
    }

    .confirmation-visual-card {
      width: 220px;
      height: 260px;
    }

    .confirmation-visual-sticker {
      right: 0;
    }

    .confirmation-grid {
      grid-template-columns: 1fr;
    }

    .confirmation-totals {
      max-width: none;
    }
  }

  @media (max-width:700px) {
    .page-confirmation .order-steps {
      margin-bottom: 18px;
    }

    .confirmation-hero {
      grid-template-columns: 1fr;
      padding: 34px 25px 25px;
      min-height: auto;
      gap: 12px;
      border-radius: 22px;
    }

    .confirmation-hero h1 {
      font-size: clamp(35px,9vw,49px);
      margin: 18px 0 14px;
    }

    .confirmation-hero__lead {
      font-size: 13px;
    }

    .confirmation-hero__actions {
      margin-top: 21px;
      gap: 18px;
    }

    .confirmation-hero__art {
      min-height: 225px;
    }

    .confirmation-halo {
      width: 220px;
      height: 220px;
    }

    .confirmation-visual-card {
      width: 180px;
      height: 205px;
      padding: 16px;
    }

    .confirmation-visual-card__lines {
      gap: 8px;
    }

    .confirmation-visual-card__bottom {
      font-size: 7px;
    }

    .confirmation-visual-sticker {
      font-size: 8px;
      right: 16%;
      bottom: 0;
      padding: 12px 16px;
    }

    .confirmation-disclaimer {
      margin-top: 19px;
      margin-bottom: 39px;
      padding: 16px;
      gap: 12px;
    }

    .confirmation-disclaimer p {
      font-size: 11px;
    }

    .confirmation-section-heading {
      flex-wrap: wrap;
    }

    .confirmation-products,
    .confirmation-totals {
      padding: 21px;
      border-radius: 18px;
    }

    .confirmation-product {
      grid-template-columns: 65px minmax(0,1fr) auto;
      gap: 11px;
    }

    .confirmation-product__image {
      width: 65px;
      height: 72px;
    }

    .confirmation-product__name {
      font-size: 12px;
    }

    .confirmation-product__price {
      font-size: 12px;
    }

    .confirmation-info-strip {
      grid-template-columns: 1fr;
    }

    .confirmation-print {
      padding: 10px 12px;
    }

    .confirmation-empty {
      padding: 42px 17px;
    }
  }

  @media (max-width:360px) {
    .confirmation-hero {
      padding: 25px 19px;
    }

    .confirmation-hero h1 {
      font-size: 34px;
    }

    .confirmation-product {
      grid-template-columns: 60px minmax(0,1fr);
      position: relative;
    }

    .confirmation-product__price {
      grid-column: 2;
      margin-top: -10px;
    }

    .confirmation-hero__actions {
      gap: 12px;
    }
  }

  @media print {
    .site-header,
    .site-footer,
    .confirmation-hero__actions,
    .confirmation-info-strip,
    .confirmation-print,
    .confirmation-empty,
    .confirmation-disclaimer {
      display: none!important;
    }

    .confirmation-hero {
      background: #fff;
      min-height: 0;
      padding: 10px 0;
    }

    .confirmation-hero__art {
      display: none;
    }

    .confirmation-hero h1 {
      font-size: 35px;
    }

    .confirmation-main {
      padding: 0;
    }

    .confirmation-details {
      display: block!important;
    }

    .confirmation-grid {
      grid-template-columns: 1fr 1fr;
    }

    .confirmation-products,
    .confirmation-totals {
      border: 1px solid #ccc;
      box-shadow: none;
    }

    .confirmation-product {
      break-inside: avoid;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .confirmation-primary-link {
      transition: none;
    }
  }

  .page-confirmation .order-steps {
    margin-bottom: 30px;
  }

  .page-confirmation .confirmation-details,
  .page-confirmation .confirmation-empty {
    margin-top: 0;
  }

  @media (max-width:700px) {
    .page-confirmation .order-steps {
      margin-bottom: 22px;
    }
  }
}

/* ==================================================
   14. Product Details
================================================== */

@scope (
  html:is(
    [data-vyora-page="single-product.html"]
  )
) {
  .vyora-product-page {
    background: #fff;
    color: #171c2e;
    font-family: "Manrope",system-ui,sans-serif;
  }

  .vyora-product-page main {
    display: block;
  }

  .vyora-product-page button,
  .vyora-product-page input {
    font: inherit;
  }

  .vyora-product-page button:focus-visible,
  .vyora-product-page a:focus-visible,
  .vyora-product-page summary:focus-visible {
    outline: 3px solid #aaa5ff;
    outline-offset: 3px;
  }

  .vp-crumb {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 24px;
    margin-bottom: 24px;
    color: #9297ae;
    font-size: 12px;
    font-weight: 650;
  }

  .vp-crumb a {
    text-decoration: none;
    color: #7d849d;
  }

  .vp-crumb a:hover {
    color: #655ceb;
  }

  .vp-crumb strong {
    color: #30384f;
    font-weight: 750;
  }

  .vp-product {
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr);
    gap: clamp(36px,5.3vw,82px);
    align-items: start;
    padding-bottom: 80px;
  }

  .vp-gallery,
  .vp-info {
    min-width: 0;
  }

  .vp-gallery__primary {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1/.95;
    border-radius: 27px;
    overflow: hidden;
    background: radial-gradient(circle at 50% 53%,#f8f7ff 0%,#f1effd 60%,#ebe9fb 100%);
  }

  .vp-gallery__circle {
    position: absolute;
    width: 72%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: linear-gradient(140deg,#e2ddfc,#f7f6ff);
    box-shadow: 0 0 0 1px #fff8;
    top: 14%;
    right: 14%;
  }

  .vp-gallery__primary>img {
    position: relative;
    z-index: 1;
    display: block;
    width: 70%;
    height: 79%;
    object-fit: contain;
    filter: drop-shadow(0 16px 15px rgba(39,33,93,.09));
    transition: transform .45s ease;
  }

  .vp-gallery__primary[data-view="detail"]>img {
    transform: scale(1.37);
  }

  .vp-gallery__primary[data-art="portrait"]>img {
    width: 68%;
    height: 82%;
    object-fit: contain;
  }

  .vp-gallery__primary[data-art="illustration"]>img {
    width: 77%;
    height: 83%;
    object-fit: contain;
    filter: none;
  }

  .vp-gallery__edition,
  .vp-gallery__index {
    position: absolute;
    z-index: 3;
    font-size: 10px;
    color: #6e67cd;
    font-weight: 800;
    letter-spacing: .14em;
  }

  .vp-gallery__edition {
    top: 30px;
    right: 29px;
  }

  .vp-gallery__index {
    bottom: 24px;
    right: 30px;
    color: #8c8bb4;
  }

  .vp-gallery__zoom {
    position: absolute;
    z-index: 3;
    top: 24px;
    left: 24px;
    border: 1px solid #e7e4f6;
    background: #fff;
    color: #171c2e;
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    cursor: pointer;
  }

  .vp-gallery__zoom svg {
    height: 19px;
    width: 19px;
  }

  .vp-gallery__zoom:hover {
    color: #655ceb;
    border-color: #655ceb;
  }

  .vp-gallery__bottom {
    margin-top: 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  .vp-thumbs {
    display: flex;
    gap: 10px;
  }

  .vp-thumb {
    height: 96px;
    width: 91px;
    background: #f6f5fb;
    border: 1px solid #eeecf6;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    border-radius: 14px;
    padding: 7px;
    cursor: pointer;
    transition: border-color .2s,background .2s;
  }

  .vp-thumb.is-active {
    border: 2px solid #655ceb;
    background: #f0eeff;
  }

  .vp-thumb>img,
  .vp-thumb__crop {
    height: 59px;
    width: 68px;
    object-fit: contain;
  }

  .vp-thumb__crop {
    display: block;
    overflow: hidden;
  }

  .vp-thumb__crop img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    transform: scale(1.65);
  }

  .vp-thumb span:last-child {
    font-size: 9px;
    font-weight: 800;
    color: #6e7188;
  }

  .vp-gallery__microcopy {
    max-width: 215px;
    text-align: left;
    font-size: 10px;
    line-height: 1.55;
    color: #a0a1b4;
  }

  .vp-info {
    padding-top: 20px;
  }

  .vp-info__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }

  .vp-overline {
    color: #655ceb;
    font-size: 10px;
    letter-spacing: .16em;
    font-weight: 850;
  }

  .vp-product-ref {
    font-size: 10px;
    color: #9da2b8;
    font-weight: 750;
  }

  .vp-collection {
    margin: 26px 0 10px;
    color: #777f99;
    font-size: 12px;
    font-weight: 650;
  }

  .vp-info h1 {
    font-size: clamp(36px,3.55vw,57px);
    line-height: 1.13;
    letter-spacing: -.057em;
    font-weight: 800;
    margin: 0;
    color: #171c2e;
  }

  .vp-lead {
    max-width: 500px;
    font-size: 14px;
    line-height: 1.9;
    color: #8189a3;
    margin: 20px 0 0;
  }

  .vp-price-line {
    display: flex;
    align-items: baseline;
    gap: 16px;
    margin-top: 28px;
    flex-wrap: wrap;
  }

  .vp-price-line strong {
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -.05em;
    color: #171c2e;
  }

  .vp-price-note {
    font-size: 11px;
    font-weight: 700;
    color: #a2a5b7;
  }

  .vp-soft-divider {
    height: 1px;
    width: 100%;
    background: #eae9f2;
    margin: 28px 0;
  }

  .vp-selector-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 13px;
  }

  .vp-selector-heading h2 {
    font-size: 13px;
    font-weight: 800;
    margin: 0;
  }

  .vp-selector-heading span {
    font-size: 11px;
    color: #777c98;
  }

  .vp-sizes {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
  }

  .vp-size-button {
    border: 1px solid #e5e5f2;
    min-width: 48px;
    height: 44px;
    padding: 0 10px;
    border-radius: 10px;
    background: white;
    color: #30384e;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    transition: all .15s;
  }

  .vp-size-button.is-selected,
  .vp-size-button:hover {
    border-color: #655ceb;
    background: #eeecff;
    color: #5148c9;
  }

  .vp-size-button.is-selected {
    box-shadow: inset 0 0 0 1px #655ceb;
  }

  .vp-size-error {
    font-size: 11px;
    font-weight: 700;
    color: #b5315e;
    margin: 10px 0 0;
  }

  .vp-cart-area {
    display: flex;
    align-items: end;
    gap: 10px;
    margin-top: 30px;
  }

  .vp-qty>label {
    font-size: 11px;
    font-weight: 800;
    color: #3f455e;
    display: block;
    margin-bottom: 7px;
  }

  .vp-qty__buttons {
    height: 53px;
    display: flex;
    align-items: center;
    background: #f7f7fb;
    border: 1px solid #ebebf4;
    border-radius: 11px;
    padding: 0 3px;
  }

  .vp-qty__buttons button {
    border: 0;
    background: transparent;
    font-size: 21px;
    color: #51566e;
    height: 45px;
    width: 35px;
    cursor: pointer;
  }

  .vp-qty__buttons input {
    border: 0;
    background: transparent;
    text-align: center;
    width: 33px;
    font-size: 13px;
    font-weight: 800;
    color: #171c2e;
    appearance: textfield;
    -moz-appearance: textfield;
  }

  .vp-qty__buttons input::-webkit-inner-spin-button,
  .vp-qty__buttons input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .vp-buy {
    border: 0;
    border-radius: 11px;
    background: #655ceb;
    color: #fff;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 53px;
    padding: 12px 18px;
    cursor: pointer;
    font-weight: 800;
    font-size: 12px;
    transition: background .2s,transform .2s;
  }

  .vp-buy svg {
    width: 19px;
    height: 19px;
  }

  .vp-buy span:last-child {
    font-size: 17px;
    margin-right: auto;
  }

  .vp-buy:hover {
    background: #5046d4;
    transform: translateY(-1px);
  }

  .vp-like {
    display: grid;
    place-items: center;
    width: 53px;
    height: 53px;
    border: 1px solid #e6e6f0;
    background: #fff;
    border-radius: 11px;
    color: #171c2e;
    cursor: pointer;
    flex: none;
  }

  .vp-like svg {
    height: 21px;
    width: 21px;
  }

  .vp-like[aria-pressed="true"] {
    background: #f2efff;
    color: #655ceb;
    border-color: #afaafa;
    fill: #655ceb2b;
  }

  .vp-demo-disclaimer {
    color: #999db2;
    font-size: 10px;
    line-height: 1.75;
    margin: 12px 0 27px;
  }

  .vp-benefits {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
    padding: 18px 0;
    border-block: 1px solid #eae9f2;
  }

  .vp-benefits>div {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .vp-benefit-icon {
    display: grid;
    place-items: center;
    flex: none;
    height: 38px;
    width: 38px;
    border-radius: 11px;
    background: #f0eeff;
    color: #655ceb;
    font-size: 19px;
  }

  .vp-benefits strong,
  .vp-benefits small {
    display: block;
  }

  .vp-benefits strong {
    font-size: 11px;
    font-weight: 800;
  }

  .vp-benefits small {
    margin-top: 3px;
    color: #949ab0;
    font-size: 9px;
  }

  .vp-meta {
    display: flex;
    gap: 27px;
    padding: 20px 0;
    color: #a1a5b7;
    font-size: 11px;
    flex-wrap: wrap;
  }

  .vp-meta strong {
    color: #3a4058;
    margin-right: 6px;
    font-weight: 800;
  }

  .vp-details {
    padding-top: 26px;
    padding-bottom: 75px;
    display: grid;
    grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr);
    gap: 80px;
    border-top: 1px solid #eeedf3;
  }

  .vp-details__lead>span,
  .vp-related__heading>div>span,
  .vp-footer-cta>span {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .17em;
    color: #655ceb;
  }

  .vp-details h2,
  .vp-related h2 {
    font-size: clamp(31px,3.1vw,44px);
    letter-spacing: -.06em;
    line-height: 1.1;
    font-weight: 800;
    margin: 16px 0;
  }

  .vp-details h2 em,
  .vp-related h2 em,
  .vp-footer-cta h2 em {
    font-style: normal;
    color: #655ceb;
  }

  .vp-details__lead p {
    color: #8990aa;
    line-height: 1.8;
    font-size: 13px;
    max-width: 310px;
  }

  .vp-accordions details {
    border-bottom: 1px solid #ebebf3;
  }

  .vp-accordions details:first-child {
    border-top: 1px solid #ebebf3;
  }

  .vp-accordions summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 5px;
    font-size: 14px;
    font-weight: 800;
    list-style: none;
    cursor: pointer;
  }

  .vp-accordions summary::-webkit-details-marker {
    display: none;
  }

  .vp-accordions summary span {
    font-size: 20px;
    font-weight: 400;
    color: #655ceb;
    transition: transform .2s;
  }

  .vp-accordions details[open] summary span {
    transform: rotate(45deg);
  }

  .vp-accordions details>div {
    padding: 0 5px 18px;
  }

  .vp-accordions p {
    margin: 0;
    font-size: 12px;
    line-height: 1.95;
    color: #7e869e;
    max-width: 640px;
  }

  .vp-related {
    background: #f8f8fd;
    padding: 72px 0 80px;
  }

  .vp-related__heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
    margin-bottom: 32px;
  }

  .vp-related__heading h2 {
    margin-bottom: 0;
  }

  .vp-related__heading>a {
    font-size: 12px;
    color: #5149d8;
    text-decoration: none;
    border-bottom: 1px solid #a29bea;
    padding: 8px 0;
    font-weight: 800;
    white-space: nowrap;
  }

  .vp-related__grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 20px;
  }

  .vp-related-card {
    min-width: 0;
  }

  .vp-related-card>a {
    display: block;
    text-decoration: none;
    color: inherit;
  }

  .vp-related-card__media {
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
    aspect-ratio: 1/1.02;
    border-radius: 16px;
    overflow: hidden;
    background: #edeefa;
  }

  .vp-related-card__media img {
    width: 80%;
    height: 83%;
    object-fit: contain;
    transition: transform .25s;
  }

  .vp-related-card>a:hover img {
    transform: scale(1.06);
  }

  .vp-related-card__label {
    font-size: 9px;
    letter-spacing: .1em;
    font-weight: 850;
    color: #6b62dc;
    display: block;
    margin-top: 17px;
    text-transform: uppercase;
  }

  .vp-related-card h3 {
    font-weight: 800;
    font-size: 13px;
    margin: 7px 0 9px;
    line-height: 1.55;
  }

  .vp-related-card strong {
    font-size: 13px;
    color: #171c2e;
  }

  .vp-footer-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
    padding-top: 52px;
    padding-bottom: 58px;
    flex-wrap: wrap;
  }

  .vp-footer-cta h2 {
    font-size: 32px;
    letter-spacing: -.055em;
    font-weight: 800;
    margin: 0;
    flex: 1;
  }

  .vp-footer-cta>a {
    background: #171c2e;
    color: white;
    text-decoration: none;
    border-radius: 11px;
    padding: 16px 22px;
    font-weight: 800;
    font-size: 12px;
  }

  .vp-footer-cta>a:hover {
    background: #655ceb;
  }

  .vp-lightbox {
    border: 0;
    background: #f6f5ff;
    border-radius: 21px;
    padding: 22px;
    max-width: min(92vw,840px);
    max-height: 92vh;
    box-shadow: 0 30px 90px #11172766;
  }

  .vp-lightbox::backdrop {
    background: #101327b0;
    backdrop-filter: blur(3px);
  }

  .vp-lightbox img {
    display: block;
    max-width: 100%;
    max-height: 74vh;
    object-fit: contain;
    margin: auto;
  }

  .vp-lightbox__close {
    float: left;
    border: 0;
    background: #171c2e;
    color: #fff;
    border-radius: 50%;
    font-size: 23px;
    line-height: 1;
    width: 35px;
    height: 35px;
    cursor: pointer;
  }

  @media (max-width:1120px) {
    .vp-product {
      gap: 36px;
    }

    .vp-gallery__primary {
      aspect-ratio: 1/1.08;
    }

    .vp-info h1 {
      font-size: clamp(32px,3.6vw,48px);
    }

    .vp-gallery__microcopy {
      display: none;
    }

    .vp-benefits {
      grid-template-columns: 1fr;
    }

    .vp-related__grid {
      gap: 14px;
    }
  }

  @media (max-width:820px) {
    .vp-product {
      grid-template-columns: 1fr;
      max-width: 680px;
    }

    .vp-gallery__primary {
      aspect-ratio: 1/.88;
    }

    .vp-info {
      padding-top: 0;
    }

    .vp-info h1 {
      font-size: 48px;
    }

    .vp-gallery__microcopy {
      display: block;
    }

    .vp-details {
      grid-template-columns: 1fr;
      gap: 20px;
    }

    .vp-related__grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 25px 15px;
    }

    .vp-footer-cta {
      flex-direction: column;
      align-items: flex-start;
    }
  }

  @media (max-width:520px) {
    .vp-crumb {
      font-size: 10px;
      gap: 8px;
      margin: 14px auto 18px;
    }

    .vp-product {
      gap: 27px;
      padding-bottom: 45px;
    }

    .vp-gallery__primary {
      border-radius: 18px;
      aspect-ratio: 1/1.04;
    }

    .vp-gallery__edition {
      top: 17px;
      right: 15px;
      font-size: 8px;
    }

    .vp-gallery__zoom {
      top: 12px;
      left: 12px;
      width: 35px;
      height: 35px;
      border-radius: 10px;
    }

    .vp-gallery__zoom svg {
      width: 16px;
      height: 16px;
    }

    .vp-gallery__index {
      right: 16px;
      bottom: 14px;
      font-size: 9px;
    }

    .vp-gallery__bottom {
      margin-top: 11px;
    }

    .vp-thumb {
      width: 74px;
      height: 77px;
      border-radius: 10px;
    }

    .vp-thumb>img,
    .vp-thumb__crop {
      width: 50px;
      height: 47px;
    }

    .vp-thumb span:last-child {
      font-size: 8px;
    }

    .vp-gallery__microcopy {
      font-size: 9px;
      max-width: 145px;
    }

    .vp-info h1 {
      font-size: 37px;
    }

    .vp-collection {
      margin: 20px 0 7px;
    }

    .vp-lead {
      font-size: 13px;
      margin-top: 11px;
    }

    .vp-price-line {
      margin-top: 18px;
    }

    .vp-price-line strong {
      font-size: 27px;
    }

    .vp-soft-divider {
      margin: 23px 0;
    }

    .vp-cart-area {
      gap: 7px;
    }

    .vp-qty__buttons {
      height: 48px;
    }

    .vp-qty__buttons button {
      width: 28px;
    }

    .vp-qty__buttons input {
      width: 24px;
    }

    .vp-buy {
      min-height: 48px;
      font-size: 10px;
      padding-inline: 11px;
      gap: 5px;
    }

    .vp-buy svg {
      width: 15px;
      height: 15px;
    }

    .vp-buy span:last-child {
      font-size: 12px;
      margin-right: 0;
    }

    .vp-like {
      height: 48px;
      width: 43px;
    }

    .vp-benefits {
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 5px;
    }

    .vp-benefits>div {
      gap: 6px;
    }

    .vp-benefit-icon {
      width: 28px;
      height: 28px;
      font-size: 14px;
    }

    .vp-benefits strong {
      font-size: 9px;
    }

    .vp-benefits small {
      font-size: 8px;
    }

    .vp-meta {
      gap: 8px;
      font-size: 9px;
    }

    .vp-details {
      padding-top: 36px;
      padding-bottom: 52px;
    }

    .vp-details h2,
    .vp-related h2 {
      font-size: 32px;
    }

    .vp-accordions summary {
      padding: 19px 3px;
      font-size: 12px;
    }

    .vp-related {
      padding: 50px 0 60px;
    }

    .vp-related__heading {
      align-items: start;
      flex-direction: column;
      margin-bottom: 25px;
    }

    .vp-related-card__media {
      border-radius: 12px;
    }

    .vp-related-card h3 {
      font-size: 11px;
    }

    .vp-related-card__label {
      font-size: 8px;
    }

    .vp-related-card strong {
      font-size: 12px;
    }

    .vp-footer-cta {
      padding-block: 42px;
    }

    .vp-footer-cta h2 {
      font-size: 27px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .vyora-product-page * {
      scroll-behavior: auto!important;
      transition: none!important;
    }
  }

  .vyora-product-page .vp-crumb {
    color: #626c82;
    font-size: 13px;
  }

  .vyora-product-page .vp-crumb a {
    color: #59627a;
  }

  .vyora-product-page .vp-gallery__microcopy {
    color: #59627a;
    font-size: 12px;
    line-height: 1.65;
  }

  .vyora-product-page .vp-thumb span:last-child {
    color: #535d75;
    font-size: 11px;
  }

  .vyora-product-page .vp-product-ref {
    color: #626c82;
    font-size: 12px;
  }

  .vyora-product-page .vp-collection {
    color: #59627a;
    font-size: 13px;
  }

  .vyora-product-page .vp-lead {
    color: #535d75;
    font-size: 16px;
    line-height: 1.85;
  }

  .vyora-product-page .vp-price-note {
    color: #59627a;
    font-size: 12px;
  }

  .vyora-product-page .vp-selector-heading span {
    color: #59627a;
    font-size: 12px;
  }

  .vyora-product-page .vp-demo-disclaimer {
    color: #626c82;
    font-size: 12px;
    line-height: 1.7;
  }

  .vyora-product-page .vp-benefits small {
    color: #59627a;
    font-size: 11px;
    line-height: 1.4;
  }

  .vyora-product-page .vp-meta {
    color: #59627a;
    font-size: 12px;
  }

  .vyora-product-page .vp-details__lead p {
    color: #535d75;
    font-size: 15px;
    line-height: 1.8;
  }

  .vyora-product-page .vp-accordions p {
    color: #535d75;
    font-size: 14px;
    line-height: 1.85;
  }

  @media (max-width:520px) {
    .vyora-product-page .vp-crumb {
      font-size: 11px;
    }

    .vyora-product-page .vp-gallery__microcopy {
      font-size: 11px;
    }

    .vyora-product-page .vp-thumb span:last-child {
      font-size: 10px;
    }

    .vyora-product-page .vp-product-ref {
      font-size: 11px;
    }

    .vyora-product-page .vp-lead {
      font-size: 15px;
      line-height: 1.75;
    }

    .vyora-product-page .vp-benefits small {
      font-size: 10px;
    }

    .vyora-product-page .vp-meta {
      font-size: 11px;
    }

    .vyora-product-page .vp-details__lead p {
      font-size: 14px;
    }

    .vyora-product-page .vp-accordions p {
      font-size: 13.5px;
    }
  }
}

/* ==================================================
   15. Blog Layouts & Articles
================================================== */

@scope (
  html:is(
    [data-vyora-style-group="g04"]
  )
) {
  .vyora-blog-refined {
    --vb-ink: #171c2e;
    --vb-indigo: #655ceb;
    --vb-soft: #f6f7fb;
    --vb-muted: #59627a;
    --vb-border: #e8e9f4;
    font-size: 15px;
    color: var(--vb-ink);
    background: white;
  }

  .vyora-blog-refined .site-header {
    position: relative!important;
    top: auto!important;
  }

  .vyora-blog-refined .container-wide {
    width: min(calc(100% - 80px),1280px);
  }

  .vyora-blog-refined main {
    overflow: visible;
  }

  .vyora-blog-refined [hidden] {
    display: none!important;
  }

  .vyora-blog-refined .blog-ref-crumbshell {
    background: linear-gradient(118deg,#f9f9fd,#efedff);
    padding: 26px 0;
    border-bottom: 1px solid #eae9fa;
  }

  .blog-ref-breadcrumb {
    display: flex;
    align-items: center;
    gap: 13px;
    font-size: 12px;
    font-weight: 800;
    color: #8990a5;
  }

  .blog-ref-breadcrumb strong {
    color: #655ceb;
  }

  .blog-ref-breadcrumb a:hover {
    color: #655ceb;
  }

  .blog-ref-intro {
    padding: 42px 0 35px;
  }

  .blog-ref-intro h1 {
    font-size: clamp(32px,4vw,53px);
    font-weight: 800;
    margin: 14px 0 10px;
    color: #171c2e;
    letter-spacing: -.055em;
  }

  .blog-ref-intro p {
    color: #59627a;
    font-size: 15px;
    margin: 0;
    line-height: 1.8;
  }

  .blog-page-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) 290px;
    gap: 35px;
    align-items: start;
    padding: 0 0 90px;
  }

  .blog-page-layout.sidebar-left {
    grid-template-columns: 290px minmax(0,1fr);
  }

  .blog-posts-list {
    display: grid;
    gap: 45px;
  }

  .blog-post-card {
    min-width: 0;
  }

  .blog-post-card__media {
    display: block;
    position: relative;
    background: #f5f5fa;
    overflow: hidden;
    border-radius: 22px;
    aspect-ratio: 2.15/1;
  }

  .blog-post-card__media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 33%;
    transition: transform .3s;
  }

  .blog-post-card__media img[src$=".svg"] {
    object-fit: contain;
    padding: 34px;
    background: #f2f1fd;
  }

  .blog-post-card__media:hover img {
    transform: scale(1.04);
  }

  .blog-date-badge {
    position: absolute;
    top: 17px;
    right: 17px;
    width: 56px;
    min-height: 61px;
    border-radius: 12px;
    background: #655ceb;
    color: white;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 22px rgba(101,92,235,.26);
  }

  .blog-date-badge strong {
    font-size: 20px;
    font-weight: 800;
    line-height: 1.2;
  }

  .blog-date-badge small {
    font-size: 10px;
    letter-spacing: .1em;
  }

  .blog-post-card__content {
    padding: 18px 2px 0;
  }

  .blog-post-meta {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 10px;
    letter-spacing: .07em;
    font-weight: 800;
    color: #6359d8;
    text-transform: uppercase;
  }

  .blog-post-meta>span+span::before {
    content: "·";
    margin-left: 15px;
    color: #c5c5d9;
  }

  .blog-post-card__content h2 {
    font-weight: 800;
    letter-spacing: -.044em;
    line-height: 1.25;
    font-size: clamp(22px,2.35vw,33px);
    margin: 12px 0 11px;
  }

  .blog-post-card__content h2 a {
    color: #171c2e;
  }

  .blog-post-card__content h2 a:hover {
    color: #655ceb;
  }

  .blog-post-card__content p {
    max-width: 780px;
    color: #59627a;
    font-size: 14px;
    line-height: 1.85;
    margin: 0 0 18px;
  }

  .blog-btn {
    display: inline-flex;
    gap: 18px;
    align-items: center;
    justify-content: center;
    padding: 13px 20px;
    color: #fff;
    background: #171c2e;
    border: 0;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    min-height: 43px;
    transition: background .2s,transform .2s;
    cursor: pointer;
  }

  .blog-btn:hover {
    background: #655ceb;
    color: white;
    transform: translateY(-2px);
  }

  .blog-sidebar {
    display: grid;
    gap: 18px;
  }

  .blog-search-form {
    display: flex;
    align-items: center;
    border: 1px solid #e9eaf3;
    border-radius: 13px;
    background: #fff;
    height: 55px;
    padding: 5px 15px 5px 7px;
  }

  .blog-search-input {
    width: 100%;
    min-width: 0;
    background: transparent;
    border: 0;
    outline: 0;
    font-size: 12px;
    color: #171c2e;
  }

  .blog-search-form:focus-within {
    border-color: #655ceb;
    box-shadow: 0 0 0 3px #f1efff;
  }

  .blog-search-form button {
    border: 0;
    background: #f4f3ff;
    border-radius: 9px;
    color: #655ceb;
    font-size: 24px;
    width: 38px;
    height: 38px;
    cursor: pointer;
    line-height: 1;
  }

  .blog-sidebar-card {
    border: 1px solid var(--vb-border);
    background: #fff;
    border-radius: 17px;
    padding: 22px;
  }

  .blog-sidebar-card h3 {
    margin: 0 0 18px;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -.035em;
  }

  .blog-sidebar-recent {
    display: grid;
    gap: 15px;
  }

  .blog-sidebar-recent__item {
    display: grid;
    grid-template-columns: 73px 1fr;
    gap: 12px;
    align-items: center;
    color: #171c2e;
  }

  .blog-sidebar-recent__item img {
    width: 73px;
    height: 66px;
    object-fit: cover;
    border-radius: 9px;
    background: #f1f0fb;
  }

  .blog-sidebar-recent__item img[src$=".svg"] {
    object-fit: contain;
    padding: 7px;
  }

  .blog-sidebar-recent__item span {
    display: block;
    color: #655ceb;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
    margin-bottom: 6px;
  }

  .blog-sidebar-recent__item b {
    font-size: 11px;
    font-weight: 800;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .blog-sidebar-recent__item:hover b {
    color: #655ceb;
  }

  .blog-tag-cloud {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
  }

  .blog-tag-cloud button,
  .blog-tag-cloud a {
    border: 1px solid #eeedf5;
    background: #f8f8fb;
    border-radius: 999px;
    padding: 9px 12px;
    font-size: 11px;
    font-weight: 700;
    color: #58627a;
    cursor: pointer;
  }

  .blog-tag-cloud button:hover,
  .blog-tag-cloud button.is-active,
  .blog-tag-cloud a:hover {
    color: #655ceb;
    background: #f0efff;
    border-color: #dcd9ff;
  }

  .blog-sidebar-banner {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: linear-gradient(135deg,#1e2440,#171c2e);
    min-height: 250px;
    padding: 26px;
    border-radius: 18px;
    color: white;
  }

  .blog-sidebar-banner>span:first-child {
    font-size: 10px;
    letter-spacing: .16em;
    color: #bcb5ff;
    font-weight: 800;
  }

  .blog-sidebar-banner h3 {
    max-width: 210px;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: -.045em;
    margin: 18px 0 24px;
  }

  .blog-sidebar-banner a {
    font-size: 12px;
    font-weight: 800;
    color: white;
    border-bottom: 1px solid #b7b0ff;
    padding-bottom: 4px;
  }

  .blog-sidebar-decor {
    position: absolute;
    bottom: -64px;
    left: -30px;
    font-size: 215px;
    line-height: 1;
    color: #6760c5;
    z-index: -1;
    opacity: .22;
  }

  .blog-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 34px;
  }

  .blog-pagination button {
    height: 38px;
    min-width: 38px;
    padding: 0 8px;
    border: 1px solid #e7e7f0;
    background: white;
    border-radius: 10px;
    color: #798099;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
  }

  .blog-pagination button.is-active,
  .blog-pagination button:hover {
    background: #655ceb;
    border-color: #655ceb;
    color: white;
  }

  .blog-pagination button:disabled {
    opacity: .38;
    cursor: default;
  }

  .blog-no-results {
    background: #f7f7fc;
    border-radius: 18px;
    padding: 42px;
    text-align: center;
  }

  .blog-no-results h2 {
    font-size: 25px;
  }

  .blog-no-results p {
    color: #59627a;
  }

  .blog-no-results button {
    border: 0;
    border-radius: 10px;
    background: #655ceb;
    color: white;
    padding: 11px 17px;
    font-size: 12px;
    font-weight: 800;
  }

  .blog-detail-layout {
    padding-top: 50px;
    grid-template-columns: minmax(0,1fr) 290px;
  }

  .blog-detail-article h1 {
    font-size: clamp(32px,3.3vw,50px);
    max-width: 870px;
    line-height: 1.14;
    margin: 15px 0 26px;
    font-weight: 800;
    letter-spacing: -.05em;
  }

  .blog-detail-hero {
    border-radius: 20px;
    aspect-ratio: 2/1;
    overflow: hidden;
    background: #f2f2f7;
  }

  .blog-detail-hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
    display: block;
  }

  .blog-detail-hero img[src$=".svg"] {
    object-fit: contain;
    padding: 70px;
  }

  .blog-detail-copy {
    padding-top: 27px;
  }

  .blog-detail-copy p {
    color: #59627a;
    font-size: 15px;
    line-height: 1.9;
    margin: 0 0 24px;
  }

  .blog-detail-copy .blog-article-lead {
    color: #3d4661;
    font-size: 16px;
    font-weight: 600;
  }

  .blog-detail-copy h2 {
    font-size: 25px;
    font-weight: 800;
    margin: 32px 0 12px;
  }

  .blog-detail-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin: 27px 0;
  }

  .blog-detail-gallery img {
    width: 100%;
    height: 235px;
    object-fit: cover;
    border-radius: 17px;
    background: #f2f2f8;
  }

  .blog-detail-quote {
    position: relative;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.6;
    color: #171c2e;
    letter-spacing: -.025em;
    font-style: italic;
    margin: 32px 0;
    padding: 22px 56px 22px 28px;
    background: #f7f6ff;
    border-right: 4px solid #655ceb;
    border-radius: 15px 0 0 15px;
  }

  .blog-detail-quote::before {
    content: "“";
    font-size: 53px;
    line-height: 1;
    position: absolute;
    top: 14px;
    right: 15px;
    color: #655ceb;
  }

  .blog-detail-footerline {
    display: flex;
    gap: 16px;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    padding: 24px 0;
    border-block: 1px solid #ececf3;
    margin: 25px 0 60px;
  }

  .blog-copy-button {
    border: 0;
    background: #f0efff;
    color: #655ceb;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
  }

  .blog-copy-notice {
    font-size: 11px;
    color: #59627a;
  }

  .blog-comments h2,
  .blog-comment-form-section h2 {
    font-size: clamp(24px,3vw,35px);
    font-weight: 800;
    letter-spacing: -.045em;
    margin: 10px 0 24px;
  }

  .blog-comments h2 small {
    font-size: 12px;
    font-weight: 700;
    color: #888da3;
    letter-spacing: 0;
  }

  .blog-comment {
    display: flex;
    gap: 15px;
    padding: 22px 0;
    border-bottom: 1px solid #efeff7;
  }

  .blog-comment-avatar {
    width: 48px;
    height: 48px;
    flex: none;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #eae8ff;
    color: #655ceb;
    font-size: 12px;
    font-weight: 800;
  }

  .blog-comment-body {
    flex: 1;
  }

  .blog-comment-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
  }

  .blog-comment-head strong {
    font-size: 13px;
  }

  .blog-comment-head span {
    display: block;
    font-size: 10px;
    color: #8b91a7;
    margin-top: 5px;
  }

  .blog-comment-head>span {
    color: #655ceb;
  }

  .blog-comment-body p {
    margin: 12px 0;
    font-size: 12px;
    line-height: 1.8;
    color: #626b83;
  }

  .blog-comment-body button {
    border: 0;
    background: #f0efff;
    color: #5a52d2;
    padding: 9px 12px;
    font-size: 11px;
    font-weight: 800;
    border-radius: 8px;
    cursor: pointer;
  }

  .blog-comment-form-section {
    padding-top: 45px;
  }

  .blog-comment-form-section>p {
    font-size: 12px;
    color: #7d8499;
    margin-bottom: 18px;
  }

  .blog-comment-form-section form {
    display: grid;
    gap: 16px;
  }

  .blog-comment-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  .blog-comment-form-section label {
    font-size: 12px;
    font-weight: 800;
    display: grid;
    gap: 8px;
  }

  .blog-comment-form-section input,
  .blog-comment-form-section textarea {
    min-width: 0;
    width: 100%;
    border: 1px solid #e8e9f2;
    background: #fff;
    border-radius: 10px;
    padding: 13px 14px;
    font-size: 13px;
    outline: 0;
    font-weight: 500;
    color: #171c2e;
    resize: vertical;
  }

  .blog-comment-form-section input:focus,
  .blog-comment-form-section textarea:focus {
    border-color: #655ceb;
  }

  .blog-comment-form-section .blog-btn {
    justify-self: start;
  }

  .blog-comment-form-section #comment-preview:not([hidden]) {
    margin-top: 16px;
    background: #f4f3ff;
    border: 1px solid #e0dcff;
    padding: 18px;
    border-radius: 12px;
    white-space: pre-wrap;
    font-size: 13px;
    line-height: 1.75;
    color: #3d4661;
  }

  @media (max-width:1150px) {
    .blog-page-layout,
    .blog-detail-layout {
      grid-template-columns: minmax(0,1fr) 260px;
      gap: 24px;
    }

    .blog-page-layout.sidebar-left {
      grid-template-columns: 260px minmax(0,1fr);
    }
  }

  @media (max-width:850px) {
    .vyora-blog-refined .container-wide {
      width: min(calc(100% - 40px),1280px);
    }

    .blog-page-layout,
    .blog-page-layout.sidebar-left,
    .blog-detail-layout {
      grid-template-columns: 1fr;
    }

    .blog-page-layout.sidebar-left .blog-page-layout__sidebar {
      order: 2;
    }

    .blog-sidebar {
      grid-template-columns: 1fr 1fr;
      align-items: start;
    }

    .blog-search-form {
      grid-column: 1/-1;
    }

    .blog-sidebar-banner {
      min-height: 215px;
    }

    .blog-detail-layout {
      padding-top: 35px;
    }
  }

  @media (max-width:540px) {
    .vyora-blog-refined .container-wide {
      width: min(calc(100% - 32px),1280px);
    }

    .blog-ref-crumbshell {
      padding: 19px 0;
    }

    .blog-ref-intro {
      padding: 29px 0 25px;
    }

    .blog-ref-intro p {
      font-size: 13px;
    }

    .blog-page-layout {
      padding-bottom: 55px;
    }

    .blog-posts-list {
      gap: 36px;
    }

    .blog-post-card__media {
      aspect-ratio: 1.48/1;
      border-radius: 15px;
    }

    .blog-date-badge {
      width: 48px;
      min-height: 53px;
      right: 11px;
      top: 11px;
    }

    .blog-post-card__content h2 {
      font-size: 22px;
    }

    .blog-sidebar {
      display: grid;
      grid-template-columns: 1fr;
    }

    .blog-search-form {
      grid-column: auto;
    }

    .blog-detail-article h1 {
      font-size: 30px;
    }

    .blog-detail-hero {
      aspect-ratio: 1.5/1;
      border-radius: 15px;
    }

    .blog-detail-gallery {
      gap: 10px;
    }

    .blog-detail-gallery img {
      height: 140px;
      border-radius: 12px;
    }

    .blog-detail-quote {
      font-size: 17px;
      padding: 18px 42px 18px 15px;
    }

    .blog-detail-quote::before {
      right: 10px;
    }

    .blog-comment-form__row {
      grid-template-columns: 1fr;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .blog-post-card__media img,
    .blog-btn {
      transition: none;
    }
  }
}

/* ==================================================
   16. Compact Account Layout
================================================== */

@scope (
  html:is(
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"]
  )
) {
  .vyora-account-page {
    --ac-line: #e9eaf2;
    --ac-soft: #f8f8fc;
    --ac-muted: #5f6b80;
  }

  .vyora-account-page .account-main {
    padding-bottom: 42px;
  }

  .vyora-account-page .order-breadcrumb {
    padding-top: 20px;
    padding-bottom: 10px;
  }

  .vyora-account-page .account-layout {
    grid-template-columns: 220px minmax(0,1fr);
    gap: 24px;
    margin-top: 8px;
    align-items: start;
  }

  .vyora-account-page .account-sidebar {
    padding: 13px 10px 11px;
    border-radius: 16px;
    box-shadow: 0 6px 22px rgba(23,28,46,.022);
  }

  .vyora-account-page .account-sidebar__top {
    padding: 7px 12px 13px;
    margin-bottom: 10px;
  }

  .vyora-account-page .account-sidebar__overline,
  .vyora-account-page .account-kicker,
  .vyora-account-page .account-caption {
    font-size: 10px;
    letter-spacing: .105em;
  }

  .vyora-account-page .account-sidebar__top h2 {
    font-size: 19px;
    margin: 6px 0 0;
    letter-spacing: -.035em;
  }

  .vyora-account-page .account-menu {
    gap: 3px;
  }

  .vyora-account-page .account-menu__link {
    min-height: 39px;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.4;
  }

  .vyora-account-page .account-menu__link svg {
    height: 17px;
    width: 17px;
  }

  .vyora-account-page .account-menu__link.is-active::before {
    top: 8px;
    bottom: 8px;
  }

  .vyora-account-page .account-menu__exit {
    margin-top: 8px;
    padding-top: 13px;
  }

  .vyora-account-page .account-sidebar__bottom {
    padding: 11px 12px;
    margin-top: 13px;
    border-radius: 10px;
    font-size: 8.5px;
    gap: 8px;
  }

  .vyora-account-page .account-sidebar__sparkle {
    font-size: 17px;
  }

  .vyora-account-page .account-panel-heading {
    min-height: 0;
    margin: 0 0 16px;
    gap: 10px;
  }

  .vyora-account-page .account-panel-heading h2 {
    font-size: clamp(24px,2.25vw,30px);
    line-height: 1.16;
    letter-spacing: -.046em;
    margin: 5px 0 6px;
  }

  .vyora-account-page .account-panel-heading p {
    font-size: 12px;
    line-height: 1.6;
    color: #5e687f;
  }

  .vyora-account-page .account-sample-pill {
    font-size: 9px;
    padding: 8px 11px;
  }

  .vyora-account-page .account-snapshot {
    gap: 13px;
  }

  .vyora-account-page .account-snapshot-card {
    min-height: 149px;
    padding: 17px 18px;
    border-radius: 15px;
    box-shadow: 0 6px 20px rgba(23,28,46,.022);
  }

  .vyora-account-page .account-profile-card {
    display: grid;
    grid-template-columns: 49px minmax(0,1fr);
    grid-template-rows: auto auto;
    column-gap: 13px;
    row-gap: 5px;
    align-items: center;
  }

  .vyora-account-page .account-profile-card__avatar {
    grid-row: 1/3;
    margin: 0;
    width: 49px;
    height: 49px;
    font-size: 16px;
  }

  .vyora-account-page .account-profile-card>div:nth-child(2) {
    min-width: 0;
  }

  .vyora-account-page .account-profile-card .account-link {
    grid-column: 2;
    align-self: start;
    margin: 0;
  }

  .vyora-account-page .account-snapshot-card h3 {
    font-size: 17px;
    line-height: 1.3;
    margin: 4px 0 2px;
  }

  .vyora-account-page .account-snapshot-card p {
    font-size: 11.5px;
    line-height: 1.55;
    margin: 0 0 9px;
    overflow-wrap: anywhere;
  }

  .vyora-account-page .account-link {
    font-size: 12px;
  }

  .vyora-account-page .account-address-card .account-caption {
    margin-bottom: 5px;
  }

  .vyora-account-page .account-address-card h3 {
    max-width: calc(100% - 40px);
  }

  .vyora-account-page .account-snapshot-card__icon {
    width: 33px;
    height: 33px;
    border-radius: 10px;
    left: 15px;
    top: 15px;
  }

  .vyora-account-page .account-snapshot-card__icon svg {
    height: 19px;
    width: 19px;
  }

  .vyora-account-page .account-metrics {
    gap: 12px;
    margin: 14px 0 18px;
  }

  .vyora-account-page .account-metrics>div {
    min-height: 73px;
    grid-template-columns: 32px 1fr;
    padding: 11px 14px;
    column-gap: 11px;
    border-radius: 13px;
  }

  .vyora-account-page .account-metric-icon {
    width: 32px;
    height: 32px;
    border-radius: 9px;
  }

  .vyora-account-page .account-metric-icon svg {
    height: 18px;
    width: 18px;
  }

  .vyora-account-page .account-metrics strong {
    font-size: 20px;
    line-height: 1.18;
  }

  .vyora-account-page .account-metrics small {
    font-size: 10px;
    line-height: 1.4;
  }

  .vyora-account-page .account-surface {
    padding: 19px 20px;
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(23,28,46,.027);
  }

  .vyora-account-page .account-card-heading {
    gap: 14px;
    margin-bottom: 14px;
  }

  .vyora-account-page .account-card-heading h3 {
    font-size: 18px;
    letter-spacing: -.03em;
    margin-top: 5px;
  }

  .vyora-account-page .account-card-heading p {
    font-size: 11px;
  }

  .vyora-account-page .account-table {
    font-size: 12px;
  }

  .vyora-account-page .account-table th {
    padding: 11px 12px;
    font-size: 10px;
  }

  .vyora-account-page .account-table td {
    padding: 12px;
    border-color: #f1f1f6;
  }

  .vyora-account-page .account-table__status {
    padding: 6px 8px;
    border-radius: 7px;
    font-size: 10px;
  }

  .vyora-account-page .account-table .account-link {
    font-size: 11px;
  }

  .vyora-account-page .account-filter-bar {
    margin-bottom: 14px;
    gap: 10px;
  }

  .vyora-account-page .account-filter-bar input,
  .vyora-account-page .account-filter-bar select {
    min-height: 41px;
    font-size: 12px;
  }

  .vyora-account-page .account-detail-top {
    gap: 11px;
    margin: 15px 0 20px;
  }

  .vyora-account-page .account-detail-address,
  .vyora-account-page .account-detail-summary {
    padding: 16px;
    min-height: 142px;
    border-radius: 12px;
  }

  .vyora-account-page .account-detail-address strong {
    margin-top: 9px;
    font-size: 13px;
  }

  .vyora-account-page .account-detail-address p {
    line-height: 1.65;
    margin-top: 7px;
    font-size: 11.5px;
  }

  .vyora-account-page .account-detail-summary dl {
    margin-top: 11px;
  }

  .vyora-account-page .account-detail-summary dl>div {
    margin-bottom: 8px;
  }

  .vyora-account-page .account-progress {
    margin: 10px 0 21px;
    padding: 6px 10px;
  }

  .vyora-account-page .account-progress__step span {
    width: 31px;
    height: 31px;
    margin-bottom: 7px;
  }

  .vyora-account-page .account-progress:before {
    top: 21px;
  }

  .vyora-account-page .account-detail-items__heading {
    padding: 11px 14px;
  }

  .vyora-account-page .account-detail-item {
    padding: 10px 14px;
  }

  .vyora-account-page .account-detail-product img {
    width: 45px;
    height: 47px;
  }

  .vyora-account-page .account-detail-bottom {
    margin-top: 8px;
    padding-top: 14px;
  }

  .vyora-account-page .account-wishlist-grid {
    gap: 12px;
  }

  .vyora-account-page .account-wishlist-item {
    grid-template-columns: 82px minmax(0,1fr);
    gap: 12px;
    padding: 11px;
    border-radius: 12px;
  }

  .vyora-account-page .account-wishlist-image {
    width: 82px;
    height: 100px;
  }

  .vyora-account-page .account-wishlist-empty {
    padding: 38px 16px;
  }

  .vyora-account-page .account-wishlist-empty__icon {
    width: 54px;
    height: 54px;
    border-radius: 15px;
    margin-bottom: 14px;
  }

  .vyora-account-page .account-wishlist-empty h3 {
    font-size: 20px;
  }

  .vyora-account-page .account-wishlist-empty p {
    margin: 8px auto 16px;
    font-size: 12px;
  }

  .vyora-account-page .account-cta {
    padding: 11px 16px;
    font-size: 12px;
    border-radius: 10px;
  }

  .vyora-account-page .account-settings-card {
    margin-bottom: 13px;
  }

  .vyora-account-page .account-settings-form {
    grid-template-columns: minmax(0,1fr) 152px;
    gap: 15px;
  }

  .vyora-account-page .account-settings-fields {
    gap: 12px;
  }

  .vyora-account-page .account-field label {
    font-size: 11px;
    margin-bottom: 6px;
  }

  .vyora-account-page .account-field input {
    height: 41px;
    padding: 0 12px;
    font-size: 12px;
    border-radius: 9px;
  }

  .vyora-account-page .account-upload {
    padding: 14px 10px 12px;
    border-radius: 12px;
  }

  .vyora-account-page .account-upload__avatar {
    width: 67px;
    height: 67px;
    font-size: 22px;
    margin-bottom: 9px;
  }

  .vyora-account-page .account-upload__button {
    padding: 8px 12px;
    margin-top: 10px;
  }

  .vyora-account-page .account-settings-actions {
    margin-top: 2px;
  }

  .vyora-account-page .account-security-notice {
    padding: 14px;
    border-radius: 12px;
    gap: 10px;
  }

  .vyora-account-page .account-footer-note {
    margin-top: 17px;
    font-size: 10px;
    padding-inline: 20px;
  }

  .vyora-account-page .account-signout-card {
    padding: 27px;
    max-width: 670px;
  }

  .vyora-account-page .account-signout-icon {
    width: 49px;
    height: 49px;
    font-size: 24px;
    border-radius: 12px;
    margin-bottom: 12px;
  }

  .vyora-account-page .account-signout-card h3 {
    font-size: 23px;
    margin-bottom: 9px;
  }

  .vyora-account-page .account-signout-card p {
    margin-bottom: 16px;
    font-size: 12px;
  }

  @media (max-width:1150px) {
    .vyora-account-page .account-layout {
      grid-template-columns: 200px minmax(0,1fr);
      gap: 16px;
    }

    .vyora-account-page .account-snapshot {
      grid-template-columns: 1fr;
    }

    .vyora-account-page .account-snapshot-card {
      min-height: 116px;
    }

    .vyora-account-page .account-profile-card {
      min-height: 116px;
    }
  }

  @media (max-width:900px) {
    .vyora-account-page .account-layout {
      grid-template-columns: 1fr;
      gap: 14px;
      margin-top: 8px;
    }

    .vyora-account-page .account-sidebar {
      padding: 11px;
      border-radius: 13px;
    }

    .vyora-account-page .account-sidebar__top {
      padding: 3px 7px 10px;
      margin-bottom: 9px;
    }

    .vyora-account-page .account-sidebar__top h2 {
      font-size: 18px;
    }

    .vyora-account-page .account-menu {
      display: grid;
      grid-template-columns: repeat(3,minmax(0,1fr));
      gap: 7px;
      overflow: visible;
    }

    .vyora-account-page .account-menu__link {
      min-height: 41px;
      white-space: normal;
      min-width: 0;
      padding: 8px 10px;
      gap: 7px;
      font-size: 11px;
      line-height: 1.3;
    }

    .vyora-account-page .account-menu__exit {
      margin: 0;
      padding-top: 8px;
      border: 0;
      border-radius: 10px;
    }

    .vyora-account-page .account-panel-heading {
      margin-top: 0;
    }

    .vyora-account-page .account-snapshot {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }

  @media (max-width:680px) {
    .vyora-account-page .account-layout {
      gap: 13px;
    }

    .vyora-account-page .account-menu {
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 6px;
    }

    .vyora-account-page .account-menu__link {
      font-size: 11px;
      padding: 8px 10px;
    }

    .vyora-account-page .account-panel-heading h2 {
      font-size: 25px;
    }

    .vyora-account-page .account-panel-heading p {
      font-size: 11.5px;
    }

    .vyora-account-page .account-snapshot {
      grid-template-columns: 1fr;
      gap: 10px;
    }

    .vyora-account-page .account-snapshot-card {
      padding: 15px;
      min-height: 109px;
    }

    .vyora-account-page .account-profile-card__avatar {
      height: 45px;
      width: 45px;
    }

    .vyora-account-page .account-profile-card {
      grid-template-columns: 45px minmax(0,1fr);
    }

    .vyora-account-page .account-metrics {
      gap: 7px;
      margin: 11px 0 14px;
    }

    .vyora-account-page .account-metrics>div {
      padding: 10px 8px;
      min-height: 78px;
      gap: 4px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
    }

    .vyora-account-page .account-metric-icon {
      height: 26px;
      width: 26px;
    }

    .vyora-account-page .account-metric-icon svg {
      width: 16px;
      height: 16px;
    }

    .vyora-account-page .account-metrics strong {
      font-size: 18px;
      align-self: flex-start;
    }

    .vyora-account-page .account-metrics small {
      font-size: 9px;
      overflow-wrap: anywhere;
    }

    .vyora-account-page .account-surface {
      padding: 14px;
      border-radius: 13px;
    }

    .vyora-account-page .account-card-heading h3 {
      font-size: 17px;
    }

    .vyora-account-page .account-table tbody {
      gap: 8px;
    }

    .vyora-account-page .account-table tbody tr {
      padding: 11px;
      gap: 9px;
    }

    .vyora-account-page .account-detail-top {
      grid-template-columns: 1fr;
      gap: 9px;
    }

    .vyora-account-page .account-detail-address,
    .vyora-account-page .account-detail-summary {
      min-height: 0;
      padding: 14px;
    }

    .vyora-account-page .account-settings-form {
      grid-template-columns: 1fr;
    }

    .vyora-account-page .account-upload {
      grid-column: 1;
      grid-row: 2;
    }

    .vyora-account-page .account-settings-fields {
      grid-template-columns: 1fr;
      gap: 10px;
    }

    .vyora-account-page .account-field--wide {
      grid-column: auto;
    }

    .vyora-account-page .account-wishlist-item {
      grid-template-columns: 75px minmax(0,1fr);
      padding: 10px;
      gap: 9px;
    }

    .vyora-account-page .account-wishlist-image {
      width: 75px;
      height: 92px;
    }

    .vyora-account-page .account-detail-items__heading,
    .vyora-account-page .account-detail-item {
      padding: 10px 7px;
      gap: 4px;
      grid-template-columns: minmax(0,1fr) 45px 32px 53px;
    }

    .vyora-account-page .account-detail-product {
      gap: 7px;
    }

    .vyora-account-page .account-detail-product img {
      width: 33px;
      height: 36px;
    }

    .vyora-account-page .account-signout-card {
      padding: 21px;
    }

    .vyora-account-page .account-footer-note {
      margin-top: 15px;
      padding-inline: 15px;
    }
  }

  .vyora-account-page .account-filter-bar {
    align-items: center;
  }

  .vyora-account-page .account-filter-bar .account-search {
    min-width: 0;
    margin-bottom: 0;
  }

  .vyora-account-page .account-filter-bar #order-status {
    flex: 0 0 170px;
    width: 170px;
    height: 41px;
    min-height: 41px;
    align-self: center;
    padding-inline: 12px;
  }

  @media (max-width:640px) {
    .vyora-account-page .account-filter-bar #order-status {
      flex: 1 1 100%;
      width: 100%;
    }
  }

  .vyora-account-page .account-filter-bar {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .vyora-account-page .account-filter-bar .account-search {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
  }

  .vyora-account-page .account-filter-bar #order-search,
  .vyora-account-page .account-filter-bar #order-status {
    height: 41px;
    min-height: 41px;
    box-sizing: border-box;
    margin: 0;
  }

  @media (max-width:640px) {
    .vyora-account-page .account-filter-bar {
      align-items: stretch;
    }

    .vyora-account-page .account-filter-bar .account-search {
      flex: 1 1 100%;
      width: 100%;
    }
  }
}

/* ==================================================
   17. Blog Design Alignment
================================================== */

@scope (
  html:is(
    [data-vyora-style-group="g04"]
  )
) {
  .vyora-blog-matched {
    --vb-ink: #171c2e;
    --vb-indigo: #655ceb;
    --vb-muted: #59627a;
    --vb-border: #e8e9f4;
    color: var(--vb-ink);
    background: #fff;
  }

  .vyora-blog-matched .site-header {
    position: relative!important;
    top: auto!important;
  }

  .vyora-blog-matched .commerce-container {
    width: min(calc(100% - 112px),1520px);
    margin-inline: auto;
  }

  .vyora-blog-matched .blog-ref-main {
    padding: 0 0 45px;
  }

  .vyora-blog-matched .blog-ref-crumbshell {
    padding: 0;
    background: #fff;
    border: 0;
  }

  .vyora-blog-matched .blog-matched-breadcrumb {
    display: flex;
    gap: 13px;
    align-items: center;
    padding: 27px 0 16px;
    font-size: 12px;
    font-weight: 700;
    color: #848ba0;
  }

  .vyora-blog-matched .blog-matched-breadcrumb a {
    color: #66718b;
    text-decoration: none;
  }

  .vyora-blog-matched .blog-matched-breadcrumb a:hover {
    color: #655ceb;
  }

  .vyora-blog-matched .blog-matched-breadcrumb strong {
    color: #171c2e;
    font-weight: 800;
  }

  .vyora-blog-matched .blog-matched-intro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 37px 0 37px;
    margin-bottom: 0;
  }

  .blog-matched-intro__content {
    min-width: 0;
  }

  .blog-matched-eyebrow {
    color: #655ceb;
    font-weight: 800;
    font-size: 11px;
    letter-spacing: .16em;
    text-transform: uppercase;
  }

  .blog-matched-eyebrow span {
    font-size: 17px;
    vertical-align: -2px;
    margin-left: 9px;
  }

  .vyora-blog-matched .blog-matched-intro h1 {
    font-size: clamp(38px,4.6vw,66px);
    letter-spacing: -.072em;
    line-height: 1.12;
    font-weight: 800;
    margin: 16px 0 12px;
    color: #171c2e;
  }

  .vyora-blog-matched .blog-matched-intro h1 em {
    color: #655ceb;
    font-style: normal;
  }

  .vyora-blog-matched .blog-matched-intro p {
    font-size: 15px;
    line-height: 1.7;
    color: #59647b;
    margin: 0;
    max-width: 660px;
    font-weight: 500;
  }

  .blog-matched-intro__shape {
    flex: 0 0 225px;
    height: 135px;
    border-radius: 23px;
    background: linear-gradient(135deg,#f3f1ff,#eae7ff);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    transform: rotate(4deg);
    border: 1px solid #e7e3ff;
  }

  .blog-matched-intro__shape span {
    font-size: 65px;
    font-weight: 800;
    letter-spacing: -.1em;
    color: #655ceb;
    line-height: 1;
  }

  .blog-matched-intro__shape small {
    font-size: 8px;
    color: #8981be;
    letter-spacing: .2em;
    font-weight: 800;
  }

  .vyora-blog-matched .blog-page-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(290px,350px);
    gap: clamp(25px,4.7vw,73px);
    align-items: start;
    padding: 2px 0 65px;
  }

  .vyora-blog-matched .blog-page-layout.sidebar-left {
    grid-template-columns: minmax(290px,350px) minmax(0,1fr);
  }

  .vyora-blog-matched .blog-posts-list {
    gap: 36px;
  }

  .vyora-blog-matched .blog-post-card__media {
    height: 305px;
    aspect-ratio: auto;
    border-radius: 19px;
  }

  .vyora-blog-matched .blog-post-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 40%;
  }

  .vyora-blog-matched .blog-post-card__media img[src$=".svg"] {
    object-fit: contain;
    padding: 65px;
    background: #f2f1fd;
  }

  .vyora-blog-matched .blog-post-card__content {
    padding-top: 20px;
  }

  .vyora-blog-matched .blog-post-meta {
    font-size: 11px;
    letter-spacing: .055em;
  }

  .vyora-blog-matched .blog-post-card__content h2 {
    font-size: clamp(24px,2.2vw,30px);
    letter-spacing: -.045em;
    line-height: 1.25;
    margin: 10px 0 10px;
    max-width: 900px;
  }

  .vyora-blog-matched .blog-post-card__content p {
    font-size: 15px;
    color: #59627a;
    line-height: 1.75;
    max-width: 850px;
    margin: 0 0 16px;
  }

  .vyora-blog-matched .blog-sidebar {
    gap: 20px;
  }

  .vyora-blog-matched .blog-search-form {
    height: 54px;
    border-radius: 16px;
  }

  .vyora-blog-matched .blog-search-input {
    font-size: 13px;
  }

  .vyora-blog-matched .blog-sidebar-card {
    border-radius: 22px;
    padding: 23px;
  }

  .vyora-blog-matched .blog-sidebar-card h3 {
    font-size: 19px;
    margin-bottom: 18px;
  }

  .vyora-blog-matched .blog-sidebar-recent__item {
    grid-template-columns: 78px 1fr;
    gap: 12px;
  }

  .vyora-blog-matched .blog-sidebar-recent__item img {
    width: 78px;
    height: 74px;
    border-radius: 12px;
    object-fit: cover;
  }

  .vyora-blog-matched .blog-sidebar-recent__item b {
    font-size: 12px;
  }

  .vyora-blog-matched .blog-sidebar-recent__item span {
    font-size: 10px;
  }

  .vyora-blog-matched .blog-sidebar-banner {
    background: linear-gradient(145deg,#232a4a,#171c2e);
    border-radius: 22px;
  }

  .vyora-blog-matched .blog-detail-layout {
    padding-top: 3px;
  }

  .vyora-blog-matched .blog-detail-article h1 {
    font-size: clamp(28px,2.85vw,42px);
    line-height: 1.2;
    max-width: 100%;
    margin: 15px 0 25px;
  }

  .vyora-blog-matched .blog-detail-hero {
    height: 395px;
    aspect-ratio: auto;
    border-radius: 20px;
  }

  .vyora-blog-matched .blog-detail-hero img {
    object-position: center 40%;
  }

  .vyora-blog-matched .blog-detail-copy p {
    font-size: 16px;
    line-height: 1.82;
  }

  .vyora-blog-matched .blog-comment-body p {
    font-size: 14px;
    line-height: 1.75;
  }

  .vyora-blog-matched .blog-detail-gallery img {
    height: 235px;
  }

  @media (max-width:1370px) {
    .vyora-blog-matched .commerce-container {
      width: min(calc(100% - 78px),1520px);
    }

    .vyora-blog-matched .blog-page-layout {
      grid-template-columns: minmax(0,1fr) 295px;
      gap: 35px;
    }

    .vyora-blog-matched .blog-page-layout.sidebar-left {
      grid-template-columns: 295px minmax(0,1fr);
    }
  }

  @media (max-width:850px) {
    .vyora-blog-matched .commerce-container {
      width: min(calc(100% - 48px),650px);
    }

    .vyora-blog-matched .blog-page-layout,
    .vyora-blog-matched .blog-page-layout.sidebar-left {
      grid-template-columns: 1fr;
      gap: 26px;
    }

    .vyora-blog-matched .blog-page-layout.sidebar-left .blog-page-layout__sidebar {
      order: 2;
    }

    .vyora-blog-matched .blog-post-card__media {
      height: 270px;
    }

    .vyora-blog-matched .blog-matched-intro {
      padding: 31px 0 30px;
    }

    .blog-matched-intro__shape {
      display: none;
    }

    .vyora-blog-matched .blog-sidebar {
      grid-template-columns: 1fr 1fr;
      align-items: start;
    }

    .vyora-blog-matched .blog-search-form {
      grid-column: 1/-1;
    }
  }

  @media (max-width:550px) {
    .vyora-blog-matched .commerce-container {
      width: calc(100% - 36px);
    }

    .vyora-blog-matched .blog-matched-breadcrumb {
      padding: 17px 0 12px;
      font-size: 11px;
    }

    .vyora-blog-matched .blog-matched-intro {
      padding: 21px 0 31px;
    }

    .vyora-blog-matched .blog-matched-intro h1 {
      font-size: clamp(36px,9.6vw,44px);
      margin: 12px 0;
    }

    .vyora-blog-matched .blog-matched-intro p {
      font-size: 13px;
      line-height: 1.75;
    }

    .blog-matched-eyebrow {
      font-size: 9px;
    }

    .vyora-blog-matched .blog-page-layout {
      padding-bottom: 38px;
    }

    .vyora-blog-matched .blog-posts-list {
      gap: 30px;
    }

    .vyora-blog-matched .blog-post-card__media {
      height: 220px;
      border-radius: 15px;
    }

    .vyora-blog-matched .blog-post-card__media img[src$=".svg"] {
      padding: 45px;
    }

    .vyora-blog-matched .blog-post-card__content h2 {
      font-size: 22px;
    }

    .vyora-blog-matched .blog-post-card__content p {
      font-size: 13px;
    }

    .vyora-blog-matched .blog-sidebar {
      grid-template-columns: 1fr;
    }

    .vyora-blog-matched .blog-search-form {
      grid-column: auto;
    }

    .vyora-blog-matched .blog-detail-article h1 {
      font-size: 28px;
    }

    .vyora-blog-matched .blog-detail-hero {
      height: 245px;
    }

    .vyora-blog-matched .blog-detail-gallery img {
      height: 145px;
    }
  }

  .vyora-blog-matched .blog-ref-crumbshell {
    margin-bottom: 16px;
  }

  @media (max-width:550px) {
    .vyora-blog-matched .blog-ref-crumbshell {
      margin-bottom: 10px;
    }
  }
}

/* ==================================================
   18. Password Settings
================================================== */

@scope (
  html:is(
    [data-vyora-page="account-settings.html"]
  )
) {
  .vyora-account-page .account-password-card__intro {
    margin: 7px 0 0;
    color: #65718a;
    font-size: 13px;
    line-height: 1.55;
    font-weight: 500;
  }

  .vyora-account-page .account-password-form {
    margin: 0;
  }

  .vyora-account-page .account-password-fields {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 15px;
  }

  .vyora-account-page .account-password-fields .account-field label {
    font-size: 12px;
    margin-bottom: 7px;
    color: #293450;
  }

  .vyora-account-page .account-password-control {
    position: relative;
    min-width: 0;
  }

  .vyora-account-page .account-password-control input {
    display: block;
    width: 100%;
    height: 46px;
    padding: 0 13px 0 62px;
    border-radius: 10px;
    background: #fbfbff;
    border: 1px solid #e4e6f1;
    color: #242d45;
    font: inherit;
    font-size: 13px;
    outline: 0;
    transition: border-color .15s,box-shadow .15s;
  }

  .vyora-account-page .account-password-control input:focus {
    border-color: #756df0;
    box-shadow: 0 0 0 3px rgba(101,92,235,.11);
  }

  .vyora-account-page .account-password-control input::placeholder {
    color: #8891a7;
  }

  .vyora-account-page .account-password-toggle {
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    min-width: 49px;
    height: 34px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #6058ca;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
  }

  .vyora-account-page .account-password-toggle:hover,
  .vyora-account-page .account-password-toggle:focus-visible {
    background: #f0eeff;
    outline: none;
  }

  .vyora-account-page .account-password-help {
    margin: 11px 0 15px;
    color: #637087;
    font-size: 12px;
    line-height: 1.5;
  }

  .vyora-account-page .account-password-actions {
    display: flex;
    align-items: center;
    gap: 13px;
    flex-wrap: wrap;
  }

  .vyora-account-page .account-password-feedback {
    font-size: 12px;
    line-height: 1.6;
    font-weight: 700;
    color: #495473;
    max-width: 620px;
  }

  .vyora-account-page .account-password-feedback.is-error {
    color: #b73a4d;
  }

  .vyora-account-page .account-password-feedback.is-valid {
    color: #426e58;
  }

  .vyora-account-page .account-password-disclaimer {
    margin: 11px 0 0;
    color: #828ca1;
    font-size: 11px;
    line-height: 1.65;
  }

  @media (max-width:1120px) {
    .vyora-account-page .account-password-fields {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }

  @media (max-width:700px) {
    .vyora-account-page .account-password-fields {
      grid-template-columns: minmax(0,1fr);
      gap: 13px;
    }

    .vyora-account-page .account-password-control input {
      height: 46px;
    }

    .vyora-account-page .account-password-actions .account-cta {
      min-height: 42px;
    }
  }
}

/* ==================================================
   19. Unified Navbar
================================================== */

@scope (
  html:is(
    [data-vyora-page="about.html"],
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"],
    [data-vyora-style-group="g04"],
    [data-vyora-style-group="g05"],
    [data-vyora-page="category.html"],
    [data-vyora-page="confirmation.html"],
    [data-vyora-page="contact.html"],
    [data-vyora-page="faq.html"],
    [data-vyora-page="index.html"],
    [data-vyora-style-group="g12"],
    [data-vyora-page="single-product.html"],
    [data-vyora-page="testimonial.html"]
  )
) {
  .site-header.vyora-header-v3,
  .vyora-blog-matched .site-header.vyora-header-v3,
  .vyora-blog-refined .site-header.vyora-header-v3 {
    position: relative !important;
    top: auto !important;
    z-index: 130;
    background: #fff;
    border-bottom: 1px solid #eaecf3;
    box-shadow: none;
    backdrop-filter: none;
    font-family: "Manrope","Plus Jakarta Sans","Segoe UI",Arial,sans-serif;
  }

  .site-header.vyora-header-v3 *,
  .site-header.vyora-header-v3 *::before,
  .site-header.vyora-header-v3 *::after {
    box-sizing: border-box;
  }

  .site-header.vyora-header-v3 .commerce-container,
  .vyora-blog-matched .site-header.vyora-header-v3 .commerce-container {
    width: min(calc(100% - 112px),1520px);
    margin-inline: auto;
  }

  .site-header.vyora-header-v3 .commerce-header-row {
    height: 88px;
    min-height: 88px;
    gap: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
  }

  .site-header.vyora-header-v3 .commerce-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: none;
    min-width: 0;
    white-space: nowrap;
  }

  .site-header.vyora-header-v3 .commerce-brand__mark {
    width: 31px;
    height: 31px;
    flex: none;
  }

  .site-header.vyora-header-v3 .commerce-brand__name {
    font-size: 27px;
    line-height: 1;
    letter-spacing: -.06em;
    font-weight: 800;
    color: #171c2e;
  }

  .site-header.vyora-header-v3 .categories-control {
    position: relative;
    flex: none;
  }

  .site-header.vyora-header-v3 .categories-trigger {
    height: 48px;
    min-height: 48px;
    min-width: 198px;
    border-radius: 999px;
    font-size: 13px;
    padding: 0 18px;
    gap: 12px;
    box-shadow: none;
  }

  .site-header.vyora-header-v3 .commerce-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(13px,1.65vw,27px);
    flex: 1;
    min-width: 0;
    margin-right: auto;
  }

  .site-header.vyora-header-v3 .commerce-nav>a,
  .site-header.vyora-header-v3 .commerce-nav__group>summary {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.2;
    white-space: nowrap;
    color: #22293e;
  }

  .site-header.vyora-header-v3 .commerce-nav>a:hover,
  .site-header.vyora-header-v3 .commerce-nav__group>summary:hover,
  .site-header.vyora-header-v3 .commerce-nav__group[open]>summary,
  .site-header.vyora-header-v3 .commerce-nav .commerce-nav__active {
    color: #655ceb;
  }

  .site-header.vyora-header-v3 .commerce-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex: none;
    margin-right: 5px;
  }

  .site-header.vyora-header-v3 .commerce-icon-button {
    position: relative;
    display: grid;
    place-items: center;
    width: 41px;
    height: 43px;
    min-width: 41px;
    flex: none;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 11px;
    color: #1b2340;
  }

  .site-header.vyora-header-v3 .commerce-icon-button svg {
    display: block;
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
  }

  .site-header.vyora-header-v3 .commerce-actions .mobile-menu-toggle {
    display: none;
  }

  .site-header.vyora-header-v3 .commerce-actions .cart-shortcut {
    position: relative;
    overflow: visible;
    isolation: isolate;
  }

    .site-header.vyora-header-v3 .commerce-actions .cart-shortcut>.vyora-cart-count {
    position: absolute !important;
    top: 2px !important;
    left: 1px !important;
    right: auto !important;
    z-index: 2;
    display: grid;
    place-items: center;
    min-width: 17px;
    width: auto;
    height: 17px;
    padding: 0 4px;
    margin: 0;
    border-radius: 999px;
    border: 1px solid #fff;
    background: #655ceb;
    color: #fff;
    font-family: inherit;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0;
    transform: none;
    box-shadow: none;
    pointer-events: none;
  }

  .site-header.vyora-header-v3 .commerce-actions .cart-shortcut>.vyora-cart-count[hidden] {
    display: none !important;
  }

  .site-header.vyora-header-v3 .categories-dropdown {
    z-index: 150;
  }

  @media (max-width:1370px) {
    .site-header.vyora-header-v3 .commerce-container,
    .vyora-blog-matched .site-header.vyora-header-v3 .commerce-container {
      width: min(calc(100% - 78px),1520px);
    }

    .site-header.vyora-header-v3 .commerce-header-row {
      gap: 16px;
    }

    .site-header.vyora-header-v3 .commerce-actions {
      gap: 7px;
      margin-right: 0;
    }

    .site-header.vyora-header-v3 .categories-trigger {
      min-width: 180px;
      padding-inline: 14px;
    }
  }

  @media (max-width:1170px) {
    .site-header.vyora-header-v3 .commerce-header-row {
      height: 79px;
      min-height: 79px;
    }

    .site-header.vyora-header-v3 .commerce-actions .mobile-menu-toggle {
      display: grid;
      background: #f5f3ff;
      color: #655ceb;
    }

    .site-header.vyora-header-v3 .commerce-nav {
      display: none;
      position: absolute;
      right: 50%;
      top: calc(100% + 9px);
      transform: translateX(50%);
      z-index: 150;
      width: min(560px,calc(100% - 38px));
      margin: 0;
      padding: 16px;
      flex-direction: column;
      align-items: stretch;
      gap: 3px;
      background: #fff;
      border: 1px solid #e8e9f3;
      border-radius: 18px;
      box-shadow: 0 22px 54px rgba(23,28,46,.15);
      max-height: 70vh;
      overflow-y: auto;
    }

    .site-header.vyora-header-v3 .commerce-nav.is-open {
      display: flex;
    }

    .site-header.vyora-header-v3 .commerce-nav>a,
    .site-header.vyora-header-v3 .commerce-nav__group>summary {
      width: 100%;
      min-height: 44px;
      padding: 8px 12px;
      font-size: 14px;
      justify-content: space-between;
    }

    .site-header.vyora-header-v3 .commerce-nav__submenu {
      position: static;
      box-shadow: none;
      margin: 2px 8px 10px;
      padding: 5px;
      background: #f8f8fc;
      border-radius: 11px;
    }

    .site-header.vyora-header-v3 .commerce-nav__submenu::before {
      display: none;
    }

    .site-header.vyora-header-v3 .commerce-actions {
      margin-right: auto;
    }
  }

  @media (max-width:850px) {
    .site-header.vyora-header-v3 .commerce-container,
    .vyora-blog-matched .site-header.vyora-header-v3 .commerce-container {
      width: min(calc(100% - 48px),650px);
    }

    .site-header.vyora-header-v3 .commerce-header-row {
      height: 76px;
      min-height: 76px;
      gap: 12px;
    }

    .site-header.vyora-header-v3 .commerce-brand__name {
      font-size: 25px;
    }

    .site-header.vyora-header-v3 .categories-trigger {
      width: 48px;
      min-width: 48px;
      height: 46px;
      min-height: 46px;
      padding: 0;
      justify-content: center;
    }

    .site-header.vyora-header-v3 .categories-trigger>span,
    .site-header.vyora-header-v3 .categories-trigger .categories-chevron {
      display: none;
    }

    .site-header.vyora-header-v3 .commerce-actions {
      gap: 4px;
    }

    .site-header.vyora-header-v3 .commerce-icon-button {
      width: 38px;
      min-width: 38px;
      height: 42px;
    }
  }

  @media (max-width:550px) {
    .site-header.vyora-header-v3 .commerce-container,
    .vyora-blog-matched .site-header.vyora-header-v3 .commerce-container {
      width: calc(100% - 36px);
    }

    .site-header.vyora-header-v3 .commerce-header-row {
      height: 70px;
      min-height: 70px;
      gap: 7px;
    }

    .site-header.vyora-header-v3 .commerce-brand {
      gap: 5px;
    }

    .site-header.vyora-header-v3 .commerce-brand__mark {
      width: 25px;
      height: 28px;
      transform: scale(.82) rotate(-13deg);
    }

    .site-header.vyora-header-v3 .commerce-brand__name {
      font-size: 22px;
    }

    .site-header.vyora-header-v3 .categories-control {
      margin-right: auto;
    }

    .site-header.vyora-header-v3 .categories-trigger {
      min-width: 37px;
      width: 37px;
      height: 38px;
      min-height: 38px;
      border-radius: 11px;
    }

    .site-header.vyora-header-v3 .commerce-actions {
      gap: 0;
      margin-right: 0;
    }

    .site-header.vyora-header-v3 .commerce-icon-button {
      width: 35px;
      min-width: 35px;
      height: 39px;
    }

    .site-header.vyora-header-v3 .commerce-icon-button svg {
      width: 19px;
      height: 19px;
    }

    .site-header.vyora-header-v3 .commerce-actions .favorites-trigger {
      display: none;
    }

    .site-header.vyora-header-v3 .commerce-actions .cart-shortcut>.vyora-cart-count {
      top: 1px !important;
      left: 0 !important;
      min-width: 16px;
      height: 16px;
      font-size: 9px;
    }
  }

  @media (max-width:360px) {
    .site-header.vyora-header-v3 .commerce-header-row {
      gap: 4px;
    }

    .site-header.vyora-header-v3 .commerce-brand__name {
      font-size: 20px;
    }

    .site-header.vyora-header-v3 .commerce-brand__mark {
      width: 23px;
    }

    .site-header.vyora-header-v3 .commerce-icon-button {
      width: 33px;
      min-width: 33px;
    }
  }

  .site-header.vyora-header-v3 .commerce-nav>a.commerce-nav__active,
  .site-header.vyora-header-v3 .commerce-nav__group.commerce-nav__active>summary {
    color: #655ceb !important;
    font-weight: 800;
  }

  .site-header.vyora-header-v3 .commerce-nav>a.commerce-nav__active::after,
  .site-header.vyora-header-v3 .commerce-nav__group.commerce-nav__active>summary::after {
    content: "";
    position: absolute;
    right: 0;
    left: 0;
    bottom: -2px;
    height: 2px;
    border-radius: 2px;
    background: #655ceb;
  }

  .site-header.vyora-header-v3 .commerce-nav>a.commerce-nav__active,
  .site-header.vyora-header-v3 .commerce-nav__group.commerce-nav__active>summary {
    position: relative;
  }

  .site-header.vyora-header-v3 .commerce-nav__submenu a[aria-current="page"] {
    background: #f1efff;
    color: #5149d5;
    font-weight: 800;
  }

  .site-header.vyora-header-v3 .commerce-nav__submenu {
    max-height: min(72vh,480px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #c9c4f5 transparent;
  }

  @media (max-width:1170px) {
    .site-header.vyora-header-v3 .commerce-nav>a.commerce-nav__active,
    .site-header.vyora-header-v3 .commerce-nav__group.commerce-nav__active>summary {
      background: #f1efff;
      border-radius: 10px;
      padding-inline: 12px;
    }

    .site-header.vyora-header-v3 .commerce-nav>a.commerce-nav__active::after,
    .site-header.vyora-header-v3 .commerce-nav__group.commerce-nav__active>summary::after {
      display: none;
    }

    .site-header.vyora-header-v3 .commerce-nav__submenu {
      max-height: none;
      overflow: visible;
    }
  }

    @media (min-width:1171px) and (hover:hover) and (pointer:fine) {
    .site-header.vyora-header-v3 .commerce-nav__group {
      position: relative;
    }

    .site-header.vyora-header-v3 .commerce-nav__group>.commerce-nav__submenu {
      top: calc(100% - 2px);
      margin-top: 0;
      transform: none;
      z-index: 210;
    }
  }

  .site-header.vyora-header-v3 .categories-dropdown a.is-selected {
    background: #f1efff;
    color: #5149d5;
    font-weight: 800;
  }
}

/* ==================================================
   20. Customer Messages
================================================== */

@scope (
  html:is(
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"]
  )
) {
  .vyora-account-page .mail-nav-count {
    display: inline-grid;
    place-items: center;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    margin-right: auto;
    border-radius: 999px;
    background: #efedff;
    color: #5c54db;
    font: 800 10px/1 "Manrope",sans-serif;
  }

  .vyora-account-page .account-menu__link.is-active .mail-nav-count {
    background: #675af0;
    color: #fff;
  }

  .vyora-account-page .mail-nav-count[hidden] {
    display: none!important;
  }

  .vyora-account-page .mail-account-panel .account-panel-heading {
    margin-bottom: 15px;
  }

  .vyora-account-page .mail-demo-label {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .085em;
    background: #f0efff;
    color: #5d54d9;
    border-radius: 99px;
    padding: 8px 12px;
    white-space: nowrap;
  }

  .vyora-account-page .mail-workspace {
    display: grid;
    grid-template-columns: minmax(260px,.43fr) minmax(0,.57fr);
    min-height: 595px;
    border: 1px solid #e6e7f1;
    overflow: hidden;
    border-radius: 19px;
    background: #fff;
    box-shadow: 0 15px 36px rgba(23,28,46,.027);
  }

  .vyora-account-page .mail-list-panel {
    border-left: 1px solid #ebedf5;
    min-width: 0;
    background: #fff;
  }

  .vyora-account-page .mail-list-top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 8px;
    padding: 19px 17px 15px;
  }

  .vyora-account-page .mail-mini-kicker {
    color: #675cf1;
    font-size: 10px;
    letter-spacing: .12em;
    font-weight: 800;
  }

  .vyora-account-page .mail-list-top h3 {
    font-size: 23px;
    font-weight: 800;
    letter-spacing: -.045em;
    margin: 3px 0 0;
  }

  .vyora-account-page .mail-count {
    display: inline-block;
    vertical-align: middle;
    padding: 4px 8px;
    border-radius: 9px;
    background: #f3f2ff;
    color: #655ceb;
    font-size: 11px;
    letter-spacing: 0;
  }

  .vyora-account-page .mail-unread-pill {
    padding: 6px 9px;
    border-radius: 99px;
    background: #f7f6ff;
    font-weight: 800;
    font-size: 10px;
    color: #6e63d7;
  }

  .vyora-account-page .mail-folders {
    display: flex;
    gap: 5px;
    margin: 0 16px 15px;
    padding: 4px;
    border-radius: 12px;
    background: #f7f7fc;
  }

  .vyora-account-page .mail-folder {
    flex: 1;
    min-width: 0;
    border: 0;
    border-radius: 9px;
    padding: 10px 4px;
    white-space: nowrap;
    background: transparent;
    color: #7a8499;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
    transition: background .2s,color .2s;
  }

  .vyora-account-page .mail-folder.is-active {
    background: #fff;
    color: #5d51dc;
    box-shadow: 0 2px 8px rgba(23,28,46,.06);
  }

  .vyora-account-page .mail-search-row {
    display: flex;
    gap: 7px;
    margin: 0 16px 13px;
    align-items: center;
  }

  .vyora-account-page .mail-search {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex: 1;
    border: 1px solid #e5e7f1;
    border-radius: 10px;
    background: #fbfbff;
    padding: 0 9px;
    height: 42px;
  }

  .vyora-account-page .mail-search svg {
    height: 16px;
    width: 16px;
    fill: none;
    stroke: #8189aa;
    stroke-width: 1.9;
    stroke-linecap: round;
    flex: none;
  }

  .vyora-account-page .mail-search input {
    height: 39px;
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #333b52;
    font-size: 11px;
  }

  .vyora-account-page .mail-search:focus-within {
    border-color: #8f84ff;
    box-shadow: 0 0 0 3px #edebff;
  }

  .vyora-account-page #mail-read-filter {
    height: 42px;
    width: 86px;
    max-width: 90px;
    padding: 0 6px;
    color: #59647d;
    border: 1px solid #e5e7f1;
    border-radius: 10px;
    background: #fbfbff;
    font-size: 11px;
    outline: 0;
  }

  .vyora-account-page .mail-items {
    max-height: 560px;
    overflow-y: auto;
    scrollbar-color: #dedcf2 transparent;
    scrollbar-width: thin;
    border-top: 1px solid #f0f1f7;
  }

  .vyora-account-page .mail-item {
    display: flex;
    width: 100%;
    gap: 12px;
    padding: 16px 14px;
    border: 0;
    border-bottom: 1px solid #f0f1f7;
    text-align: right;
    background: #fff;
    color: #171c2e;
    cursor: pointer;
    position: relative;
    transition: background .2s;
  }

  .vyora-account-page .mail-item:hover,
  .vyora-account-page .mail-item.is-selected {
    background: #f6f5ff;
  }

  .vyora-account-page .mail-item.is-unread::before {
    content: "";
    position: absolute;
    width: 4px;
    border-radius: 4px;
    right: 0;
    top: 18px;
    bottom: 18px;
    background: #665bef;
  }

  .vyora-account-page .mail-item__avatar,
  .vyora-account-page .mail-sender-avatar {
    width: 37px;
    height: 37px;
    flex: none;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #efedff;
    color: #665beb;
    font-size: 12px;
    font-weight: 800;
  }

  .vyora-account-page .mail-item__body {
    min-width: 0;
    flex: 1;
  }

  .vyora-account-page .mail-item__line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 5px;
  }

  .vyora-account-page .mail-item__line strong {
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 750;
    min-width: 0;
  }

  .vyora-account-page .mail-item.is-unread .mail-item__line strong,
  .vyora-account-page .mail-item.is-unread .mail-item__subject {
    font-weight: 850;
  }

  .vyora-account-page .mail-item__date {
    color: #939bb0;
    font-size: 10px;
    white-space: nowrap;
    flex: none;
  }

  .vyora-account-page .mail-item__subject {
    display: block;
    font-size: 12px;
    line-height: 1.5;
    color: #30364c;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 650;
  }

  .vyora-account-page .mail-item__summary {
    display: block;
    font-size: 11px;
    color: #8891a6;
    line-height: 1.6;
    margin-top: 4px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .vyora-account-page .mail-item__foot {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    min-height: 13px;
    color: #7167cd;
    font-size: 10px;
    font-weight: 750;
  }

  .vyora-account-page .mail-small-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #675ceb;
    display: inline-block;
  }

  .vyora-account-page .mail-list-empty {
    padding: 38px 20px;
    text-align: center;
  }

  .vyora-account-page .mail-list-empty span,
  .vyora-account-page .mail-reader-empty>span {
    font-size: 29px;
    color: #a9a3f8;
  }

  .vyora-account-page .mail-list-empty strong {
    display: block;
    margin: 8px 0 4px;
    font-size: 14px;
  }

  .vyora-account-page .mail-list-empty p {
    font-size: 11px;
    color: #8790a4;
  }

  .vyora-account-page .mail-reader {
    min-width: 0;
    background: linear-gradient(155deg,#fff 0%,#fff 66%,#fcfbff 100%);
  }

  .vyora-account-page .mail-reader-inner {
    padding: 24px 25px 26px;
    min-height: 100%;
  }

  .vyora-account-page .mail-reader-empty {
    display: flex;
    min-height: 480px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    color: #78829b;
  }

  .vyora-account-page .mail-reader-empty h3 {
    font-size: 22px;
    margin: 9px 0 3px;
    color: #171c2e;
    font-weight: 800;
  }

  .vyora-account-page .mail-reader-empty p {
    font-size: 12px;
    max-width: 260px;
    line-height: 1.7;
  }

  .vyora-account-page .mail-reader-back {
    display: none;
    align-items: center;
    gap: 7px;
    margin-bottom: 14px;
    border: 0;
    background: transparent;
    color: #6156e0;
    font-size: 12px;
    font-weight: 800;
    padding: 0;
  }

  .vyora-account-page .mail-reader-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 19px;
    border-bottom: 1px solid #e9ebf5;
  }

  .vyora-account-page .mail-reader-header h3 {
    font-weight: 800;
    font-size: clamp(19px,2vw,25px);
    line-height: 1.28;
    margin: 9px 0 8px;
    letter-spacing: -.045em;
  }

  .vyora-account-page .mail-reader-header p {
    margin: 0;
    color: #808aa1;
    font-size: 11px;
  }

  .vyora-account-page .mail-reader-actions {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .vyora-account-page .mail-icon-action {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid #e6e8f2;
    border-radius: 9px;
    background: #fff;
    color: #66718e;
    cursor: pointer;
  }

  .vyora-account-page .mail-icon-action:hover {
    color: #655ceb;
    border-color: #bcb5ff;
    background: #f8f7ff;
  }

  .vyora-account-page .mail-icon-action svg {
    height: 17px;
    width: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .vyora-account-page .mail-sender-row {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 20px 0;
  }

  .vyora-account-page .mail-sender-row>div:nth-child(2) {
    min-width: 0;
  }

  .vyora-account-page .mail-sender-row strong {
    display: block;
    font-size: 13px;
  }

  .vyora-account-page .mail-sender-row span {
    display: block;
    color: #8790a4;
    font-size: 11px;
    overflow-wrap: anywhere;
    margin-top: 4px;
  }

  .vyora-account-page .mail-sender-row time {
    margin-right: auto;
    font-size: 10px;
    color: #8a94a8;
    white-space: nowrap;
  }

  .vyora-account-page .mail-message-body {
    font-size: 12px;
    line-height: 1.92;
    color: #536078;
    white-space: pre-line;
    margin: 12px 0 22px;
  }

  .vyora-account-page .mail-attachments {
    border-top: 1px solid #ebecf3;
    padding: 17px 0 13px;
  }

  .vyora-account-page .mail-attachments>strong {
    display: block;
    color: #31394f;
    font-size: 12px;
    margin-bottom: 10px;
  }

  .vyora-account-page .mail-attachment-item {
    display: flex;
    gap: 9px;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid #e8e9f3;
    border-radius: 10px;
    text-decoration: none!important;
    color: #3e4561;
    background: #fff;
    margin-bottom: 8px;
  }

  .vyora-account-page .mail-attachment-item:hover {
    border-color: #afa6ff;
    color: #635ae3;
  }

  .vyora-account-page .mail-attachment-item span {
    min-width: 0;
    flex: 1;
  }

  .vyora-account-page .mail-attachment-item b {
    font-size: 11px;
    display: block;
    overflow-wrap: anywhere;
  }

  .vyora-account-page .mail-attachment-item small {
    font-size: 10px;
    color: #8b94a8;
  }

  .vyora-account-page .mail-reply-preview {
    border: 1px solid #e5e2ff;
    background: #f9f8ff;
    border-radius: 13px;
    padding: 15px;
    margin: 14px 0 18px;
  }

  .vyora-account-page .mail-reply-preview>strong {
    font-size: 11px;
    color: #5c55df;
    display: block;
    margin-bottom: 7px;
  }

  .vyora-account-page .mail-reply-preview p {
    font-size: 12px;
    white-space: pre-line;
    line-height: 1.8;
    color: #4a526d;
    margin: 0;
  }

  .vyora-account-page .mail-reply-preview small {
    display: block;
    margin-top: 8px;
    color: #8387ad;
    font-size: 10px;
  }

  .vyora-account-page .mail-reader-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 17px;
    border-top: 1px solid #edeef6;
    flex-wrap: wrap;
  }

  .vyora-account-page .mail-reader-footer small {
    font-size: 10px;
    color: #9ba1af;
  }

  .vyora-account-page .mail-primary-button {
    display: inline-flex;
    gap: 13px;
    align-items: center;
    justify-content: center;
    background: #675ced;
    border: 1px solid #675ced;
    border-radius: 10px;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    padding: 12px 18px;
    cursor: pointer;
  }

  .vyora-account-page .mail-primary-button:hover {
    background: #5549d8;
    color: #fff;
  }

  .vyora-account-page .mail-outline-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #e2e4ed;
    border-radius: 10px;
    color: #505b77;
    font-size: 12px;
    font-weight: 800;
    padding: 11px 16px;
    cursor: pointer;
  }

  .vyora-account-page .mail-outline-button:hover {
    border-color: #c1bbff;
    color: #6258e8;
  }

  .vyora-account-page .mail-bottom-note {
    margin: 16px 0 0;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #7d869d;
    font-size: 11px;
  }

  .vyora-account-page .mail-bottom-note svg {
    width: 17px;
    height: 17px;
    flex: none;
    fill: none;
    stroke: #756de6;
    stroke-width: 1.8;
    stroke-linecap: round;
  }

  .vyora-account-page .mail-bottom-note p {
    margin: 0;
    line-height: 1.7;
  }

  .vyora-account-page .mail-dashboard-preview {
    margin-top: 16px;
  }

  .vyora-account-page .mail-dashboard-preview__list {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
  }

  .vyora-account-page .mail-dashboard-preview__item {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #ededf4;
    border-radius: 12px;
    padding: 12px;
    color: #1d2840;
    text-decoration: none!important;
    min-width: 0;
  }

  .vyora-account-page .mail-dashboard-preview__item:hover {
    background: #f8f7ff;
  }

  .vyora-account-page .mail-dashboard-preview__item span {
    min-width: 0;
    flex: 1;
  }

  .vyora-account-page .mail-dashboard-preview__item strong,
  .vyora-account-page .mail-dashboard-preview__item small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .vyora-account-page .mail-dashboard-preview__item strong {
    font-size: 12px;
  }

  .vyora-account-page .mail-dashboard-preview__item small {
    font-size: 10px;
    color: #808aa2;
    margin-top: 3px;
  }

  .vyora-account-page .mail-dashboard-preview__loading {
    font-size: 12px;
    color: #7d869d;
  }

  .vyora-account-page .mail-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(17,23,42,.6);
    padding: 20px;
    display: grid;
    place-items: center;
    overflow-y: auto;
    backdrop-filter: blur(5px);
  }

  .vyora-account-page .mail-modal-backdrop[hidden] {
    display: none!important;
  }

  .vyora-account-page .mail-compose-modal {
    width: min(100%,565px);
    background: #fff;
    border: 1px solid #e6e7f2;
    border-radius: 18px;
    box-shadow: 0 30px 85px rgba(6,9,27,.27);
    padding: 25px;
    max-height: min(94vh,840px);
    overflow-y: auto;
  }

  .vyora-account-page .mail-compose-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 17px;
  }

  .vyora-account-page .mail-compose-head h2 {
    font-size: 22px;
    letter-spacing: -.045em;
    font-weight: 800;
    margin: 5px 0 0;
  }

  .vyora-account-page .mail-close {
    width: 33px;
    height: 33px;
    border-radius: 9px;
    border: 1px solid #e7e8f1;
    background: #fff;
    color: #5f6780;
    font-size: 23px;
    line-height: 1;
    cursor: pointer;
  }

  .vyora-account-page .mail-compose-meta {
    border: 1px solid #eeeef6;
    border-radius: 12px;
    background: #fafaff;
    padding: 14px;
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
  }

  .vyora-account-page .mail-compose-meta>div {
    display: flex;
    gap: 12px;
    font-size: 12px;
    min-width: 0;
  }

  .vyora-account-page .mail-compose-meta span {
    width: 50px;
    flex: none;
    color: #8c92a6;
  }

  .vyora-account-page .mail-compose-meta strong {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #303a54;
    font-size: 12px;
  }

  .vyora-account-page .mail-compose-label {
    font-size: 12px;
    font-weight: 800;
    display: block;
    margin-bottom: 8px;
  }

  .vyora-account-page #mail-compose-body {
    display: block;
    width: 100%;
    resize: vertical;
    min-height: 145px;
    border: 1px solid #e3e5ef;
    border-radius: 12px;
    padding: 13px 14px;
    background: #fcfcff;
    font-size: 13px;
    line-height: 1.65;
    color: #263149;
    outline: 0;
  }

  .vyora-account-page #mail-compose-body:focus {
    border-color: #877cf6;
    box-shadow: 0 0 0 3px #f0edff;
  }

  .vyora-account-page .mail-compose-actions-info {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 8px;
    font-size: 10px;
    color: #8b93a9;
  }

  .vyora-account-page .mail-attachment-tools {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 20px 0 10px;
    flex-wrap: wrap;
  }

  .vyora-account-page .mail-attach-button {
    border: 1px dashed #aba5ef;
    border-radius: 10px;
    background: #f9f8ff;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #5f55d6;
    padding: 10px 13px;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
  }

  .vyora-account-page .mail-attach-button svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    fill: none;
  }

  .vyora-account-page #mail-reply-attachments {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
  }

  .vyora-account-page #mail-attach-hint {
    font-size: 10px;
    color: #8a93a7;
  }

  .vyora-account-page .mail-chosen-files {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 13px;
  }

  .vyora-account-page .mail-file-chip {
    font-size: 10px;
    border: 1px solid #e5e2ff;
    background: #f8f7ff;
    color: #555e7f;
    padding: 7px 9px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
  }

  .vyora-account-page .mail-file-chip span {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .vyora-account-page .mail-file-chip button {
    background: transparent;
    border: 0;
    color: #6861c9;
    font-size: 15px;
    cursor: pointer;
    padding: 0 2px;
  }

  .vyora-account-page .mail-form-error {
    color: #a83245;
    font-size: 11px;
    margin: 0 0 10px;
  }

  .vyora-account-page .mail-compose-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 17px;
    border-top: 1px solid #eeeef4;
  }

  .vyora-account-page .mail-toast {
    position: fixed;
    z-index: 1100;
    left: 24px;
    bottom: 24px;
    max-width: min(380px,calc(100% - 32px));
    background: #171c2e;
    color: #fff;
    padding: 14px 18px;
    border-radius: 12px;
    box-shadow: 0 12px 38px #171c2e44;
    font-size: 12px;
    line-height: 1.55;
  }

  .vyora-account-page .mail-toast[hidden] {
    display: none!important;
  }

  @media (max-width:1250px) {
    .vyora-account-page .mail-workspace {
      grid-template-columns: minmax(230px,.45fr) minmax(0,.55fr);
    }

    .vyora-account-page .mail-reader-inner {
      padding: 20px 18px;
    }

    .vyora-account-page .mail-item {
      gap: 8px;
      padding: 13px 10px;
    }

    .vyora-account-page .mail-item__avatar {
      width: 32px;
      height: 32px;
    }
  }

  @media (max-width:1100px) {
    .vyora-account-page .mail-workspace {
      grid-template-columns: minmax(260px,.4fr) minmax(0,.6fr);
    }
  }

  @media (max-width:850px) {
    .vyora-account-page .mail-reader-inner {
      padding: 21px;
    }

    .vyora-account-page .mail-workspace {
      grid-template-columns: minmax(260px,.45fr) minmax(0,.55fr);
    }
  }

  @media (max-width:700px) {
    .vyora-account-page .mail-panel-heading {
      align-items: flex-start;
    }

    .vyora-account-page .mail-demo-label {
      font-size: 9px;
    }

    .vyora-account-page .mail-workspace {
      display: block;
      min-height: 0;
    }

    .vyora-account-page .mail-items {
      max-height: none;
    }

    .vyora-account-page .mail-reader {
      display: none;
    }

    .vyora-account-page .mail-workspace.is-reading .mail-list-panel {
      display: none;
    }

    .vyora-account-page .mail-workspace.is-reading .mail-reader {
      display: block;
      min-height: 470px;
    }

    .vyora-account-page .mail-reader-back {
      display: inline-flex;
    }

    .vyora-account-page .mail-reader-header {
      flex-wrap: wrap;
    }

    .vyora-account-page .mail-reader-actions {
      justify-content: flex-start;
    }

    .vyora-account-page .mail-dashboard-preview__list {
      grid-template-columns: 1fr;
    }

    .vyora-account-page .mail-compose-modal {
      padding: 17px;
    }

    .vyora-account-page .mail-list-top {
      padding: 16px;
    }

    .vyora-account-page .mail-bottom-note {
      align-items: flex-start;
    }

    .vyora-account-page .mail-modal-backdrop {
      padding: 10px;
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .vyora-account-page .mail-item,
    .vyora-account-page .mail-folder {
      transition: none;
    }
  }
}

/* ==================================================
   21. Order Tracking
================================================== */

@scope (
  html:is(
    [data-vyora-page="account-settings.html"],
    [data-vyora-style-group="g03"],
    [data-vyora-style-group="g05"]
  )
) {
  .vyora-order-page.cart-main .order-steps {
    margin-top: 0;
  }

  .vyora-order-page .order-breadcrumb + .commerce-container .order-steps {
    margin-top: 9px;
  }

  .track-panel .account-panel-heading {
    margin-bottom: 18px;
  }

  .track-panel .track-search-card {
    padding: 21px 22px 18px;
  }

  .track-search-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 15px;
  }

  .track-demo-badge {
    font-size: 10px;
    font-weight: 750;
    color: #635ad8;
    padding: 8px 11px;
    background: #f1efff;
    border-radius: 999px;
    white-space: nowrap;
  }

  .track-search-form {
    display: flex;
    align-items: end;
    gap: 12px;
  }

  .track-field {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    gap: 7px;
    flex-direction: column;
    color: #18203c;
    font-size: 12px;
    font-weight: 750;
  }

  .track-field input {
    width: 100%;
    height: 45px;
    border: 1px solid #e5e7f1;
    border-radius: 11px;
    background: #fafaff;
    color: #18203c;
    padding: 0 14px;
    outline: 0;
    font-size: 13px;
  }

  .track-field input:focus-visible {
    border-color: #655ceb;
    box-shadow: 0 0 0 3px #eeecff;
  }

  .track-submit {
    height: 45px;
    border: 0;
    background: #655ceb;
    color: #fff;
    border-radius: 11px;
    padding: 0 20px;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 800;
  }

  .track-submit:hover {
    background: #5147d3;
  }

  .track-help {
    color: #73809a;
    font-size: 11px;
    margin: 12px 0 9px;
    line-height: 1.55;
  }

  .track-quick-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
  }

  .track-quick-option {
    background: white;
    color: #5b6480;
    border: 1px solid #e7e7f1;
    padding: 8px 11px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 750;
  }

  .track-quick-option.is-selected,
  .track-quick-option:hover {
    background: #efedff;
    border-color: #dad5ff;
    color: #564bdb;
  }

  .track-feedback {
    color: #b54852;
    font-size: 12px;
    min-height: 0;
    margin: 9px 0 0;
    font-weight: 650;
  }

  .track-feedback:empty {
    display: none;
  }

  .track-result {
    display: flex;
    flex-direction: column;
    gap: 13px;
    margin-top: 14px;
  }

  .track-result[hidden] {
    display: none!important;
  }

  .track-result-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
  }

  .track-result-header h3 {
    font-weight: 800;
    font-size: 21px;
    margin: 6px 0 4px;
    letter-spacing: -.035em;
  }

  .track-result-header p {
    color: #778098;
    font-size: 12px;
    margin: 0;
  }

  .track-result-header__side {
    text-align: left;
    display: flex;
    align-items: flex-end;
    gap: 9px;
    flex-direction: column;
  }

  .track-status {
    padding: 8px 12px;
    font-size: 11px;
    font-weight: 800;
    border-radius: 10px;
    background: #efedff;
    color: #5a53cc;
  }

  .track-status.status-processing {
    background: #fff1da;
    color: #ad690d;
  }

  .track-status.status-on-the-way {
    background: #eaf3ff;
    color: #2769b6;
  }

  .track-status.status-delivered {
    background: #e1f5e9;
    color: #108052;
  }

  .track-result-header__side a,
  .track-help-card a {
    color: #594eee;
    font-weight: 800;
    font-size: 12px;
    text-decoration: none;
  }

  .track-result-header__side a:hover,
  .track-help-card a:hover {
    text-decoration: underline;
  }

  .track-timeline-card {
    padding: 21px 24px!important;
  }

  .track-section-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 15px;
  }

  .track-section-title h3 {
    font-size: 17px;
    margin: 4px 0 0;
    font-weight: 800;
  }

  .track-stage-count {
    font-size: 11px;
    font-weight: 750;
    color: #7b83a0;
    background: #f6f6fb;
    border-radius: 999px;
    padding: 8px 11px;
  }

  .track-timeline {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 8px;
    position: relative;
  }

  .track-timeline::before {
    content: "";
    position: absolute;
    top: 17px;
    right: 8%;
    left: 8%;
    height: 2px;
    background: #eaebf3;
  }

  .track-timeline-step {
    text-align: center;
    position: relative;
    min-width: 0;
    padding: 0 7px;
  }

  .track-timeline-step__mark {
    position: relative;
    display: grid;
    place-items: center;
    height: 34px;
    width: 34px;
    border-radius: 50%;
    border: 1px solid #e6e8f0;
    background: #fff;
    color: #959db3;
    font-weight: 800;
    font-size: 10px;
    margin: 0 auto 11px;
    z-index: 1;
  }

  .track-timeline-step.is-current .track-timeline-step__mark,
  .track-timeline-step.is-complete .track-timeline-step__mark {
    background: #655ceb;
    color: #fff;
    border-color: #655ceb;
    box-shadow: 0 0 0 4px #efedff;
  }

  .track-timeline-step__content strong {
    display: block;
    color: #27304a;
    font-size: 12px;
    line-height: 1.45;
  }

  .track-timeline-step__content p {
    color: #7b859b;
    font-size: 10.5px;
    line-height: 1.65;
    margin: 5px auto 0;
    max-width: 172px;
  }

  .track-step-note {
    display: block;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .025em;
    color: #5e55db;
    margin-top: 6px;
  }

  .track-timeline-step.is-pending .track-timeline-step__content {
    opacity: .55;
  }

  .track-detail-grid {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 13px;
  }

  .track-overview-card dl {
    margin: 12px 0 0;
  }

  .track-overview-card dl>div {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    padding: 9px 0;
    border-bottom: 1px solid #f0f0f5;
    font-size: 12px;
  }

  .track-overview-card dt {
    color: #778098;
    font-weight: 600;
  }

  .track-overview-card dd {
    margin: 0;
    font-weight: 800;
    color: #242b43;
    text-align: left;
  }

  .track-help-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
  }

  .track-help-card h3 {
    font-size: 18px;
    font-weight: 800;
    margin: 7px 0;
  }

  .track-help-card p {
    color: #73809a;
    font-size: 12px;
    line-height: 1.7;
    margin: 2px 0 12px;
  }

  .track-detail-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .vyora-account-page .account-table .account-track-link {
    display: inline-flex;
    margin-right: 10px;
    color: #7777a9;
  }

  .track-dashboard-promo {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 14px;
    background: linear-gradient(102deg,#f9f8ff,#f1efff);
    border-color: #e8e4ff!important;
    padding: 16px 20px!important;
  }

  .track-dashboard-promo__icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #eae6ff;
    color: #635bec;
    flex: none;
  }

  .track-dashboard-promo__icon svg {
    width: 23px;
    height: 23px;
  }

  .track-dashboard-promo h3 {
    font-size: 16px;
    font-weight: 800;
    margin: 3px 0;
  }

  .track-dashboard-promo p {
    font-size: 11px;
    color: #777f99;
    margin: 0;
    line-height: 1.5;
  }

  .track-dashboard-promo__action {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-right: auto;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 800;
    color: #5c52de;
    text-decoration: none;
  }

  .vyora-order-page .order-breadcrumb + .commerce-container .order-steps {
    padding-top: 17px;
    margin-bottom: 28px;
  }

  @media (max-width:840px) {
    .track-detail-grid {
      grid-template-columns: 1fr;
    }

    .track-timeline-step__content p {
      font-size: 10px;
    }

    .track-dashboard-promo {
      flex-wrap: wrap;
    }

    .track-dashboard-promo__action {
      margin-right: 56px;
    }
  }

  @media (max-width:600px) {
    .track-search-form {
      align-items: stretch;
      flex-direction: column;
      gap: 10px;
    }

    .track-submit {
      width: 100%;
    }

    .track-result-header {
      align-items: flex-start;
    }

    .track-result-header__side {
      align-items: flex-end;
    }

    .track-timeline {
      grid-template-columns: 1fr;
      gap: 12px;
    }

    .track-timeline::before {
      top: 14px;
      bottom: 14px;
      right: 16px;
      left: auto;
      width: 2px;
      height: auto;
    }

    .track-timeline-step {
      display: flex;
      gap: 12px;
      text-align: right;
      padding: 0;
    }

    .track-timeline-step__mark {
      flex: none;
      margin: 0;
    }

    .track-timeline-step__content p {
      max-width: none;
    }

    .track-timeline-step__content strong {
      font-size: 12px;
    }

    .track-timeline-card {
      padding: 17px!important;
    }

    .track-section-title {
      align-items: flex-start;
      flex-wrap: wrap;
    }

    .track-detail-grid {
      gap: 10px;
    }

    .track-dashboard-promo__action {
      margin: 0 56px 0 0;
    }

    .vyora-account-page .account-table .account-track-link {
      margin-right: 8px;
    }
  }

  @media (max-width:365px) {
    .track-result-header {
      flex-wrap: wrap;
    }

    .track-result-header__side {
      align-items: flex-start;
      text-align: right;
    }
  }
}

/* ==================================================
   22. RTL Layout
================================================== */

:where(html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3,
  html[dir="rtl"] h4, html[dir="rtl"] h5, html[dir="rtl"] h6,
  html[dir="rtl"] p, html[dir="rtl"] blockquote,
  html[dir="rtl"] dd, html[dir="rtl"] dt) {
  unicode-bidi: plaintext;
  text-align: right;
}

html[dir="rtl"] {
  direction: rtl;
  text-align: start;
}

html[dir="rtl"] .commerce-header-row,
html[dir="rtl"] .commerce-nav,
html[dir="rtl"] .commerce-actions {
  direction: rtl;
}

html[dir="rtl"] .categories-dropdown,
html[dir="rtl"] .commerce-nav__submenu {
  text-align: right;
}

html[dir="rtl"] .commerce-nav__submenu {
  right: -18px;
  left: auto;
}

html[dir="rtl"] .categories-dropdown {
  right: 0;
  left: auto;
}

html[dir="rtl"] .bag-counter {
  right: auto;
  left: -3px;
}

html[dir="rtl"] .account-layout {
  direction: rtl;
}

html[dir="rtl"] .track-timeline,
html[dir="rtl"] .track-timeline-step {
  direction: rtl;
}

html[dir="rtl"] .track-timeline-step {
  text-align: right;
}

html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] input[inputmode="numeric"] {
  direction: ltr;
  text-align: right;
}

html[dir="rtl"] .text-start {
  text-align: right !important;
}

html[dir="rtl"] .text-end {
  text-align: left !important;
}

html[dir="rtl"] .float-start {
  float: right !important;
}

html[dir="rtl"] .float-end {
  float: left !important;
}

html[dir="rtl"] .ms-auto {
  margin-left: 0 !important;
  margin-right: auto !important;
}

html[dir="rtl"] .me-auto {
  margin-right: 0 !important;
  margin-left: auto !important;
}

html[dir="rtl"] [class~="rounded-start"] {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-top-right-radius: var(--bs-border-radius) !important;
  border-bottom-right-radius: var(--bs-border-radius) !important;
}

html[dir="rtl"] [class~="rounded-end"] {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-top-left-radius: var(--bs-border-radius) !important;
  border-bottom-left-radius: var(--bs-border-radius) !important;
}

@media (max-width: 600px) {
  html[dir="rtl"] .track-timeline::before {
    right: 16px;
    left: auto;
  }

  html[dir="rtl"] .track-timeline-step {
    text-align: right;
  }
}

/* ==================================================
   23. Language Switch & Brand
================================================== */

.site-header.vyora-header-v3 .commerce-brand {
  direction: ltr;
  flex-direction: row-reverse;
}

.site-header.vyora-header-v3 .commerce-actions .locale-switch {
  display: grid;
  place-items: center;
  text-decoration: none;
  color: #1b2340;
}

.site-header.vyora-header-v3 .commerce-actions .locale-switch:hover,
.site-header.vyora-header-v3 .commerce-actions .locale-switch:focus-visible {
  background: #f3f1ff;
  color: #655ceb;
}

@media (max-width: 550px) {
  .site-header.vyora-header-v3 .commerce-actions .locale-switch {
    display: grid;
    width: 32px;
    min-width: 32px;
  }
}

@media (max-width: 360px) {
  .site-header.vyora-header-v3 .commerce-actions .locale-switch {
    width: 29px;
    min-width: 29px;
  }
}

html[data-vyora-page="credits.html"] .site-header .commerce-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: none;
  white-space: nowrap;
  text-decoration: none;
  direction: ltr;
}

html[data-vyora-page="credits.html"] .site-header .commerce-brand__mark {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  flex: none;
  width: 31px;
  height: 31px;
  transform: rotate(-13deg);
}

html[data-vyora-page="credits.html"] .site-header .commerce-brand__mark span {
  display: block;
  width: 7px;
  height: 22px;
  border-radius: 3px;
  background: #655ceb;
  transform: skew(-22deg);
}

html[data-vyora-page="credits.html"] .site-header .commerce-brand__mark span:first-child {
  height: 14px;
  align-self: flex-start;
  margin-top: 4px;
  transform: skew(22deg);
}

html[data-vyora-page="credits.html"] .site-header .commerce-brand__mark span:last-child {
  height: 14px;
  align-self: flex-end;
  margin-bottom: 4px;
  transform: skew(22deg);
}

html[data-vyora-page="credits.html"] .site-header .commerce-brand__name {
  color: #171c2e;
  font-family: "Manrope", "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;
  font-size: 27px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.06em;
}

html[data-vyora-page="credits.html"] .site-header .commerce-brand__name > span {
  color: #655ceb;
}