/* BLOCK WRAPPER */
.wp-block-bloom-walk-away-section{
    background:#fff;
    border:1px solid #ddd;
    padding:20px;
}

/* HEADER FIELDS */
.wp-block-bloom-walk-away-section input{
    margin-bottom:10px;
}

/* ITEM BOX */
.wp-block-bloom-walk-away-section .components-base-control{
    margin-bottom:10px;
}

/* ITEM CARD */
.wp-block-bloom-walk-away-section .item-box{
    border:1px solid #e5e5e5;
    padding:15px;
    border-radius:8px;
    margin-bottom:12px;
    background:#fafafa;
}

/* NUMBER + TITLE INLINE */
.wp-block-bloom-walk-away-section .item-row{
    display:flex;
    gap:10px;
}

.wp-block-bloom-walk-away-section .item-row .components-base-control{
    flex:1;
}

/* TEXTAREA */
.wp-block-bloom-walk-away-section textarea{
    min-height:70px;
}

/* REMOVE BUTTON */
.wp-block-bloom-walk-away-section .components-button.is-destructive{
    margin-top:8px;
}

/* IMAGE PREVIEW */
.wp-block-bloom-walk-away-section img{
    margin-top:10px;
    max-width:120px;
    display:block;
}

/* ADD BUTTON */
.wp-block-bloom-walk-away-section .components-button.is-primary{
    margin-top:10px;
}

.bsc-walk-section{
    padding:60px 20px;
    background:#F9FBFF;
}

.bsc-walk-container{
    max-width:1200px;
    margin:auto;
}

.bsc-walk-header{
    text-align:center;
    margin-bottom:40px;
}

.bsc-walk-header h2 {
	font-weight: 600;
	font-size: 40px;
	line-height: 128%;
	letter-spacing: 0%;
	text-align: center;
	font-family: ProximaNova-semibold;
}
.bsc-walk-header p{
    color:#666;
    margin-top:10px;
}

.bsc-walk-content{
    display:flex;
    gap:40px;
}

/* LEFT */
.bsc-walk-left{
    flex:1;
}

.bsc-walk-item{
    display:flex;
    gap: 37px;
    margin-bottom:48px;
}

.bsc-walk-number {
	border: 1px solid #000;
	padding: 10px 14px;
	display: flex;
	align-items: center;
	font-weight: 600;
	font-size: 20px;
	line-height: 128%;
	letter-spacing: 0%;
	font-family: ProximaNova-semibold;
}

.bsc-walk-text h4 {
	font-weight: 600;
	font-size: 20px;
	line-height: 128%;
	letter-spacing: 0%;
	font-family: ProximaNova-semibold;
}
.bsc-walk-text p {
	margin-top: 5px;
	color: #000;
	font-weight: 400;
	font-size: 16px;
	line-height: 128%;
	letter-spacing: 0%;
}

/* RIGHT */
.bsc-walk-right{
    text-align:center;
}

.bsc-walk-item{
    transition: all 0.25s ease;
    border-radius:6px;
    position:relative;
}

.bsc-walk-item:hover{
    background:#f5f9ff;
    transform: translateX(6px);
}

/* number highlight */
.bsc-walk-item:hover .bsc-walk-number{
    border-color:#2d7dd2;
    color:#2d7dd2;
}

/* left accent line */
.bsc-walk-item::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    height:100%;
    width:0;
    background:#2d7dd2;
    transition:0.3s ease;
}

.bsc-walk-item:hover::before{
    width:3px;
}

/* ===================== */
/* TABLET (1024px ↓) */
/* ===================== */
@media(max-width:1024px){

    .bsc-walk-header h2{
        font-size:38px;
    }

    .bsc-walk-content{
        gap:30px;
    }

    .bsc-walk-item{
        gap:20px;
        margin-bottom:30px;
    }

    .bsc-walk-number{
        font-size:18px;
        padding:8px 12px;
    }

    .bsc-walk-text h4{
        font-size:18px;
    }

    .bsc-walk-text p{
        font-size:15px;
    }
}


/* ===================== */
/* MOBILE (768px ↓) */
/* ===================== */
@media(max-width:768px){

    .bsc-walk-section{
        padding:40px 15px;
    }

    .bsc-walk-header h2{
        font-size:30px;
    }

    .bsc-walk-header p{
        font-size:14px;
    }

    .bsc-walk-content{
        flex-direction:column;
        gap:30px;
    }

    .bsc-walk-left{
        order:2;
    }

    .bsc-walk-right{
        order:1;
    }

    .bsc-walk-item{
        flex-direction:row;
        gap:15px;
        margin-bottom:25px;
    }

    .bsc-walk-number{
        font-size:16px;
        padding:6px 10px;
        min-width:40px;
        justify-content:center;
    }

    .bsc-walk-text h4{
        font-size:16px;
    }

    .bsc-walk-text p{
        font-size:14px;
    }
}


/* ===================== */
/* SMALL MOBILE (480px ↓) */
/* ===================== */
@media(max-width:480px){

    .bsc-walk-item{
        gap:10px;
    }
    
    .bsc-walk-header h2{
        font-size:24px;
    }

    .bsc-walk-number{
        font-size:14px;
        padding:5px 8px;
    }

    .bsc-walk-text h4{
        font-size:15px;
    }

    .bsc-walk-text p{
        font-size:13px;
    }
}