/*
 * Velvet Noir responsive layer.
 * Loaded last so mobile rules also win over page-specific and WooCommerce CSS.
 */
.vn-filter-toggle { display:none; }
@media(max-width:768px) {
 .vn-filter-collapsible .vn-filter-toggle { display:block; width:100%; padding:12px; color:#541326; border:1px solid #bda99d; background:#fffdf9; font-size:13px; }
 .vn-filter-collapsible .vn-filter-toggle[aria-expanded="false"] + .vn-filter-form { display:none; }
 .contact-page .contact-hero { position:relative; isolation:isolate; }
 .contact-page .contact-hero::before { content:""; position:absolute; inset:0; background:rgba(20,12,10,.55); z-index:-1; }
 .contact-page .contact-hero .description { color:#fff8f0!important; text-shadow:0 1px 3px #211710; }
}

html,
body,
#page {
    max-width: 100%;
    overflow-x: clip;
}

img,
svg,
video,
iframe,
table,
form,
fieldset {
    max-width: 100%;
}

button,
input,
select,
textarea {
    font-size: 16px;
}

@media (max-width: 992px) {
    .main-navigation {
        left: 0;
        right: auto;
        max-width: 100vw;
        transform: translateX(100%);
        transition: transform .35s cubic-bezier(.77, 0, .175, 1), visibility .35s;
        visibility: hidden;
    }

    .main-navigation.toggled {
        right: auto;
        transform: translateX(0);
        visibility: visible;
    }

    .main-navigation ul {
        width: 100%;
    }

    .main-navigation a {
        display: block;
        padding: 6px 18px;
        text-align: center;
    }

    body.vn-menu-open {
        overflow: hidden;
    }

    .checkout-wrapper {
        display: block !important;
    }

    .checkout-wrapper .checkout-form-area {
        width: 100%;
    }
}

@media (max-width: 768px) {
    :root {
        --vn-mobile-gutter: 18px;
    }

    .container {
        min-width: 0;
        padding-left: var(--vn-mobile-gutter) !important;
        padding-right: var(--vn-mobile-gutter) !important;
    }

    .top-bar {
        display: block;
        line-height: 1.45;
        padding: 9px var(--vn-mobile-gutter) !important;
        text-align: center;
    }

    .top-bar > span {
        display: block;
        font-size: .66rem;
        letter-spacing: 1.2px;
    }

    .top-bar-links {
        display: none;
    }

    .header-main {
        height: 72px;
        min-height: 72px;
        padding: 10px var(--vn-mobile-gutter) !important;
    }

    .menu-toggle {
        left: var(--vn-mobile-gutter);
        min-height: 44px;
        min-width: 44px;
    }

    .site-logo img,
    .custom-logo-link img {
        height: 50px;
        width: 50px;
    }

    .header-actions {
        gap: 8px;
        right: var(--vn-mobile-gutter);
    }

    .header-actions .account-wrap,
    .header-actions .wishlist-wrap {
        display: none !important;
    }

    .header-action-control {
        height: 40px;
        width: 40px;
    }

    .header-action-control--label {
        border-radius: 50%;
        padding: 0;
    }

    .main-navigation {
        height: 100dvh;
        padding: 104px 24px 42px;
    }

    .search-close {
        right: 18px;
        top: 24px;
    }

    .search-overlay-content h2 {
        font-size: 1.55rem !important;
    }

    .search-field {
        font-size: 1.15rem;
        min-width: 0;
    }

    /* Homepage */
    .hero-section {
        display: block !important;
        min-height: 0 !important;
        padding: 0 !important;
    }

    .hero-section .hero-image {
        min-height: min(112vw, 470px);
        width: 100%;
    }

    .hero-section .hero-text {
        background: #0a0a0a !important;
        border-radius: 0;
        min-height: 360px;
        padding: 56px 24px 62px !important;
        width: 100%;
    }

    .hero-section .hero-text h1 {
        font-size: clamp(2.45rem, 12vw, 3.45rem) !important;
        line-height: 1.05;
    }

    .hero-section .hero-text p {
        font-size: .95rem !important;
    }

    .hero-buttons {
        justify-content: center;
        width: 100%;
    }

    .hero-buttons .btn {
        min-height: 48px;
        padding: 13px 20px;
    }

    .commerce-category-strip {
        padding: 22px 0 34px;
    }

    .commerce-category-grid,
    .commerce-product-grid,
    .commerce-benefits-grid,
    .commerce-instagram-grid,
    .editorial-categories-grid,
    .editorial-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .commerce-category-card {
        min-height: 210px;
        padding: 112px 16px 18px;
    }

    .commerce-category-card span {
        font-size: 1.25rem;
    }

    .commerce-promo-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .commerce-promo {
        min-height: 265px;
        padding: 28px 24px;
    }

    .commerce-benefits-grid > div {
        border-bottom: 1px solid #e5ded7;
        min-width: 0;
        padding: 2px 12px 18px 0;
    }

    .commerce-benefits-grid > div:nth-last-child(-n+2) {
        border-bottom: 0;
    }

    .commerce-section-heading {
        align-items: flex-start;
        gap: 12px;
    }

    .commerce-section-heading h2 {
        overflow-wrap: anywhere;
    }

    .commerce-notes-track {
        min-width: 0;
    }

    .commerce-note {
        flex-basis: 100%;
        min-width: 0;
    }

    .commerce-newsletter form,
    .newsletter-form-wrap form {
        min-width: 0;
    }

    /* Shop and product */
    .vn-shop-hero {
        padding: 52px var(--vn-mobile-gutter);
    }

    .vn-filter-panel,
    .vn-shop-results,
    .vn-product-grid,
    .vn-product-card,
    .vn-product-overview,
    .vn-product-gallery,
    .vn-product-summary {
        min-width: 0;
    }

    .vn-filter-panel {
        padding: 20px 18px;
    }

    .vn-shop-toolbar {
        flex-wrap: wrap;
    }

    .vn-shop-toolbar .orderby {
        max-width: none;
        min-height: 46px;
        width: 100%;
    }

    .vn-product-card-image > span {
        opacity: 1;
        transform: none;
    }

    .vn-single-product {
        padding: 20px 0 60px;
    }

    .vn-product-breadcrumb {
        line-height: 1.55;
        margin-bottom: 20px;
        overflow-wrap: anywhere;
    }

    .vn-product-thumbnails {
        scrollbar-width: none;
        scroll-snap-type: x proximity;
    }

    .vn-product-thumbnails::-webkit-scrollbar {
        display: none;
    }

    .vn-product-thumbnails button {
        scroll-snap-align: start;
    }

    .vn-product-summary h1 {
        font-size: clamp(2rem, 10vw, 2.75rem);
        overflow-wrap: anywhere;
    }

    .vn-single-product .vn-product-story > h2:nth-of-type(2) {
        font-size: 1.7rem;
    }

    .vn-single-product .vn-product-specs {
        grid-template-columns: 1fr;
    }

    .vn-single-product .vn-product-specs > div,
    .vn-single-product .vn-product-specs > div:last-child {
        border-bottom: 1px solid var(--vn-shop-line);
        border-right: 0;
        grid-column: auto;
        padding: 16px 0;
    }

    /* Editorial and information pages */
    .page-header {
        min-height: 0 !important;
        padding: 64px var(--vn-mobile-gutter) !important;
    }

    .page-header .page-title {
        font-size: clamp(2.45rem, 12vw, 3.4rem) !important;
        overflow-wrap: anywhere;
    }

    .page-content-wrapper {
        padding: 56px 0 !important;
    }

    .page-content-wrapper .entry-content {
        font-size: 1rem !important;
    }

    .mission-section,
    .split-section,
    .collection-section,
    .quote-section {
        padding-bottom: 64px !important;
        padding-top: 64px !important;
    }

    .mission-image,
    .split-image,
    .col-images {
        height: auto !important;
        min-height: 420px;
    }

    .col-images .img-left,
    .col-images .img-right {
        height: 420px !important;
        margin-top: 0 !important;
    }

    .privacy-hero {
        min-height: 320px;
        padding: 54px var(--vn-mobile-gutter);
    }

    .privacy-hero h1 {
        font-size: clamp(2.5rem, 12vw, 3.4rem);
    }

    .privacy-page-wrap {
        padding: 52px 0 68px;
    }

    .privacy-container {
        padding: 0 var(--vn-mobile-gutter);
    }

    .privacy-section-title,
    .privacy-contact-email a {
        overflow-wrap: anywhere;
    }

    .team-hero,
    .returns-hero,
    .shipping-hero,
    .blog-hero {
        padding-bottom: 68px;
        padding-top: 68px;
    }

    .team-intro,
    .team-collaboration,
    .team-values-section,
    .team-groups-section,
    .returns-intro,
    .returns-eligibility,
    .returns-process,
    .returns-details,
    .returns-exceptions,
    .returns-faq,
    .shipping-methods,
    .shipping-process,
    .shipping-details,
    .shipping-guidance {
        padding-bottom: 64px;
        padding-top: 64px;
    }

    .team-values-grid article,
    .team-group-card,
    .returns-highlights article,
    .returns-policy-grid article,
    .shipping-detail-grid > *,
    .shipping-method-grid article {
        min-width: 0;
    }

    /* FAQ */
    .faq-hero-container {
        display: block;
        min-height: 0;
    }

    .faq-hero-image {
        min-height: 320px;
    }

    .faq-hero-image::after {
        background: linear-gradient(to bottom, transparent 55%, #0a0a0a 100%);
        height: 45%;
        left: 0;
        top: auto;
        width: 100%;
    }

    .faq-hero-text {
        padding: 48px var(--vn-mobile-gutter) 58px;
    }

    .faq-hero-text h1 {
        font-size: clamp(3rem, 16vw, 4rem);
    }

    .faq-search-bar-container,
    .faq-layout-grid,
    .faq-sidebar,
    .faq-help-box,
    .faq-bottom-grid {
        min-width: 0;
        width: 100%;
    }

    .faq-topics-nav {
        max-width: 100%;
        overflow: hidden;
    }

    .faq-topics-nav .container {
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scrollbar-width: none;
    }

    .faq-topics-nav .container::-webkit-scrollbar {
        display: none;
    }

    .faq-topics-list {
        min-width: max-content;
        width: max-content;
    }

    .faq-main-content {
        padding: 48px 0;
    }

    .faq-accordion-header {
        gap: 18px;
        min-height: 64px;
        padding: 18px 0;
    }

    /* Contact, forms, account, cart and checkout */
    .contact-main-grid-container,
    .help-links-section,
    .faq-section {
        min-width: 0;
    }

    .contact-card,
    .contact-methods,
    .contact-image-card,
    .method-card,
    .help-card,
    .faq-grid > *,
    .feature-item {
        min-width: 0;
    }

    .newsletter-bar {
        padding: 34px 0 !important;
    }

    .newsletter-text,
    .newsletter-form-wrap {
        min-width: 0 !important;
        width: 100%;
    }

    .woocommerce form .form-row-first,
    .woocommerce form .form-row-last,
    .woocommerce-page form .form-row-first,
    .woocommerce-page form .form-row-last {
        float: none;
        width: 100%;
    }

    .woocommerce-checkout form.checkout,
    #customer_details,
    #order_review_heading,
    #order_review,
    .woocommerce-billing-fields,
    .woocommerce-additional-fields,
    .select2-container {
        min-width: 0 !important;
        width: 100% !important;
    }

    .checkout-wrapper .checkout-form-area {
        padding: 26px 20px !important;
    }

    #order_review {
        padding: 18px 14px;
    }

    .woocommerce table.shop_table,
    .woocommerce table.shop_table_responsive {
        font-size: .82rem;
        max-width: 100%;
    }

    .woocommerce-cart .cart-collaterals .cart_totals {
        float: none;
        width: 100%;
    }

    /* Footer */
    .site-footer .container {
        gap: 32px !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        text-align: left;
    }

    .site-footer .footer-brand {
        grid-column: 1 / -1;
    }

    .site-footer .footer-brand p {
        margin-left: 0;
    }

    .footer-bottom {
        align-items: flex-start !important;
        flex-direction: column;
        gap: 18px;
    }
}

@media (max-width: 480px) {
    :root {
        --vn-mobile-gutter: 15px;
    }

    .hero-buttons,
    .commerce-newsletter form,
    .newsletter-form-wrap form {
        flex-direction: column;
    }

    .hero-buttons .btn,
    .commerce-newsletter button,
    .newsletter-form-wrap button {
        min-height: 48px;
        width: 100%;
    }

    .commerce-category-card {
        min-height: 185px;
        padding: 96px 13px 16px;
    }

    .commerce-product-grid,
    .vn-product-grid {
        gap: 28px 10px;
    }

    .vn-product-purchase .woocommerce-variation-add-to-cart,
    .vn-product-purchase form.cart:not(.variations_form) {
        grid-template-columns: 108px minmax(0, 1fr);
    }

    .vn-product-purchase .vn-buy-now-button {
        grid-column: 1 / -1;
    }

    .mission-image,
    .split-image,
    .col-images {
        min-height: 340px;
    }

    .col-images {
        display: grid !important;
        gap: 10px !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .col-images .img-left,
    .col-images .img-right {
        height: 330px !important;
    }

    .privacy-section-header {
        align-items: flex-start;
        gap: 18px;
    }

    .privacy-section-icon {
        flex: 0 0 auto;
    }

    .site-footer .container {
        grid-template-columns: 1fr !important;
        text-align: left;
    }

    .site-footer .footer-brand {
        grid-column: auto;
    }

    .site-footer .social-links,
    .site-footer .footer-newsletter form {
        justify-content: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .main-navigation {
        transition: none;
    }
}
