@font-face{font-family:WebFigtree;src:url('../fonts/Figtree-Regular.ttf') format('truetype');font-display:swap}
:root{--web-ink:#10283f;--web-muted:#506175;--web-line:#d8dfe5;--web-silver:#f1f4f6;--web-ease:cubic-bezier(.16,1,.3,1)}
html{scroll-padding-top:125px;scroll-behavior:smooth}body{background:#fff!important;color:var(--web-ink);padding-bottom:0!important}body,.web-header *,.web-footer *,.web-visit *{font-family:WebFigtree,Arial,sans-serif}.body{overflow:clip}.web-top{background:var(--web-ink);color:#fff;display:flex;justify-content:space-between;padding:9px max(5vw,20px);font-size:12px;letter-spacing:.04em}.web-top a{color:#fff}.web-header{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid var(--web-line)}.web-header-inner{max-width:1320px;margin:auto;min-height:108px;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:12px 40px}.web-brand img{width:248px;height:84px;object-fit:contain}.web-nav{display:flex;gap:32px;align-items:center}.web-nav a,.web-actions a{color:var(--web-ink);font-size:15px;text-decoration:none}.web-nav a{position:relative;padding:13px 0}.web-nav a:after{content:'';position:absolute;bottom:5px;left:0;width:100%;height:2px;background:var(--web-ink);transform:scaleX(0);transform-origin:left;transition:transform 220ms var(--web-ease)}.web-nav a:hover:after,.web-nav a[aria-current]:after{transform:scaleX(1)}.web-actions{display:flex;gap:25px}.web-actions a{display:flex;align-items:center;gap:8px}.web-actions svg{width:20px;height:23px}.web-toggle{display:none}.web-skip{position:fixed;top:-80px;left:15px;z-index:1100;background:#fff;padding:14px}.web-skip:focus{top:10px}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid #447cac;outline-offset:5px}.web-hero{max-width:1240px;margin:32px auto 0;background:var(--web-silver);border-radius:16px;overflow:hidden;animation:web-arrive 600ms var(--web-ease) both}.web-hero>img{display:block;width:100%;height:auto}.web-hero-actions{display:flex;gap:32px;align-items:center;padding:22px 42px;background:#eef1f5}.web-button{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;background:var(--web-ink);color:white!important;padding:15px 24px;border-radius:6px;text-decoration:none!important;font-size:15px;transition:transform 180ms var(--web-ease),background 180ms}.web-button:hover{background:#24445e;transform:translateY(-2px)}.web-button:active{transform:scale(.97)}.web-button span{font-size:21px}.web-text-link{color:var(--web-ink);font-size:15px}.web-intro{max-width:1240px;margin:0 auto;padding:35px 5px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--web-line)}.web-intro>span{font-size:12px;letter-spacing:.12em}.web-intro p{font-size:19px;line-height:1.5;margin:0;color:var(--web-muted)}.sectionHeader{padding:54px 20px 12px}.sectionHeader h1{font-size:34px;line-height:1.25;margin-bottom:12px!important;color:var(--web-ink)}.sectionHeader p{color:var(--web-muted);font-size:16px}.main,.mainpad1,.mainpad3{max-width:1240px!important;margin-left:auto!important;margin-right:auto!important}.main{min-height:280px;padding:25px 30px!important}.app{max-width:1240px}.categoryCard,.collectionCard,.product{transition:transform 240ms var(--web-ease)}@media(hover:hover){.categoryCard:hover,.collectionCard:hover,.product:hover{transform:translateY(-4px)}}.web-catalog-status{text-align:center;background:var(--web-silver);padding:40px 20px;border-radius:12px;color:var(--web-muted)}.web-catalog-status a{color:var(--web-ink);text-decoration:underline}.web-visit{max-width:1240px;margin:50px auto 0;padding:40px 42px;display:flex;align-items:center;justify-content:space-between;gap:30px;background:var(--web-silver)}.web-visit h2{font-family:Georgia,serif;font-weight:400;font-size:30px;line-height:1.3;letter-spacing:-.02em;margin:0 0 10px;color:var(--web-ink)}.web-visit p{margin:0;color:var(--web-muted);font-size:15px}.web-footer{background:var(--web-ink);color:#fff;margin-top:56px;padding:55px max(5vw,24px) 0;position:static!important}.web-footer-grid{max-width:1240px;margin:auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:44px}.web-footer h3{font-size:15px;color:#fff;text-transform:none;font-weight:600;letter-spacing:0;margin:0 0 20px}.web-footer a{display:block;color:#e0e7ed;font-size:14px;margin-bottom:12px;text-decoration:none}.web-footer a:hover{text-decoration:underline}.web-footer p{font-size:14px;line-height:1.8;color:#d1dce6;margin-bottom:16px}.web-footer-brand>a{font-family:Georgia,serif;font-size:29px;letter-spacing:.05em;color:#fff}.web-footer-bottom{max-width:1240px;margin:38px auto 0;padding:23px 0;display:flex;align-items:center;gap:35px;border-top:1px solid #405369;font-size:12px;color:#d1dce6}.web-footer-bottom>a{font-size:12px;margin:0 0 0 auto}.web-back{color:#fff;background:none;border:0;padding:8px;cursor:pointer}.web-back:hover{animation:web-bounce 400ms ease-out}.web-back:active{transform:scale(.96)}.menu-drawer{left:0!important;transform:translateX(-105%);transition:transform 280ms var(--web-ease)!important}.menu-drawer.open{transform:translateX(0)}.drawer-menu a:hover{color:var(--web-ink)!important;background:var(--web-silver)!important}.web-reveal{animation:web-arrive 420ms var(--web-ease) both}.btn{transition:transform 160ms var(--web-ease),background-color 160ms!important}.btn:active{transform:scale(.97)}
@keyframes web-arrive{from{opacity:.3;transform:translateY(12px) scale(.99)}to{opacity:1;transform:none}}@keyframes web-bounce{0%,100%{transform:translateY(0)}45%{transform:translateY(-4px)}70%{transform:translateY(1px)}}
@view-transition{navigation:auto}::view-transition-old(root){animation:web-fade-out 160ms ease-out both}::view-transition-new(root){animation:web-arrive 280ms var(--web-ease) both}@keyframes web-fade-out{to{opacity:0}}
@media(max-width:1000px){.web-header-inner{padding:12px 24px;gap:20px}.web-brand img{width:210px;height:72px}.web-nav{gap:20px}.web-actions span{display:none}.web-hero,.web-intro,.web-visit{margin-left:24px;margin-right:24px}.web-footer-grid{gap:25px}.web-visit{padding:30px}}
@media(max-width:700px){html{scroll-padding-top:90px}.web-top{font-size:10px;padding:8px 16px;letter-spacing:0}.web-header-inner{min-height:80px;padding:8px 16px;gap:16px;flex-wrap:wrap}.web-brand{margin-right:auto}.web-brand img{width:184px;height:62px}.web-actions{gap:18px;order:1}.web-toggle{order:2;display:flex;width:38px;height:42px;flex-direction:column;justify-content:center;gap:5px;background:none;border:0;padding:8px}.web-toggle span{display:block;width:22px;height:2px;background:var(--web-ink);transition:transform 220ms,opacity 220ms}.web-toggle[aria-expanded=true] span:first-child{transform:translateY(7px) rotate(45deg)}.web-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.web-toggle[aria-expanded=true] span:last-child{transform:translateY(-7px) rotate(-45deg)}.web-nav{display:none;order:3;flex-basis:100%;padding:8px 0 15px;gap:5px;flex-direction:column;align-items:stretch}.web-nav.is-open{display:flex;animation:web-arrive 250ms var(--web-ease)}.web-nav a{padding:12px}.web-hero{margin:20px 16px 0;border-radius:12px}.web-hero>img{height:240px;object-fit:cover;object-position:center}.web-hero-actions{padding:20px;gap:17px;flex-wrap:wrap}.web-button{padding:13px 18px;font-size:14px}.web-text-link{font-size:14px}.web-intro{margin:0 20px;padding:25px 0;display:block}.web-intro p{font-size:17px;margin-top:14px}.sectionHeader{padding-top:35px}.sectionHeader h1{font-size:28px}.main{padding:20px!important}.web-visit{margin:25px 16px 0;padding:27px 23px;display:block}.web-visit h2{font-size:27px}.web-visit .web-button{margin-top:22px}.web-footer{margin-top:32px;padding:35px 24px 0}.web-footer-grid{grid-template-columns:1fr 1fr;gap:28px 20px}.web-footer-brand{grid-column:1/-1}.web-footer-bottom{flex-wrap:wrap;gap:14px;margin-top:25px}.web-footer-bottom>span{width:100%}.web-footer-bottom>a{margin:0 auto 0 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}

body{padding-top:0!important;padding-bottom:0!important}.menu-hamburger,footer.footer,div.footer,.footer-menu,.drawer-version{display:none!important}@media(max-width:700px){.web-hero>img{height:auto;object-fit:contain}}

/* Card Grid Styling for All Collections on Homepage */
.CatCollection{display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:20px!important;width:100%!important;margin:20px 0 40px!important}
@media(max-width:1024px){.CatCollection{grid-template-columns:repeat(3,1fr)!important;gap:16px!important}}
@media(max-width:640px){.CatCollection{grid-template-columns:repeat(2,1fr)!important;gap:12px!important}}
.CatCollection>div{background:#fff!important;border-radius:12px!important;border:1px solid #e2e8f0!important;padding:14px!important;text-align:center!important;cursor:pointer!important;transition:transform 220ms ease,box-shadow 220ms ease,border-color 220ms ease!important;box-shadow:0 4px 12px rgba(0,0,0,.04)!important}
.CatCollection>div:hover{transform:translateY(-4px)!important;box-shadow:0 12px 24px rgba(16,40,63,.12)!important;border-color:#cbd5e1!important}
.CatCollection table.res_mob_font_width{width:100%!important;border-collapse:collapse!important;margin:0!important}
.CatCollection img.imghei3{width:100%!important;height:190px!important;object-fit:contain!important;object-position:center!important;border-radius:8px!important;background-color:#f8fafc!important;padding:6px!important;transition:transform 350ms ease!important}
.CatCollection>div:hover img.imghei3{transform:scale(1.02)!important}

/* Product Grid Image Styling (e.g. Bracelets, Mangalsutra, Chains) */
#gvData .productGrid img.imghei3 {
    width: 100% !important;
    height: 240px !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #f8fafc !important;
    padding: 6px !important;
    border-radius: 8px !important;
}

/* ===== Animated Font Awesome icons + menu/link effects (all pages) ===== */
.web-nav a,
.web-actions a,
.web-footer .web-footer-grid a {
    transition: color 240ms ease, transform 260ms var(--web-ease), background 240ms ease;
}

.web-nav a i,
.web-actions a i,
.web-footer .web-footer-grid a i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    vertical-align: -1px;
    font-size: 14px;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-style: normal !important;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.web-version {
    display: inline-block;
    margin-left: 9px;
    padding: 2px 9px;
    border: 1px solid #405369;
    border-radius: 999px;
    color: #9fb4c5;
    font-size: 10px;
    letter-spacing: .08em;
    font-weight: 500;
    vertical-align: 1px;
    animation: web-pulse-soft 3.4s var(--web-ease) infinite;
}

.web-nav a i,
.web-actions a i {
    animation: web-icon-idle 3.4s var(--web-ease) infinite 1.4s;
}

@keyframes web-icon-idle {
    0%, 100% { transform: translateY(0) rotate(0); }
    42% { transform: translateY(-2px) rotate(-5deg); }
    64% { transform: translateY(1px) rotate(3deg); }
}

@keyframes web-pulse-soft {
    0%, 100% { box-shadow: 0 0 0 0 rgba(159, 180, 197, 0); }
    50% { box-shadow: 0 0 0 5px rgba(159, 180, 197, .18); }
}

.web-nav a:hover i,
.web-actions a:hover i {
    animation: web-icon-hop 500ms var(--web-ease) both;
}

@keyframes web-icon-hop {
    0%, 100% { transform: translateY(0) rotate(0) scale(1); }
    35% { transform: translateY(-4px) rotate(-8deg) scale(1.14); }
    70% { transform: translateY(2px) rotate(6deg) scale(1.06); }
}

.web-nav a:hover {
    color: #2c5a83;
}

.web-actions a i {
    font-size: 19px;
    width: 22px;
    height: 22px;
    margin: 0;
}

.web-actions a:hover i {
    animation: web-icon-pop 480ms var(--web-ease) both;
}

@keyframes web-icon-pop {
    0%, 100% { transform: translateY(0) scale(1); }
    40% { transform: translateY(-3px) scale(1.08); }
    70% { transform: translateY(1px) scale(1.03); }
}

.web-button {
    transition: background 300ms ease, transform 300ms var(--web-ease), box-shadow 300ms ease;
}

.web-button:hover {
    transform: translateY(-2px);
}

.web-button span {
    display: inline-block;
    transition: transform 300ms var(--web-ease);
}

.web-button:hover span {
    transform: translate(2px, -2px);
}

.web-footer .web-footer-grid a i {
    font-size: 11px;
    margin-right: 9px;
    opacity: .72;
    transition: transform 260ms var(--web-ease), opacity 260ms ease;
}

.web-footer .web-footer-grid a:hover {
    color: #fff;
    transform: translateX(3px);
    text-decoration: none;
}

.web-footer .web-footer-grid a:hover i {
    transform: translateX(2px);
    opacity: 1;
}

/* ===== Product grid redesign (product-page, bracelets, chains, earrings, rings, mangalsutra) ===== */
#gvData .productGrid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 22px !important;
    align-items: stretch !important;
    margin: 8px 0 26px !important;
}

#gvData .productGrid .col-6 {
    background: #fff !important;
    border: 1px solid #e7edf3 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    cursor: pointer !important;
    box-shadow: 0 6px 18px rgba(16, 40, 63, .06) !important;
    transition: transform 340ms var(--web-ease), box-shadow 340ms var(--web-ease), border-color 340ms ease !important;
    animation: web-card-in 520ms var(--web-ease) backwards;
    width: 100% !important;
    padding: 0 !important;
    float: none !important;
}

#gvData .productGrid .col-6:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 20px 38px rgba(16, 40, 63, .15) !important;
    border-color: #c7d5df !important;
}

@keyframes web-card-in {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: none; }
}

#gvData .productGrid .col-6:nth-child(1) { animation-delay: .02s; }
#gvData .productGrid .col-6:nth-child(2) { animation-delay: .07s; }
#gvData .productGrid .col-6:nth-child(3) { animation-delay: .12s; }
#gvData .productGrid .col-6:nth-child(4) { animation-delay: .17s; }
#gvData .productGrid .col-6:nth-child(5) { animation-delay: .22s; }
#gvData .productGrid .col-6:nth-child(6) { animation-delay: .27s; }
#gvData .productGrid .col-6:nth-child(7) { animation-delay: .32s; }
#gvData .productGrid .col-6:nth-child(8) { animation-delay: .37s; }

#gvData .productGrid table.res_mob_font_width {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: table !important;
}

#gvData .productGrid img.imghei3 {
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #f2f5f8 !important;
    padding: 10px !important;
    border-radius: 0 !important;
    border-bottom: 1px solid #eef2f6 !important;
    transition: transform 500ms var(--web-ease) !important;
}

#gvData .productGrid .col-6:hover img.imghei3 {
    transform: scale(1.05) !important;
}

#gvData .productGrid .buy_sell_label {
    background: none !important;
    border: 0 !important;
}

#gvData .productGrid tr:nth-of-type(2) td {
    display: block !important;
    padding: 14px 16px 4px !important;
    color: #10283f !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    font-family: WebFigtree, Arial, sans-serif !important;
    text-align: left !important;
}

#gvData .productGrid tr:nth-of-type(3) td {
    display: block !important;
    padding: 0 16px 16px !important;
    color: #506175 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    font-family: WebFigtree, Arial, sans-serif !important;
    text-align: left !important;
}

@media (max-width: 1000px) {
    #gvData .productGrid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }
}

@media (max-width: 700px) {
    #gvData .productGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    #gvData .productGrid .col-6 {
        border-radius: 12px !important;
    }
}

