/* =========================================================
   CONTROLLED DOWNLOAD CENTER V1
   Public-safe commercial delivery architecture.
   ========================================================= */

.dc-section{
    position:relative;
    padding:86px 0 96px;
    overflow:hidden;
    background:
        radial-gradient(circle at 10% 10%,rgba(91,234,255,.06),transparent 30%),
        radial-gradient(circle at 88% 82%,rgba(184,255,104,.045),transparent 30%);
}

.dc-boundary{
    margin-bottom:12px;
    padding:12px 14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    border:1px solid rgba(255,172,104,.14);
    border-radius:18px;
    color:rgba(255,214,175,.62);
    background:
        linear-gradient(145deg,rgba(255,172,104,.035),rgba(255,255,255,.008)),
        rgba(9,20,30,.58);
    font:650 .41rem/1.55 monospace;
}

.dc-boundary strong{
    color:rgba(255,230,205,.86);
    letter-spacing:.05em;
}

.dc-chain{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:7px;
    margin-bottom:14px;
}

.dc-chain-step{
    position:relative;
    min-height:130px;
    padding:12px;
    display:grid;
    align-content:space-between;
    gap:18px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:21px;
    background:
        radial-gradient(circle at 0 0,rgba(91,234,255,.065),transparent 44%),
        linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.006)),
        rgba(255,255,255,.01);
}

.dc-chain-step:not(:last-child)::after{
    content:"→";
    position:absolute;
    z-index:3;
    right:-10px;
    top:50%;
    width:20px;
    height:20px;
    display:grid;
    place-items:center;
    transform:translateY(-50%);
    border:1px solid rgba(255,255,255,.07);
    border-radius:50%;
    color:rgba(91,234,255,.56);
    background:#09151f;
    font-size:.46rem;
}

.dc-chain-step span{
    color:rgba(91,234,255,.62);
    font:700 .35rem/1 monospace;
    letter-spacing:.07em;
}

.dc-chain-step strong{
    color:#fff;
    font-size:.65rem;
    line-height:1.24;
}

.dc-chain-step small{
    color:rgba(255,255,255,.30);
    font-size:.38rem;
    line-height:1.45;
}

.dc-control{
    padding:15px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:26px;
    background:
        radial-gradient(circle at 0 0,rgba(91,234,255,.05),transparent 32%),
        linear-gradient(145deg,rgba(255,255,255,.032),rgba(255,255,255,.007)),
        rgba(8,19,29,.66);
    box-shadow:
        0 24px 68px rgba(0,0,0,.13),
        inset 0 1px 0 rgba(255,255,255,.04);
}

.dc-toolbar{
    display:grid;
    grid-template-columns:minmax(250px,1fr) auto;
    gap:10px;
    align-items:center;
}

.dc-search{
    width:100%;
    min-height:44px;
    padding:0 15px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:999px;
    outline:0;
    color:#fff;
    background:rgba(255,255,255,.014);
}

.dc-search:focus{
    border-color:rgba(91,234,255,.28);
    box-shadow:0 0 0 4px rgba(91,234,255,.035);
}

.dc-filters{
    display:flex;
    gap:6px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.dc-filter{
    min-height:38px;
    padding:0 11px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:999px;
    color:rgba(255,255,255,.40);
    background:rgba(255,255,255,.01);
    cursor:pointer;
    font:700 .36rem/1 monospace;
}

.dc-filter:hover,
.dc-filter.is-active{
    color:#fff;
    border-color:rgba(91,234,255,.22);
    background:linear-gradient(135deg,rgba(91,234,255,.06),rgba(184,255,104,.03));
}

.dc-meta{
    margin:11px 2px 10px;
    display:flex;
    justify-content:space-between;
    gap:12px;
    color:rgba(255,255,255,.28);
    font:650 .38rem/1 monospace;
    letter-spacing:.05em;
}

.dc-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
}

.dc-product{
    min-height:228px;
    padding:14px;
    display:grid;
    grid-template-rows:auto 1fr auto;
    gap:14px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:23px;
    color:inherit;
    background:
        radial-gradient(circle at 0 0,rgba(91,234,255,.055),transparent 42%),
        radial-gradient(circle at 100% 100%,rgba(184,255,104,.035),transparent 42%),
        rgba(255,255,255,.01);
    transition:
        transform .2s cubic-bezier(.2,.75,.2,1),
        border-color .2s ease,
        box-shadow .2s ease;
}

.dc-product:hover{
    transform:translateY(-3px);
    border-color:rgba(91,234,255,.20);
    box-shadow:
        0 22px 52px rgba(0,0,0,.14),
        0 0 26px rgba(91,234,255,.035);
}

.dc-product-head{
    display:flex;
    justify-content:space-between;
    gap:8px;
    align-items:center;
}

.dc-product-head span{
    color:rgba(91,234,255,.58);
    font:700 .36rem/1 monospace;
    letter-spacing:.065em;
}

.dc-state{
    padding:6px 7px;
    border:1px solid rgba(255,114,183,.12);
    border-radius:999px;
    color:rgba(255,145,197,.70);
    background:rgba(255,114,183,.025);
    font:700 .31rem/1 monospace;
}

.dc-product h3{
    margin:0 0 8px;
    color:#fff;
    font-size:.84rem;
    line-height:1.22;
}

.dc-product p{
    margin:0;
    color:rgba(255,255,255,.37);
    font-size:.47rem;
    line-height:1.52;
}

.dc-product footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.dc-chips{
    display:flex;
    gap:5px;
    flex-wrap:wrap;
}

.dc-chip{
    padding:5px 6px;
    border:1px solid rgba(255,255,255,.055);
    border-radius:999px;
    color:rgba(255,255,255,.30);
    background:rgba(255,255,255,.008);
    font:650 .31rem/1 monospace;
}

.dc-open{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border:1px solid rgba(91,234,255,.13);
    border-radius:50%;
    color:rgba(91,234,255,.72);
    background:rgba(91,234,255,.02);
    font-style:normal;
}

.dc-empty{
    grid-column:1/-1;
    padding:30px;
    border:1px dashed rgba(255,255,255,.07);
    border-radius:22px;
    color:rgba(255,255,255,.32);
    text-align:center;
}

.dc-state-grid{
    margin-top:14px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}

.dc-state-card{
    min-height:142px;
    padding:12px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:21px;
    background:rgba(255,255,255,.01);
}

.dc-state-card span{
    color:rgba(184,255,104,.58);
    font:700 .35rem/1 monospace;
}

.dc-state-card strong{
    display:block;
    margin-top:16px;
    color:#fff;
    font-size:.72rem;
}

.dc-state-card p{
    margin:7px 0 0;
    color:rgba(255,255,255,.34);
    font-size:.43rem;
    line-height:1.5;
}

@media(max-width:1100px){
    .dc-chain{grid-template-columns:repeat(4,minmax(0,1fr))}
    .dc-chain-step::after{display:none}
    .dc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:780px){
    .dc-toolbar{grid-template-columns:1fr}
    .dc-filters{justify-content:flex-start}
    .dc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .dc-state-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:560px){
    .dc-section{padding:64px 0 72px}
    .dc-chain,.dc-grid,.dc-state-grid{grid-template-columns:1fr}
    .dc-control{border-radius:21px}
    .dc-product{border-radius:20px}
    .dc-boundary{align-items:flex-start;flex-direction:column}
}
