.boyut-asc-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    width:100%;
    overflow:hidden;
    background:#151515;
}
.boyut-asc-card{
    --boyut-asc-speed:.65s;
    position:relative;
    min-height:390px;
    padding:34px 32px 30px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    isolation:isolate;
    overflow:hidden;
    text-decoration:none!important;
    color:#fff;
    background:#151515;
    border-right:1px solid rgba(255,255,255,.13);
    transform:translateZ(0);
    transition:
        background-color var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1),
        transform var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1);
}
.boyut-asc-card:last-child{border-right:0}
.boyut-asc-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,rgba(255,255,255,.08),transparent 45%,rgba(215,181,109,.08));
    opacity:0;
    transition:opacity var(--boyut-asc-speed) ease;
    z-index:-1;
}
.boyut-asc-card::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:3px;
    background:#d7b56d;
    transform:scaleX(0);
    transform-origin:left;
    transition:transform var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1);
}
.boyut-asc-bg{
    position:absolute;
    inset:0;
    z-index:-3;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
    transform:scale(1.01);
    filter:saturate(.85);
    transition:transform var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1),filter var(--boyut-asc-speed) ease;
}
.boyut-asc-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.82)),rgba(0,0,0,var(--boyut-asc-overlay,.45));
}
.boyut-asc-card:hover .boyut-asc-bg{
    transform:scale(1.08);
    filter:saturate(1);
}
.boyut-asc-glow{
    position:absolute;
    width:220px;
    height:220px;
    right:-100px;
    top:-100px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(215,181,109,.18),transparent 68%);
    opacity:0;
    transform:scale(.6);
    transition:opacity var(--boyut-asc-speed) ease,transform var(--boyut-asc-speed) ease;
    pointer-events:none;
    z-index:-1;
}
.boyut-asc-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    position:relative;
    z-index:2;
}
.boyut-asc-number{
    font-size:13px;
    line-height:1;
    letter-spacing:.16em;
    color:#d7b56d;
    font-weight:600;
}
.boyut-asc-arrow{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:50%;
    color:#fff;
    font-size:19px;
    transition:transform var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1),background-color var(--boyut-asc-speed) ease,border-color var(--boyut-asc-speed) ease;
}
.boyut-asc-content{
    position:relative;
    z-index:2;
    transform:translateY(10px);
    transition:transform var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1);
}
.boyut-asc-content h3{
    margin:0;
    color:inherit;
    font-size:clamp(25px,2.15vw,42px);
    line-height:1.04;
    letter-spacing:-.035em;
    font-weight:500;
}
.boyut-asc-description{
    max-width:330px;
    margin:20px 0 0;
    font-size:14px;
    line-height:1.65;
    color:#a6a6a6;
    opacity:0;
    transform:translateY(12px);
    transition:opacity var(--boyut-asc-speed) ease,transform var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1);
}
.boyut-asc-bottom{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:15px;
    transform:translateY(4px);
    transition:transform var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1);
}
.boyut-asc-link{
    white-space:nowrap;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.12em;
    color:#a6a6a6;
    transition:color var(--boyut-asc-speed) ease;
}
.boyut-asc-line{
    height:1px;
    flex:1;
    background:rgba(255,255,255,.18);
    transform-origin:left;
    transition:transform var(--boyut-asc-speed) cubic-bezier(.22,1,.36,1);
}
.boyut-asc-card:hover{
    background:#202020;
    transform:translateY(-8px);
    z-index:3;
}
.boyut-asc-card:hover::before{opacity:1}
.boyut-asc-card:hover::after{transform:scaleX(1)}
.boyut-asc-card:hover .boyut-asc-glow{opacity:1;transform:scale(1.15)}
.boyut-asc-card:hover .boyut-asc-arrow{
    transform:rotate(45deg);
    background:#d7b56d;
    border-color:#d7b56d;
}
.boyut-asc-card:hover .boyut-asc-content,
.boyut-asc-card:hover .boyut-asc-bottom{transform:translateY(0)}
.boyut-asc-card:hover .boyut-asc-description{
    opacity:1;
    transform:translateY(0);
}
.boyut-asc-card:hover .boyut-asc-link{color:#fff}
.boyut-asc-card:hover .boyut-asc-line{transform:scaleX(.75)}
.boyut-asc-card:focus-visible{
    outline:2px solid #d7b56d;
    outline-offset:-2px;
}
@media (max-width:1024px){
    .boyut-asc-card{min-height:330px;padding:28px 24px}
    .boyut-asc-description{opacity:1;transform:none}
}
@media (max-width:767px){
    .boyut-asc-grid{grid-template-columns:1fr}
    .boyut-asc-card{
        min-height:280px;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.13);
    }
    .boyut-asc-card:last-child{border-bottom:0}
    .boyut-asc-card:hover{transform:none}
    .boyut-asc-content h3{font-size:30px}
}
@media (prefers-reduced-motion:reduce){
    .boyut-asc-card,.boyut-asc-card *,.boyut-asc-card::before,.boyut-asc-card::after{transition:none!important}
}
