@charset "UTF-8";

.masteroweb-process { background: #fff; }
.masteroweb-process-intro { color: #536f84; line-height: 1.75; margin: 0 auto 3rem !important; max-width: 680px; }
.masteroweb-process-list { margin: 0 auto; max-width: 850px; position: relative; }
.masteroweb-process-list::before { background: linear-gradient(#8bd3f7, #1678c2, #8bd3f7); bottom: 36px; content: ''; left: 31px; position: absolute; top: 36px; width: 2px; }
.masteroweb-process-step { display: grid; gap: 1.5rem; grid-template-columns: 64px minmax(0, 1fr); margin: 0 0 1.25rem; position: relative; }
.masteroweb-process-number { align-items: center; align-self: start; background: linear-gradient(135deg, #1678c2, #54bced); border: 5px solid #eef9fe; border-radius: 50%; box-sizing: border-box; color: #fff; display: flex; font-family: var(--wp--preset--font-family--display); font-size: .78rem; font-weight: 700; height: 64px; justify-content: center; margin: 0; position: relative; width: 64px; z-index: 1; }
.masteroweb-process-content { background: #f8fcfe; border: 1px solid #d7eaf5; border-radius: 16px; padding: 1.45rem 1.6rem; }
.masteroweb-process-content h3 { color: #173a52; font-family: var(--wp--preset--font-family--display); font-size: 1.22rem; font-weight: 500; margin: 0; }
.masteroweb-process-content p { color: #536f84; line-height: 1.7; margin: .65rem 0 0; }
@media (max-width: 540px) {
    .masteroweb-process-list::before { left: 23px; }
    .masteroweb-process-step { gap: 1rem; grid-template-columns: 48px minmax(0, 1fr); }
    .masteroweb-process-number { border-width: 4px; height: 48px; width: 48px; }
    .masteroweb-process-content { padding: 1.2rem; }
}