/* =========================================================
   CELESTIAL SHOP · TITÁN KOLLEKCIÓ
   Állandó, csak itt megvásárolható Special skinek (titan_68/43/10).
   Paletta: elefántcsont, ragyogó arany, égi kék + hősenkénti energia.
   ========================================================= */
.bf-titan-collection {
    --t1:#97B8EE; --t2:#6EFEFE; --t3:#FDF3E3; --t4:#BA713A; --t5:#F9BE5D;
    position:relative; isolation:isolate; margin:0 0 46px; padding:clamp(22px,2vw,40px);
    border:1px solid color-mix(in srgb,var(--t5) 46%,transparent); border-radius:9px; overflow:hidden;
    background:
        radial-gradient(ellipse 60% 70% at 12% 0,color-mix(in srgb,var(--t5) 22%,transparent),transparent 70%),
        radial-gradient(ellipse 55% 60% at 92% 100%,color-mix(in srgb,var(--t1) 26%,transparent),transparent 70%),
        linear-gradient(160deg,#1c2338,#0d1424 62%,#151a2b);
    box-shadow:inset 0 0 0 1px #fdf3e310,inset 0 0 60px color-mix(in srgb,var(--t2) 8%,transparent),0 18px 60px #0006;
}
.bf-titan-collection::before {
    content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.35;
    background:repeating-conic-gradient(from 0deg at 50% -30%,#fdf3e30d 0 4deg,transparent 4deg 12deg);
    mask:linear-gradient(#000,transparent 80%);
}
.bf-titan-aura { position:absolute; inset:0; z-index:-1; pointer-events:none; }
.bf-titan-aura i { position:absolute; width:2px; height:120%; top:-10%; background:linear-gradient(transparent,var(--t2),transparent); opacity:.3; filter:blur(1px); animation:bf-titan-ray 7s ease-in-out infinite; }
.bf-titan-aura i:nth-child(1) { left:18%; }
.bf-titan-aura i:nth-child(2) { left:52%; animation-delay:-2.4s; background:linear-gradient(transparent,var(--t5),transparent); }
.bf-titan-aura i:nth-child(3) { left:84%; animation-delay:-4.6s; background:linear-gradient(transparent,var(--t1),transparent); }
@keyframes bf-titan-ray { 0%,100% { transform:translateY(-6%) rotate(8deg); opacity:.12; } 50% { transform:translateY(6%) rotate(8deg); opacity:.42; } }

.bf-titan-head { display:flex; align-items:center; gap:clamp(16px,2vw,36px); margin-bottom:28px; }
.bf-titan-emblem { flex:0 0 auto; width:clamp(150px,13vw,260px); height:auto; filter:drop-shadow(0 0 18px color-mix(in srgb,var(--t5) 55%,transparent)) drop-shadow(0 6px 14px #0008); }
.bf-titan-head>div:not(.bf-titan-chip) { flex:1; min-width:0; }
.bf-titan-head .bf-eyebrow { color:var(--t2); letter-spacing:.16em; text-shadow:0 0 12px color-mix(in srgb,var(--t2) 60%,transparent); }
.bf-titan-head h3 { margin:6px 0 8px; font:400 clamp(28px,2vw,44px) "AOW",Georgia,serif; color:var(--t3);
    background:linear-gradient(100deg,var(--t3) 20%,var(--t5) 50%,var(--t3) 80%); background-size:220% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
    animation:bf-titan-shine 6s linear infinite; filter:drop-shadow(0 0 10px color-mix(in srgb,var(--t5) 35%,transparent)); }
@keyframes bf-titan-shine { to { background-position:-220% 0; } }
.bf-titan-head p { margin:0; max-width:720px; color:#b9c6dc; font-size:13px; line-height:1.7; }
.bf-titan-chip { flex:0 0 auto; display:flex; align-items:center; gap:10px; padding:14px 20px; border:1px solid color-mix(in srgb,var(--t5) 55%,transparent); border-radius:6px;
    background:linear-gradient(135deg,#fdf3e314,#f9be5d10); box-shadow:inset 0 0 18px #f9be5d14; }
.bf-titan-chip img { width:30px; height:30px; object-fit:contain; }
.bf-titan-chip strong { font-size:28px; font-weight:500; color:var(--t5); }
.bf-titan-chip span { font-size:11px; color:#c4cee0; }

.bf-titan-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,1.4vw,30px); }
.bf-product.is-titan { --rarity:var(--t5); --energy:var(--t2); position:relative; border-color:color-mix(in srgb,var(--t5) 55%,transparent);
    background:linear-gradient(160deg,#283149,#121a2c 68%,#1d2131); box-shadow:inset 0 0 0 1px #fdf3e30c,inset 0 0 34px color-mix(in srgb,var(--energy) 10%,transparent); }
.bf-product.is-titan-10 { --energy:var(--t1); }
.bf-product.is-titan-43 { --energy:var(--t5); }
.bf-product.is-titan-68 { --energy:var(--t2); }
.bf-product.is-titan:hover { border-color:var(--t5); box-shadow:0 0 0 1px #f9be5d55,0 14px 44px #0006,0 0 34px color-mix(in srgb,var(--energy) 28%,transparent); }
.bf-product.is-titan>header { background:linear-gradient(90deg,#f9be5d1c,transparent 70%); border-bottom:1px solid #f9be5d26; }
.bf-product.is-titan>header>span:last-child { color:var(--energy); letter-spacing:.14em; }
.bf-product.is-titan .bf-product-art { background:radial-gradient(ellipse at 50% 60%,color-mix(in srgb,var(--energy) 22%,#0b1220),#070c16 75%); }
.bf-product.is-titan .bf-product-art>img { position:relative; z-index:1; }
.bf-product.is-titan .bf-product-art::after { content:""; position:absolute; inset:0 0 34px; z-index:2; pointer-events:none;
    box-shadow:inset 0 0 40px color-mix(in srgb,var(--energy) 40%,transparent),inset 0 0 0 1px #fdf3e31c;
    background:linear-gradient(115deg,transparent 35%,#fdf3e322 48%,transparent 60%) no-repeat; background-size:250% 100%; animation:bf-titan-sweep 5.5s ease-in-out infinite; }
@keyframes bf-titan-sweep { 0%,55% { background-position:150% 0; } 100% { background-position:-150% 0; } }
.bf-titan-runes { position:absolute; inset:0 0 34px; z-index:3; pointer-events:none; }
.bf-titan-runes b { position:absolute; font:700 clamp(15px,1.1vw,22px) Georgia,serif; color:var(--t3); text-shadow:0 0 8px var(--energy),0 0 18px var(--energy); opacity:.75; animation:bf-titan-float 4.8s ease-in-out infinite; }
.bf-titan-runes b:nth-child(1) { left:7%; top:12%; }
.bf-titan-runes b:nth-child(2) { right:8%; top:22%; animation-delay:-1.2s; }
.bf-titan-runes b:nth-child(3) { left:11%; bottom:16%; animation-delay:-2.5s; }
.bf-titan-runes b:nth-child(4) { right:12%; bottom:10%; animation-delay:-3.6s; }
@keyframes bf-titan-float { 0%,100% { transform:translateY(0) scale(1); opacity:.45; } 50% { transform:translateY(-8px) scale(1.12); opacity:.95; } }
.bf-product.is-titan .bf-product-info h3 { color:var(--t3); text-shadow:0 0 14px color-mix(in srgb,var(--energy) 35%,transparent); }
.bf-product.is-titan .bf-product-price strong { color:var(--t5); }
.bf-product.is-titan .bf-btn-primary:not(:disabled) { color:#22170a; border-color:var(--t5); background:linear-gradient(115deg,var(--t3),var(--t5) 55%,var(--t4)); box-shadow:0 0 18px #f9be5d40; }
.bf-store-nav button.is-titan { color:#f2d9a6; }
.bf-store-nav button.is-titan.is-active { background:linear-gradient(115deg,#f9be5d1f,#97b8ee14); border-color:#f9be5d66; color:#fdf3e3; }

.bf-skin-dialog.is-titan { border-color:#f9be5d8c; box-shadow:0 30px 100px #0009,0 0 60px #6efefe22; }
.bf-skin-dialog.is-titan .bf-skin-full { background:radial-gradient(ellipse at 50% 55%,#97b8ee2b,#050910 70%); }
.bf-skin-dialog.is-titan .bf-eyebrow { color:#6EFEFE; }

@media (max-width:1200px) { .bf-titan-head { flex-wrap:wrap; } .bf-titan-chip { order:3; } }
@media (max-width:950px) { .bf-titan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .bf-titan-emblem { width:150px; } }
@media (max-width:600px) {
    .bf-titan-collection { padding:18px 16px; }
    .bf-titan-grid { grid-template-columns:1fr; gap:22px; }
    .bf-titan-head { gap:12px; }
    .bf-titan-chip { width:100%; justify-content:center; }
}
@media (prefers-reduced-motion:reduce) {
    .bf-titan-aura i,.bf-titan-head h3,.bf-product.is-titan .bf-product-art::after,.bf-titan-runes b { animation:none; }
}