
.glass-card {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.4);
}
.hero-bg {
    background: linear-gradient(135deg, rgba(10, 25, 47, 0.92) 0%, rgba(15, 44, 89, 0.85) 100%), 
                url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1600&q=80');
    background-size: cover;
    background-position: center;
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-6px); }
}
.animate-float {
    animation: float 3s ease-in-out infinite;
}

.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}


html { scroll-padding-top: 100px; }
.owner-avatar { object-fit: cover; object-position: center 7%; background: #ede8df; display: inline-block; overflow: hidden; }
.brand-logo { object-fit: contain; }
.owner-presenting { width: min(100%, 300px); height: 340px; object-fit: contain; filter: drop-shadow(0 16px 22px rgba(0,0,0,.22)); }
.product-price { padding: 12px 14px; background: #edf5ff; border: 1px solid #d7e7fb; border-radius: 14px; }
.product-price > span { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: #52647c; font-weight: 700; }
.product-price strong { font-size: 27px; color: #0f2c59; font-weight: 800; }
.product-price .price-unit { font-size: 13px; color: #52647c; }
.product-price small { display: block; color: #607087; font-size: 10px; }
.pricing-disclaimer { max-width: 760px; margin: -16px auto 24px; text-align: center; color: #64748b; font-size: 12px; line-height: 1.6; }
#product-modal > div { max-height: calc(100dvh - 32px); overflow-y: auto; margin: 0; }
#agent-popup { width: min(352px, calc(100vw - 32px)); }
:focus-visible { outline: 3px solid #f59e0b; outline-offset: 4px; }
@media (min-width: 768px) and (max-width: 1100px) { header nav { gap: 16px; font-size: 12px; } header nav > * { margin-left: 0 !important; } header nav + div { display: none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; transition: none !important; } }

.owner-avatar-photo { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; transform: scale(1.55); transform-origin: 58% 0%; }

.hero-owner { position: relative; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
.hero-owner-image { display: block; width: 100%; height: 480px; object-fit: contain; object-position: center bottom; filter: drop-shadow(0 20px 35px rgba(0,0,0,.25)); }
.hero-owner-caption { position: relative; margin-top: -12px; text-align: center; }
.hero-owner-caption > span { color: #fcd34d; font-size: 11px; text-transform: uppercase; letter-spacing: .12em; font-weight: 700; }
.hero-owner-caption strong { display: block; font-size: 26px; line-height: 1.4; color: #ffffff; font-weight: 800; }
.hero-owner-caption p { color: #cbd5e1; font-size: 13px; }
@media (max-width: 767px) { .hero-owner-image { height: 360px; } .hero-owner { margin-top: 10px; } }


.eyebrow { display: inline-block; color: #0066cc; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .13em; }
.featured-section { padding-top: 64px; padding-bottom: 30px; }
.featured-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 28px; }
.featured-heading h2, .section-intro h2 { color: #0a192f; font-size: clamp(26px, 3vw, 36px); line-height: 1.2; font-weight: 800; margin: 8px 0; }
.featured-heading p, .section-intro p { color: #64748b; font-size: 14px; line-height: 1.7; }
.catalogue-link { color: #0066cc; font-size: 14px; font-weight: 700; white-space: nowrap; }
.contact-section { background: #edf3fa; margin-top: 50px; padding: 64px 0; }
.section-intro { margin-bottom: 28px; }
.contact-layout { display: grid; grid-template-columns: .9fr 1.1fr; overflow: hidden; border: 1px solid #dce5f0; border-radius: 24px; background: white; }
.address-panel { padding: 36px; }
.address-panel h3 { font-size: 26px; color: #0f2c59; font-weight: 800; margin: 10px 0 20px; }
.address-panel address { font-style: normal; font-size: 18px; color: #334155; line-height: 1.7; }
.address-panel address i { color: #f59e0b; margin-right: 6px; }
.map-note { color: #64748b; font-size: 12px; line-height: 1.7; margin: 14px 0 22px; }
.contact-phone { display: block; font-size: 18px; font-weight: 700; color: #0f2c59; margin: 5px 0; }
.contact-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.primary-link, .secondary-link { display: inline-flex; justify-content: center; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 12px; font-size: 13px; font-weight: 700; }
.primary-link { background: #0066cc; color: white; }
.primary-link:hover { background: #0f2c59; }
.secondary-link { background: #eaf2fc; color: #0f2c59; }
.shop-map { width: 100%; height: 100%; min-height: 420px; border: 0; }
.footer-links { display: flex; flex-wrap: wrap; gap: 16px; font-size: 12px; }
.footer-links a:hover { color: white; }
header nav a[aria-current="page"], footer a[aria-current="page"] { color: #0066cc; font-weight: 800; }
.catalogue-search { max-width: 740px; margin: 0 auto 24px; }
.catalogue-search label { display: block; font-size: 13px; font-weight: 700; color: #0f2c59; margin-bottom: 8px; }
.search-input-wrap { display: flex; align-items: center; gap: 14px; background: white; border: 1px solid #cbd5e1; border-radius: 16px; padding: 8px 16px; }
.search-input-wrap > i { color: #64748b; }
.search-input-wrap input { min-width: 0; flex: 1; padding: 10px 0; background: transparent; font-size: 14px; outline: 0; }
.search-input-wrap:focus-within { border-color: #0066cc; box-shadow: 0 0 0 3px #0066cc20; }
.search-input-wrap button { color: #0066cc; font-size: 12px; font-weight: 700; padding: 8px; }
.results-count { color: #64748b; font-size: 13px; margin-bottom: 18px; }
.empty-results { text-align: center; padding: 60px 20px; border: 1px dashed #cbd5e1; border-radius: 24px; }
.empty-results[hidden] { display: none; }
.empty-results > i { font-size: 28px; color: #94a3b8; }
.empty-results h3 { font-weight: 800; font-size: 24px; margin: 12px 0 6px; }
.empty-results p { font-size: 14px; color: #64748b; margin-bottom: 20px; }
.about-hero { padding: 64px 0; background: linear-gradient(130deg, #eaf2fc, #fff); }
.about-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: center; }
.owner-photo-wrap { position: relative; max-width: 420px; width: 100%; margin: auto; }
.owner-real-photo { display: block; width: 100%; height: 500px; object-fit: cover; object-position: center; border-radius: 24px; }
.photo-caption { position: absolute; bottom: 18px; left: 18px; right: 18px; padding: 18px; border-radius: 16px; background: #0a192fe8; color: white; }
.photo-caption strong { display: block; font-size: 24px; }
.photo-caption span { color: #fcd34d; font-size: 12px; }
.about-copy h1 { font-size: clamp(36px, 4vw, 54px); font-weight: 800; line-height: 1.1; color: #0f2c59; margin: 16px 0 24px; }
.about-copy p { color: #64748b; line-height: 1.8; font-size: 15px; margin-bottom: 18px; }
.about-copy .about-lead { color: #334155; font-size: 19px; }
.about-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; padding-top: 60px; padding-bottom: 20px; }
.about-values > div { border-top: 2px solid #dbe6f4; padding-top: 20px; }
.about-values span { color: #0066cc; font-size: 13px; font-weight: 800; }
.about-values h2 { font-size: 22px; font-weight: 800; color: #0f2c59; margin: 8px 0; }
.about-values p { font-size: 14px; color: #64748b; line-height: 1.8; }
@media (max-width: 767px) {
 .featured-heading { align-items: flex-start; flex-direction: column; gap: 16px; }
 .contact-layout, .about-layout, .about-values { grid-template-columns: 1fr; }
 .address-panel { padding: 26px; }
 .shop-map { min-height: 320px; }
 .about-layout { gap: 32px; }
 .owner-real-photo { height: 420px; }
 .about-hero { padding: 36px 0; }
 .about-values { padding-top: 36px; }
}
body > nav a { color: #475569; }
body > nav a[aria-current="page"] { color: #0066cc; font-weight: 800; }

.skip-link { position: fixed; top: -100px; left: 16px; z-index: 100; padding: 12px 20px; background: white; color: #0f2c59; border-radius: 8px; }
.skip-link:focus { top: 12px; }
.mobile-section-nav { display: flex; gap: 22px; padding: 10px 16px; overflow-x: auto; white-space: nowrap; border-top: 1px solid #e2e8f0; font-size: 12px; font-weight: 600; }
.range-section { padding: 72px 0; }
.range-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.range-card { display: flex; flex-direction: column; background: white; padding: 28px; border: 1px solid #dce5f0; border-radius: 22px; scroll-margin-top: 150px; }
.range-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; }
.range-card-top i { display: grid; place-items: center; width: 46px; height: 46px; background: #eaf2fc; color: #0066cc; border-radius: 13px; font-size: 20px; }
.range-card-top span { font-size: 13px; color: #64748b; }
.range-card h3 { font-size: 24px; font-weight: 700; color: #0f2c59; }
.range-card p { color: #64748b; font-size: 13px; margin: 6px 0 18px; }
.range-card ul { list-style: disc; padding-left: 18px; margin-bottom: 24px; color: #334155; font-size: 14px; line-height: 1.95; }
.range-enquiry { margin-top: auto; padding-top: 18px; border-top: 1px solid #e2e8f0; color: #0066cc; font-size: 13px; font-weight: 600; }
.range-enquiry i { margin-left: 6px; }
.finish-swatches { display: flex; gap: 10px; margin-bottom: 20px; }
.finish-swatches span { width: 30px; height: 30px; border-radius: 50%; background: var(--finish); border: 3px solid white; box-shadow: 0 0 0 1px #cbd5e1; }
.service-section { padding: 64px 0; background: #edf3fa; }
.service-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 64px; align-items: center; }
.service-layout h2,.wholesale-panel h2,.gallery-title { font-size: clamp(28px,3vw,38px); line-height: 1.2; font-weight: 800; color: #0f2c59; margin: 12px 0 18px; }
.service-layout p,.wholesale-panel p { color: #475569; line-height: 1.8; font-size: 15px; margin-bottom: 24px; }
.service-list { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 24px; font-size: 14px; color: #334155; }
.service-list li { display: flex; gap: 10px; align-items: baseline; }
.service-list i { color: #0066cc; }
.wholesale-section { padding-top: 64px; }
.wholesale-panel { display: grid; grid-template-columns: 1.3fr .7fr; gap: 48px; padding: 40px; background: #0a192f; color: white; border-radius: 24px; }
.wholesale-panel h2 { color: white; }.wholesale-panel .eyebrow { color: #fbbf24; }.wholesale-panel p { color: #cbd5e1; }
.customer-tags { display: flex; flex-wrap: wrap; gap: 8px; }.customer-tags li { padding: 7px 12px; background: #ffffff12; border: 1px solid #ffffff25; border-radius: 50px; font-size: 12px; }
.wholesale-action { align-self: center; }.wholesale-action .primary-link { background: #f59e0b; color: #0a192f; }
.work-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }.work-card { background: white; border: 1px solid #dce5f0; border-radius: 18px; overflow: hidden; }.work-card img { width: 100%; aspect-ratio: 4/3; object-fit: cover; background: #e2e8f0; }.work-card > span { display: block; padding: 18px; }.work-card strong { display: block; color: #0f2c59; }.work-card small { display: block; margin-top: 5px; color: #64748b; }
@media(min-width:768px) { .mobile-section-nav { display: none; } }
@media(max-width:1000px) { .range-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.service-layout { gap: 32px; } }
@media(max-width:767px) { html { scroll-padding-top: 150px; }.range-section { padding: 44px 0; }.range-grid,.service-layout,.wholesale-panel { grid-template-columns: 1fr; }.range-card { padding: 24px; }.service-list { grid-template-columns: 1fr; }.wholesale-panel { padding: 26px; gap: 24px; }.work-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.work-card > span { padding: 12px; }.work-card strong { font-size: 14px; } }
@media(max-width:380px) { .work-grid { grid-template-columns: 1fr; } }
.catalogue-controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-top: 16px; }.catalogue-controls label { flex: 1; min-width: 140px; margin: 0; }.catalogue-controls select { display: block; width: 100%; padding: 12px; margin-top: 6px; background: white; border: 1px solid #cbd5e1; border-radius: 10px; font-size: 14px; }.pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 20px; align-items: center; margin-top: 36px; font-size: 14px; }
@media (min-width: 768px) and (max-width: 1100px) { header nav + div { display: none !important; } header nav { gap: 18px; white-space: nowrap; } header .brand-logo { width: 44px; } }

.partner-highlight { display: flex; align-items: center; gap: 16px; padding: 18px 20px; border: 1px solid #7dd3fc55; border-radius: 18px; background: linear-gradient(120deg,#0c4a6e99,#0f2c5966); max-width: 540px; text-align: left; }
.partner-mark { display: grid; place-items: center; flex-shrink: 0; width: 48px; height: 48px; color: #fcd34d; background: #ffffff12; border-radius: 14px; font-size: 26px; }
.partner-highlight strong { display: block; color: #fff; font-size: 24px; line-height: 1.2; font-weight: 800; letter-spacing: .02em; }
.partner-highlight span { display: block; margin-top: 5px; color: #bae6fd; font-size: 13px; font-weight: 600; }
.partner-highlight p { margin-top: 6px; color: #e2e8f0; font-size: 12px; line-height: 1.6; }
@media(max-width:767px) { .partner-highlight { margin-left: auto; margin-right: auto; padding: 16px; gap: 12px; }.partner-highlight strong { font-size: 22px; } }

@media (max-width: 767px) {
  .mobile-bottom-nav.fixed { padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px)); }
  body:has(.mobile-bottom-nav) { padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
  .agent-widget.fixed { bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
  #agent-popup { max-height: calc(100dvh - 190px - env(safe-area-inset-bottom, 0px)); overflow-y: auto; overscroll-behavior: contain; }
  #agent-custom-input { min-width: 0; }
}
.gallery-note { color: #64748b; font-size: 12px; margin: -6px 0 24px; }
.gallery-image-link { display: block; overflow: hidden; }
.gallery-image-link img { transition: transform .25s ease; }
.gallery-image-link:hover img { transform: scale(1.025); }
.gallery-card-copy { padding: 22px; }
.gallery-card-copy h3 { font-size: 20px; font-weight: 700; line-height: 1.3; color: #0f2c59; }
.gallery-card-copy p { margin: 10px 0 18px; color: #64748b; font-size: 14px; line-height: 1.7; }
.gallery-card-copy .range-enquiry { display: block; }
@media(max-width:767px) { .gallery-card-copy { padding: 15px; }.gallery-card-copy h3 { font-size: 17px; }.gallery-card-copy p { font-size: 12px; }.gallery-card-copy .range-enquiry { font-size: 12px; line-height: 1.5; } }
