@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;600;700&family=DM+Sans:wght@300;400;500;600&display=swap'); /* ══════════════════════════════════════════════════ ICNC 2026 Sponsors — scoped CSS Load this file via Joomla > Templates > Custom CSS or link it in your template's . All rules are scoped to .icnc2026-sponsors so they cannot affect the rest of the page. ══════════════════════════════════════════════════ */ .icnc2026-sponsors { --icnc-gold: #C9A84C; --icnc-silver: #8FA8B8; --icnc-bronze: #B07340; --icnc-supporter: #5A8A6A; --icnc-exhibitor: #4A6FA5; --icnc-bg: #06101A; --icnc-surface: #0D1E2C; --icnc-text: #E8EFF5; --icnc-muted: #7A9AB0; --icnc-border: rgba(255,255,255,0.07); position: relative; background: var(--icnc-bg); color: var(--icnc-text); font-family: 'DM Sans', sans-serif; font-weight: 300; overflow: hidden; box-sizing: border-box; } .icnc2026-sponsors *, .icnc2026-sponsors *::before, .icnc2026-sponsors *::after { box-sizing: border-box; margin: 0; padding: 0; } /* background glow */ .icnc2026-sponsors::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 15% 20%, rgba(74,111,165,0.12) 0%, transparent 60%), radial-gradient(ellipse 50% 40% at 85% 75%, rgba(90,138,106,0.10) 0%, transparent 60%), radial-gradient(ellipse 40% 60% at 50% 50%, rgba(201,168,76,0.04) 0%, transparent 70%); pointer-events: none; z-index: 0; } .icnc2026-sponsors .icnc-page-wrap { position: relative; z-index: 1; max-width: 1100px; margin: 0 auto; padding: 60px 24px 80px; } /* ── Header ── */ .icnc2026-sponsors .icnc-header { text-align: center; margin-bottom: 64px; animation: icncFadeDown 0.8s ease both; } .icnc2026-sponsors .icnc-eyebrow { font-size: 11px; font-weight: 500; letter-spacing: 0.28em; text-transform: uppercase; color: var(--icnc-gold); margin-bottom: 14px; opacity: 0.85; display: block; } .icnc2026-sponsors .icnc-header h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(2.4rem, 5vw, 3.8rem); font-weight: 300; line-height: 1.15; letter-spacing: -0.01em; color: var(--icnc-text); border: none; background: none; padding: 0; margin: 0; text-transform: none; } .icnc2026-sponsors .icnc-header h2 span { color: var(--icnc-gold); font-style: italic; } .icnc2026-sponsors .icnc-header-rule { width: 48px; height: 1px; background: var(--icnc-gold); margin: 22px auto 0; opacity: 0.6; } /* ── Tier sections ── */ .icnc2026-sponsors .icnc-tier { margin-bottom: 52px; animation: icncFadeUp 0.7s ease both; } .icnc2026-sponsors .icnc-tier:nth-child(2) { animation-delay: 0.10s; } .icnc2026-sponsors .icnc-tier:nth-child(3) { animation-delay: 0.18s; } .icnc2026-sponsors .icnc-tier:nth-child(4) { animation-delay: 0.26s; } .icnc2026-sponsors .icnc-tier:nth-child(5) { animation-delay: 0.34s; } .icnc2026-sponsors .icnc-tier-header { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; } .icnc2026-sponsors .icnc-tier-badge { display: inline-flex; align-items: center; gap: 8px; padding: 5px 16px 5px 10px; border-radius: 3px; font-size: 11px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; border-left: 3px solid currentColor; background: rgba(255,255,255,0.04); white-space: nowrap; } .icnc2026-sponsors .icnc-tier-line { flex: 1; height: 1px; background: var(--icnc-border); /* override any Joomla margin/padding on the nbsp inside */ font-size: 0; line-height: 0; } .icnc2026-sponsors .icnc-tier.icnc-silver .icnc-tier-badge { color: var(--icnc-silver); } .icnc2026-sponsors .icnc-tier.icnc-bronze .icnc-tier-badge { color: var(--icnc-bronze); } .icnc2026-sponsors .icnc-tier.icnc-supporter .icnc-tier-badge { color: var(--icnc-supporter); } .icnc2026-sponsors .icnc-tier.icnc-exhibitor .icnc-tier-badge { color: var(--icnc-exhibitor); } /* ── Grids ── */ .icnc2026-sponsors .icnc-cards-grid { display: grid; gap: 16px; } .icnc2026-sponsors .icnc-tier.icnc-silver .icnc-cards-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); } .icnc2026-sponsors .icnc-tier.icnc-bronze .icnc-cards-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); } .icnc2026-sponsors .icnc-tier.icnc-supporter .icnc-cards-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); } .icnc2026-sponsors .icnc-tier.icnc-exhibitor .icnc-cards-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } /* ── Cards ── */ .icnc2026-sponsors .icnc-card { position: relative; background: var(--icnc-surface); border: 1px solid var(--icnc-border); border-radius: 6px; overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; cursor: default; } .icnc2026-sponsors .icnc-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,0,0,0.4); } .icnc2026-sponsors .icnc-tier.icnc-silver .icnc-card:hover { border-color: rgba(143,168,184,0.35); } .icnc2026-sponsors .icnc-tier.icnc-bronze .icnc-card:hover { border-color: rgba(176,115,64,0.35); } .icnc2026-sponsors .icnc-tier.icnc-supporter .icnc-card:hover { border-color: rgba(90,138,106,0.35); } .icnc2026-sponsors .icnc-tier.icnc-exhibitor .icnc-card:hover { border-color: rgba(74,111,165,0.35); } /* top accent stripe on hover */ .icnc2026-sponsors .icnc-card::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; opacity: 0; transition: opacity 0.25s ease; } .icnc2026-sponsors .icnc-card:hover::after { opacity: 1; } .icnc2026-sponsors .icnc-tier.icnc-silver .icnc-card::after { background: var(--icnc-silver); } .icnc2026-sponsors .icnc-tier.icnc-bronze .icnc-card::after { background: var(--icnc-bronze); } .icnc2026-sponsors .icnc-tier.icnc-supporter .icnc-card::after { background: var(--icnc-supporter); } .icnc2026-sponsors .icnc-tier.icnc-exhibitor .icnc-card::after { background: var(--icnc-exhibitor); } /* ── Logo area — white background so logos are visible ── */ .icnc2026-sponsors .icnc-card-logo { width: 100%; display: flex; align-items: center; justify-content: center; background: #ffffff; border-bottom: 1px solid rgba(0,0,0,0.06); overflow: hidden; padding: 16px; } .icnc2026-sponsors .icnc-tier.icnc-silver .icnc-card-logo { height: 130px; } .icnc2026-sponsors .icnc-tier.icnc-bronze .icnc-card-logo { height: 110px; } .icnc2026-sponsors .icnc-tier.icnc-supporter .icnc-card-logo { height: 110px; } .icnc2026-sponsors .icnc-tier.icnc-exhibitor .icnc-card-logo { height: 90px; } .icnc2026-sponsors .icnc-card-logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; } /* placeholder shown when no logo image yet */ .icnc2026-sponsors .icnc-logo-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 100%; color: #aab8c4; } .icnc2026-sponsors .icnc-logo-placeholder span { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 500; } /* ── Card name ── */ .icnc2026-sponsors .icnc-card-body { padding: 14px 16px 15px; } .icnc2026-sponsors .icnc-card-name { font-size: 13px; font-weight: 500; color: var(--icnc-text); line-height: 1.4; margin: 0; } .icnc2026-sponsors .icnc-tier.icnc-silver .icnc-card-name { font-size: 15px; font-weight: 600; } .icnc2026-sponsors .icnc-tier.icnc-bronze .icnc-card-name { font-size: 14px; } /* ── Footer ── */ .icnc2026-sponsors .icnc-footer-note { text-align: center; margin-top: 56px; color: var(--icnc-muted); font-size: 12px; letter-spacing: 0.06em; opacity: 0.6; } /* ── Animations ── */ @keyframes icncFadeDown { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } } @keyframes icncFadeUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } } /* ── Responsive ── */ @media (max-width: 600px) { .icnc2026-sponsors .icnc-tier .icnc-cards-grid { grid-template-columns: 1fr 1fr; } }