@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=DM+Sans:wght@300;400;500&display=swap');

/* ── Positioning context for absolute wraps ── */
html { position: relative; }

/* ── Footer slot: zero-size invisible container injected at end of body ── */
.iimbg-dl-footer-slot {
    position: static;
    display: block;
    width: 0;
    height: 0;
    overflow: visible;
    pointer-events: none;
}
.iimbg-dl-footer-slot .iimbg-dl-wrap {
    pointer-events: auto;
}


/* ── Root / theming via CSS var injected inline ── */
.iimbg-dl-wrap {
    --dl-color:       #6B1A1A;
    --dl-color-deep:  color-mix(in srgb, var(--dl-color) 75%, #000);
    --dl-color-light: color-mix(in srgb, var(--dl-color) 70%, #fff);
    --dl-gold:        #C9922A;
    --dl-gold-light:  #E8B84B;
    --dl-cream:       #FAF6EE;
    --dl-text-dark:   #1A0A0A;
    --dl-text-mid:    #4A3030;
    --dl-text-light:  #8A6A6A;
    font-family: 'DM Sans', sans-serif;
    color: var(--dl-text-dark);
    background: var(--dl-cream);
    padding: 0 0 80px;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}
.iimbg-dl-wrap *, .iimbg-dl-wrap *::before, .iimbg-dl-wrap *::after { box-sizing: border-box; }

.iimbg-dl-wrap::before {
    content: '';
    position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background-image:
        radial-gradient(circle at 10% 20%, color-mix(in srgb, var(--dl-color) 8%, transparent) 0%, transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(201,146,42,.07) 0%, transparent 40%);
}

/* ── Hero ── */
.iimbg-dl-hero {
    position: relative; z-index: 1;
    display: grid; grid-template-columns: 1fr auto; align-items: end;
    gap: 40px; padding: 60px 60px 44px; max-width: 1300px; margin: 0 auto;
}
.iimbg-dl-hero__eyebrow {
    font-size: .7rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase;
    color: var(--dl-gold); display: flex; align-items: center; gap: 10px; margin: 0 0 12px;
}
.iimbg-dl-hero__eyebrow::before { content:''; display:inline-block; width:26px; height:1px; background:var(--dl-gold); }
.iimbg-dl-hero__title {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2.2rem, 4vw, 3.8rem); font-weight: 300; line-height: 1.08;
    color: var(--dl-color-deep); letter-spacing: -.01em; margin: 0;
}
.iimbg-dl-hero__sub { margin: 12px 0 0; font-size: .9rem; font-weight: 300; color: var(--dl-text-light); max-width: 460px; line-height: 1.65; }
.iimbg-dl-hero__stat { text-align: right; }
.iimbg-dl-hero__number { display:block; font-family:'Cormorant Garamond',serif; font-size:3.8rem; font-weight:300; color:var(--dl-color); line-height:1; opacity:.2; }
.iimbg-dl-hero__label  { font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--dl-text-light); }

/* ── Divider ── */
.iimbg-dl-divider { position:relative; z-index:1; max-width:1300px; margin:0 auto 36px; padding:0 60px; border:none; border-top:1px solid color-mix(in srgb,var(--dl-color) 15%,transparent); }

/* ── Filter bar ── */
.iimbg-dl-filterbar {
    position:relative; z-index:1; max-width:1300px; margin:0 auto; padding:0 60px 32px;
    display:flex; align-items:center; flex-wrap:wrap; gap:12px;
}
.iimbg-dl-filterbar__label { font-size:.68rem; letter-spacing:.13em; text-transform:uppercase; color:var(--dl-text-light); flex-shrink:0; }
.iimbg-dl-tabs { display:flex; gap:5px; flex-wrap:wrap; }
.iimbg-dl-tab {
    padding:6px 16px; border-radius:100px; border:1px solid color-mix(in srgb,var(--dl-color) 25%,transparent);
    background:transparent; font-family:'DM Sans',sans-serif; font-size:.76rem; color:var(--dl-text-mid);
    cursor:pointer; transition:background .2s, color .2s, border-color .2s;
}
.iimbg-dl-tab:hover, .iimbg-dl-tab--active { background:var(--dl-color); border-color:var(--dl-color); color:#fff; }
.iimbg-dl-search {
    display:flex; align-items:center; gap:8px;
    border:1px solid color-mix(in srgb,var(--dl-color) 22%,transparent);
    border-radius:100px; padding:6px 16px; background:#fff; margin-left:auto;
}
.iimbg-dl-search svg { opacity:.35; flex-shrink:0; }
.iimbg-dl-search input { border:none; outline:none; background:transparent; font-family:'DM Sans',sans-serif; font-size:.8rem; color:var(--dl-text-dark); width:170px; }
.iimbg-dl-search input::placeholder { color:var(--dl-text-light); }

/* ── Grid ── */
.iimbg-dl-grid {
    position:relative; z-index:1; max-width:1300px; margin:0 auto; padding:0 60px;
    display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
}

/* ── Card ── */
.iimbg-dl-card {
    position:relative; background:#fff; border:1px solid color-mix(in srgb,var(--dl-color) 12%,transparent);
    border-radius:4px; overflow:hidden; cursor:pointer; text-decoration:none; color:inherit;
    display:flex; flex-direction:column; opacity:0;
    animation: dlFadeUp .5s ease forwards;
    transition: transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s, border-color .3s;
}
@keyframes dlFadeUp { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }
.iimbg-dl-card:nth-child(1) {animation-delay:50ms}  .iimbg-dl-card:nth-child(2) {animation-delay:100ms}
.iimbg-dl-card:nth-child(3) {animation-delay:150ms} .iimbg-dl-card:nth-child(4) {animation-delay:200ms}
.iimbg-dl-card:nth-child(5) {animation-delay:250ms} .iimbg-dl-card:nth-child(6) {animation-delay:300ms}
.iimbg-dl-card:nth-child(n+7){animation-delay:350ms}

.iimbg-dl-card:hover { transform:translateY(-4px); box-shadow:0 18px 45px color-mix(in srgb,var(--dl-color) 14%,transparent); border-color:color-mix(in srgb,var(--dl-color) 28%,transparent); }

.iimbg-dl-card__accent { position:absolute; top:0; left:0; height:2px; width:0; background:linear-gradient(90deg,var(--dl-color),var(--dl-gold)); transition:width .4s ease; pointer-events:none; }
.iimbg-dl-card:hover .iimbg-dl-card__accent { width:100%; }

.iimbg-dl-card__body { padding:24px 24px 18px; flex:1; display:flex; flex-direction:column; }
.iimbg-dl-card__tag  { font-size:.62rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--dl-gold); margin-bottom:7px; display:block; }
.iimbg-dl-card__label{ font-family:'Cormorant Garamond',serif; font-size:1.6rem; font-weight:600; color:var(--dl-color-deep); line-height:1; transition:color .2s; display:block; }
.iimbg-dl-card:hover .iimbg-dl-card__label { color:var(--dl-gold); }
.iimbg-dl-card__title{ font-size:.78rem; font-weight:300; color:var(--dl-text-light); margin-top:4px; letter-spacing:.02em; display:block; }

.iimbg-dl-card__footer { display:flex; align-items:center; justify-content:space-between; padding:12px 24px; border-top:1px solid color-mix(in srgb,var(--dl-color) 7%,transparent); background:color-mix(in srgb,var(--dl-color) 2%,transparent); }
.iimbg-dl-card__meta   { font-size:.68rem; color:var(--dl-text-light); display:flex; align-items:center; gap:6px; }
.iimbg-dl-card__dot    { width:4px; height:4px; border-radius:50%; background:var(--dl-gold-light); opacity:.55; flex-shrink:0; }
.iimbg-dl-card__arrow  { width:28px; height:28px; border-radius:50%; border:1px solid color-mix(in srgb,var(--dl-color) 22%,transparent); display:flex; align-items:center; justify-content:center; color:var(--dl-color); transition:transform .22s, background .2s, border-color .2s, color .2s; flex-shrink:0; }
.iimbg-dl-card:hover .iimbg-dl-card__arrow { background:var(--dl-color); border-color:var(--dl-color); color:#fff; transform:translate(2px,-2px); }

/* ── Featured card ── */
.iimbg-dl-card--featured { grid-column:span 2; flex-direction:row; }
.iimbg-dl-card--featured .iimbg-dl-card__inner { display:flex; flex-direction:column; flex:1; }
.iimbg-dl-card__visual {
    width:160px; flex-shrink:0;
    background:linear-gradient(135deg, var(--dl-color-deep), var(--dl-color-light));
    display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
}
.iimbg-dl-card__visual::after { content:''; position:absolute; inset:0; background-image:radial-gradient(circle,rgba(255,255,255,.07) 1px,transparent 1px); background-size:22px 22px; }
.iimbg-dl-card__badge { position:absolute; top:13px; left:13px; background:var(--dl-gold); color:#fff; font-size:.56rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; padding:3px 8px; border-radius:2px; z-index:2; }
.iimbg-dl-card__visual-text { font-family:'Cormorant Garamond',serif; font-size:.62rem; letter-spacing:.15em; text-transform:uppercase; color:rgba(255,255,255,.6); writing-mode:vertical-rl; transform:rotate(180deg); position:relative; z-index:1; }
.iimbg-dl-card--featured .iimbg-dl-card__body  { padding:28px 28px 20px; }
.iimbg-dl-card--featured .iimbg-dl-card__label { font-size:2rem; }
.iimbg-dl-card--featured .iimbg-dl-card__footer{ padding:14px 28px; }

/* ── Empty / no results ── */
.iimbg-dl-no-docs { padding:40px 60px; color:var(--dl-text-light); font-size:.9rem; position:relative; z-index:1; }
.iimbg-dl-empty   { text-align:center; color:var(--dl-text-light); font-size:.88rem; padding:32px; max-width:1300px; margin:0 auto; }

/* ── Responsive ── */
@media(max-width:1024px){ .iimbg-dl-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:768px){
    .iimbg-dl-hero,.iimbg-dl-divider,.iimbg-dl-filterbar,.iimbg-dl-grid,.iimbg-dl-no-docs { padding-left:24px; padding-right:24px; }
    .iimbg-dl-hero { grid-template-columns:1fr }
    .iimbg-dl-hero__stat { display:none }
    .iimbg-dl-grid { grid-template-columns:1fr 1fr }
    .iimbg-dl-card--featured { grid-column:span 2 }
    .iimbg-dl-search { margin-left:0; width:100% }
    .iimbg-dl-search input { width:100% }
}
@media(max-width:520px){
    .iimbg-dl-grid { grid-template-columns:1fr }
    .iimbg-dl-card--featured { grid-column:span 1; flex-direction:column }
    .iimbg-dl-card__visual { width:100%; height:66px }
    .iimbg-dl-card__visual-text { writing-mode:horizontal-tb; transform:none }
}
