:root {
    --md-ink: #161616;
    --md-charcoal: #232323;
    --md-text: #252a31;
    --md-muted: #6d7581;
    --md-paper: #f6f4f0;
    --md-panel: #ffffff;
    --md-line: #ded8cf;
    --md-soft: #eef3f2;
    --md-accent: #9a623f;
    --md-accent-dark: #6d442d;
    --md-forest: #24443e;
    --md-sky: #dfeaf0;
    --md-shadow: 0 14px 30px rgba(20, 24, 30, .08);
}

* {
    letter-spacing: 0;
}

body {
    background: var(--md-paper);
    color: var(--md-text);
    font-family: "Kumbh Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    padding-bottom: 92px;
}

a {
    color: inherit;
}

.portfolio-shell {
    max-width: 1460px;
}

.md-shop-header {
    background: rgba(255, 255, 255, .98);
    border-bottom: 1px solid var(--md-line);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .05);
    color: var(--md-text);
    position: sticky;
    top: 0;
    z-index: 50;
}

.md-topline {
    background: var(--md-ink);
    color: rgba(255, 255, 255, .78);
    font-size: .82rem;
    padding: 7px 0;
}

.md-topline a {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.md-mainbar {
    align-items: center;
    display: grid;
    gap: 18px;
    grid-template-columns: auto minmax(260px, 1fr) auto;
    min-height: 78px;
}

.md-brand {
    color: var(--md-ink);
    font-family: "Marcellus", Georgia, serif;
    font-size: 2rem;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.md-header-search {
    align-items: center;
    background: #f2f5f4;
    border: 1px solid #d9e2df;
    border-radius: 8px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 46px;
    overflow: hidden;
}

.md-header-search input {
    background: transparent;
    border: 0;
    color: var(--md-text);
    min-width: 0;
    outline: 0;
    padding: 0 16px;
}

.md-header-search button {
    align-self: stretch;
    background: var(--md-forest);
    border: 0;
    color: #fff;
    font-weight: 700;
    padding: 0 18px;
}

.md-nav {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.md-nav a {
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--md-charcoal);
    font-size: .92rem;
    font-weight: 700;
    line-height: 1;
    padding: 11px 13px;
    text-decoration: none;
}

.md-nav a:hover,
.md-nav a.active {
    background: var(--md-ink);
    border-color: var(--md-ink);
    color: #fff;
}

.md-shortlist-link {
    background: var(--md-sky);
}

.portfolio-hero,
.collections-hero,
.quote-hero,
.consultation-hero {
    background-color: #171717;
    background-image: url("images/millau-portfolio-hero-20260704.png");
    background-position: center;
    background-size: cover;
    border-radius: 8px;
    color: #fff;
    isolation: isolate;
    min-height: 410px;
    overflow: hidden;
    padding: 48px;
    position: relative;
}

.portfolio-hero::after,
.collections-hero::after,
.quote-hero::after,
.consultation-hero::after {
    background:
        linear-gradient(90deg, rgba(12, 12, 12, .86), rgba(12, 12, 12, .56), rgba(12, 12, 12, .14)),
        linear-gradient(0deg, rgba(10, 10, 10, .2), rgba(10, 10, 10, .04));
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 0;
}

.portfolio-hero > *,
.collections-hero > *,
.quote-hero > *,
.consultation-hero > * {
    position: relative;
    z-index: 2;
}

.portfolio-hero h1,
.collections-hero h1,
.quote-hero h1,
.consultation-hero h1 {
    font-family: "Marcellus", Georgia, serif;
    font-size: 3.8rem;
    font-weight: 400;
    line-height: 1.02;
    max-width: 820px;
}

.portfolio-hero-text {
    color: rgba(255, 255, 255, .82);
    font-size: 1.05rem;
    line-height: 1.7;
    max-width: 720px;
}

.portfolio-home-statement {
    color: rgba(255, 255, 255, .94);
    font-family: "Marcellus", Georgia, serif;
    font-size: 3.25rem;
    line-height: 1.12;
    max-width: 980px;
    padding-top: 10px;
    position: relative;
}

.portfolio-home-statement::before {
    background: rgba(255, 255, 255, .72);
    content: "";
    display: block;
    height: 2px;
    margin-bottom: 22px;
    width: 84px;
}

.md-hero-kicker,
.product-category,
.collection-count,
.section-title {
    color: var(--md-accent);
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.md-hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.md-stat-pill {
    background: rgba(255, 255, 255, .13);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    color: rgba(255, 255, 255, .86);
    padding: 10px 13px;
}

.md-section,
.home-band {
    background: rgba(255, 255, 255, .92);
    border: 1px solid var(--md-line);
    border-radius: 8px;
    padding: 22px;
}

.trust-band {
    background: #fff;
    border: 1px solid var(--md-line);
    border-radius: 8px;
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
    padding: 28px;
}

.trust-copy h2 {
    color: var(--md-ink);
    font-family: "Marcellus", Georgia, serif;
    font-size: 2.35rem;
    font-weight: 400;
    line-height: 1.08;
    margin-bottom: 12px;
    max-width: 760px;
}

.trust-copy p {
    color: var(--md-muted);
    line-height: 1.65;
    margin: 0;
    max-width: 840px;
}

.trust-points {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.trust-points span {
    background: var(--md-soft);
    border: 1px solid #d6e0dc;
    border-radius: 999px;
    color: #344842;
    font-size: .88rem;
    font-weight: 700;
    padding: 8px 11px;
}

.trust-stats {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.trust-stats div {
    background: #f9faf9;
    border: 1px solid #e5e1db;
    border-radius: 8px;
    padding: 16px;
}

.trust-stats strong {
    color: var(--md-forest);
    display: block;
    font-size: 1.65rem;
    line-height: 1;
}

.trust-stats span {
    color: var(--md-muted);
    display: block;
    font-size: .8rem;
    font-weight: 800;
    margin-top: 8px;
    text-transform: uppercase;
}

.home-section-title {
    align-items: end;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 18px;
}

.home-section-title h2 {
    font-family: "Marcellus", Georgia, serif;
    font-size: 1.8rem;
    font-weight: 400;
}

.home-grid,
.product-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

.product-card,
.collection-card,
.related-card,
.shortlist-card {
    background: var(--md-panel);
    border: 1px solid var(--md-line);
    border-radius: 8px;
    color: inherit;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.product-card:hover,
.collection-card:hover,
.related-card:hover,
.shortlist-card:hover {
    border-color: #c3b8aa;
    box-shadow: var(--md-shadow);
    color: inherit;
    transform: translateY(-3px);
}

.product-card a,
.collection-card a {
    text-decoration: none;
}

.product-media,
.collection-media,
.related-media,
.shortlist-media {
    align-items: center;
    aspect-ratio: 4 / 3;
    background: linear-gradient(135deg, #f7f8f7, #e8efed);
    display: flex;
    justify-content: center;
    overflow: hidden;
    padding: 12px;
}

.product-media img,
.collection-media img,
.related-media img,
.shortlist-media img {
    display: block;
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
    transition: transform .22s ease;
}

.product-media picture,
.collection-media picture,
.related-media picture,
.shortlist-media picture,
.product-image-panel picture {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
}

.product-card:hover .product-media img,
.collection-card:hover .collection-media img {
    transform: scale(1.035);
}

.product-placeholder,
.collection-placeholder {
    color: var(--md-muted);
    font-size: .9rem;
    text-align: center;
}

.product-title {
    color: var(--md-ink);
    font-size: 1.02rem;
    font-weight: 800;
    line-height: 1.35;
}

.product-title:hover {
    color: var(--md-accent-dark);
}

.product-description,
.collection-description {
    color: var(--md-muted);
    font-size: .92rem;
    line-height: 1.55;
}

.product-price {
    color: var(--md-forest);
    font-size: 1.02rem;
    font-weight: 800;
}

.badge.text-bg-dark {
    background: var(--md-forest) !important;
    border-radius: 999px;
    font-weight: 700;
}

.btn {
    border-radius: 8px;
    font-weight: 700;
}

.btn-dark {
    background: var(--md-ink);
    border-color: var(--md-ink);
}

.btn-outline-dark {
    border-color: #ada397;
    color: var(--md-ink);
}

.btn-outline-dark:hover {
    background: var(--md-ink);
    border-color: var(--md-ink);
    color: #fff;
}

.btn-success {
    background: var(--md-forest);
    border-color: var(--md-forest);
}

.md-filter-panel,
form.bg-white.border.rounded-3 {
    background: #fff !important;
    border: 1px solid var(--md-line) !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 22px rgba(20, 24, 30, .05);
}

.form-control,
.form-select {
    border-color: #d8d1c8;
    border-radius: 8px;
    min-height: 44px;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--md-accent);
    box-shadow: 0 0 0 .2rem rgba(154, 98, 63, .14);
}

.category-strip {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 6px;
}

.category-strip .btn {
    white-space: nowrap;
}

.section-card {
    background: #fff;
    border: 1px solid var(--md-line);
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(20, 24, 30, .05);
}

.content-panel,
.quote-form {
    background: #fff;
    border: 1px solid var(--md-line);
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(20, 24, 30, .05);
}

.quote-item-list {
    display: grid;
    gap: 14px;
}

.quote-line {
    border: 1px solid var(--md-line);
    border-radius: 8px;
    display: grid;
    gap: 18px;
    grid-template-columns: 170px minmax(0, 1fr) auto;
    padding: 14px;
}

.quote-line-media {
    align-items: center;
    aspect-ratio: 4 / 3;
    background: #f8f8f6;
    border: 1px solid #e5e1db;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    overflow: hidden;
    padding: 10px;
}

.quote-line-media img {
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
}

.quote-line-media picture {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
}

.quote-line-body {
    min-width: 0;
}

.quote-line-total {
    color: var(--md-forest);
    font-size: 1.08rem;
    font-weight: 800;
    white-space: nowrap;
}

.quote-summary-panel {
    position: sticky;
    top: 112px;
}

.consultation-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 1fr) 390px;
}

.category-grid {
    display: grid;
    gap: 9px 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: 300px;
    overflow: auto;
    padding-right: 4px;
}

.category-grid .form-check {
    margin-bottom: 0;
}

.detail-list {
    display: grid;
    gap: 14px;
}

.detail-item {
    border-left: 3px solid var(--md-accent);
    padding-left: 12px;
}

.product-image-panel {
    align-items: center;
    background: #fff;
    border: 1px solid var(--md-line);
    border-radius: 8px;
    box-shadow: var(--md-shadow);
    display: flex;
    justify-content: center;
    min-height: min(72vh, 690px);
    padding: 18px;
}

.product-image-panel img {
    display: block;
    max-height: calc(72vh - 36px);
    max-width: 100%;
    object-fit: contain;
}

.product-title-main {
    color: var(--md-ink);
    font-family: "Marcellus", Georgia, serif;
    font-size: 3rem;
    font-weight: 400;
    line-height: 1.06;
}

.product-glance {
    border: 1px solid var(--md-line);
    border-radius: 8px;
    display: grid;
    gap: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
}

.product-glance div {
    background: #fbfaf8;
    border-bottom: 1px solid var(--md-line);
    border-right: 1px solid var(--md-line);
    padding: 12px;
}

.product-glance div:nth-child(2n) {
    border-right: 0;
}

.product-glance div:nth-last-child(-n + 2) {
    border-bottom: 0;
}

.product-glance span {
    color: var(--md-muted);
    display: block;
    font-size: .76rem;
    font-weight: 800;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.product-glance strong {
    color: var(--md-ink);
    display: block;
    font-size: .94rem;
    line-height: 1.35;
}

.chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.chip {
    background: var(--md-soft);
    border: 1px solid #d6e0dc;
    border-radius: 999px;
    color: #344842;
    display: inline-flex;
    font-size: .86rem;
    line-height: 1;
    padding: 8px 11px;
}

.meta-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.meta-item {
    background: #f9faf9;
    border: 1px solid #e5e1db;
    border-radius: 8px;
    padding: 12px;
}

.meta-label {
    color: var(--md-muted);
    display: block;
    font-size: .78rem;
    font-weight: 700;
    margin-bottom: 4px;
}

.related-grid,
.collection-grid,
.shortlist-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.collection-mini-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.collection-mini-card {
    align-items: center;
    background: #fff;
    border: 1px solid var(--md-line);
    border-radius: 8px;
    color: inherit;
    display: grid;
    gap: 14px;
    grid-template-columns: 96px minmax(0, 1fr);
    min-width: 0;
    padding: 12px;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.collection-mini-card:hover {
    border-color: #c3b8aa;
    box-shadow: var(--md-shadow);
    color: inherit;
    transform: translateY(-2px);
}

.collection-mini-media {
    align-items: center;
    aspect-ratio: 1 / 1;
    background: linear-gradient(135deg, #f7f8f7, #e8efed);
    border-radius: 8px;
    display: flex;
    justify-content: center;
    overflow: hidden;
    padding: 8px;
}

.collection-mini-media picture {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
}

.collection-mini-media img {
    display: block;
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
}

.md-shop-footer {
    background: #fff;
    border-top: 1px solid var(--md-line);
    color: var(--md-text);
    padding: 26px 0;
}

.md-shop-footer a {
    color: var(--md-text);
    font-weight: 700;
    text-decoration: none;
}

.footer-line {
    color: var(--md-muted);
    font-size: .9rem;
}

.floating-inquiry {
    background: rgba(255, 255, 255, .97);
    border-top: 1px solid var(--md-line);
    bottom: 0;
    box-shadow: 0 -10px 28px rgba(20, 24, 30, .1);
    left: 0;
    position: fixed;
    right: 0;
    z-index: 40;
}

.floating-inquiry .portfolio-shell {
    min-height: 72px;
}

.pagination .page-link {
    border-color: var(--md-line);
    color: var(--md-ink);
}

.pagination .active .page-link {
    background: var(--md-ink);
    border-color: var(--md-ink);
    color: #fff;
}

.hp-field {
    height: 1px;
    left: -10000px;
    overflow: hidden;
    position: absolute;
    top: auto;
    width: 1px;
}

@media (max-width: 991.98px) {
    .md-mainbar {
        grid-template-columns: 1fr;
        padding-bottom: 16px;
        padding-top: 16px;
    }

    .md-nav {
        justify-content: flex-start;
    }

    .portfolio-hero,
    .collections-hero,
    .quote-hero,
    .consultation-hero {
        min-height: 360px;
        padding: 30px;
    }

    .portfolio-hero h1,
    .collections-hero h1,
    .quote-hero h1,
    .consultation-hero h1,
    .product-title-main {
        font-size: 2.4rem;
    }

    .portfolio-home-statement {
        font-size: 2.45rem;
        max-width: 760px;
    }

    .consultation-grid {
        grid-template-columns: 1fr;
    }

    .trust-band,
    .quote-line {
        grid-template-columns: 1fr;
    }

    .quote-summary-panel {
        position: static;
    }

    .category-grid {
        grid-template-columns: 1fr;
        max-height: none;
    }
}

@media (max-width: 575.98px) {
    body {
        padding-bottom: 142px;
    }

    .md-brand {
        font-size: 1.7rem;
    }

    .md-header-search {
        grid-template-columns: 1fr;
    }

    .md-header-search button {
        min-height: 42px;
    }

    .portfolio-hero,
    .collections-hero,
    .quote-hero,
    .consultation-hero {
        min-height: 330px;
        padding: 24px;
    }

    .portfolio-hero h1,
    .collections-hero h1,
    .quote-hero h1,
    .consultation-hero h1,
    .product-title-main {
        font-size: 2rem;
    }

    .portfolio-home-statement {
        font-size: 1.8rem;
        line-height: 1.18;
    }

    .portfolio-home-statement::before {
        margin-bottom: 16px;
        width: 64px;
    }

    .product-glance {
        grid-template-columns: 1fr;
    }

    .product-glance div,
    .product-glance div:nth-child(2n) {
        border-right: 0;
    }

    .product-glance div:nth-last-child(-n + 2) {
        border-bottom: 1px solid var(--md-line);
    }

    .product-glance div:last-child {
        border-bottom: 0;
    }

    .home-grid,
    .product-grid,
    .collection-grid,
    .related-grid,
    .shortlist-grid {
        grid-template-columns: 1fr;
    }

    .trust-stats {
        grid-template-columns: 1fr;
    }
}

@media print {
    body {
        background: #fff;
        padding-bottom: 0;
    }

    .md-shop-header,
    .md-shop-footer,
    .floating-inquiry,
    .no-print {
        display: none !important;
    }

    .portfolio-shell {
        max-width: 100%;
    }

    .quote-hero {
        background: #fff !important;
        color: #111;
        min-height: 0;
        padding: 0 0 20px;
    }

    .quote-hero::after {
        display: none;
    }

    .quote-hero h1 {
        color: #111;
        font-size: 2rem;
    }

    .portfolio-hero-text {
        color: #333;
    }

    .content-panel {
        border: 1px solid #ddd;
        box-shadow: none;
    }
}
