/* ============================================================
 * Individuelle Styles für: HS Meta Boxes Content Template
 * Diese Datei wird von "HS Features" verwaltet und liegt außerhalb
 * des Plugin-Ordners, damit Anpassungen bei Updates erhalten bleiben.
 * Sie wird im Frontend geladen, solange das Plugin aktiv ist.
 * ============================================================ */
:root {
	--bs-heading-color: #164056;
}
main#hsmbct-main {
	margin-top: 72px;
}
.hsmbct-prob-icon, .hsmbct-feat-icon {
	background: rgba(31,92,132,1);
    color: white;
}
#mmh-loest-das .hsmbct-textimages {
	    width: var(--hsmbct-sec-w, 100%);
    max-width: min(100%, var(--hsmbct-sec-maxw, var(--hsmbct-container, 1100px)));
    margin-left: auto;
    margin-right: auto;
	background-color: #164056;
	border-radius:25px;
	padding:24px;
}

.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.hsmbct-imgtext-content:has(.feature-list) h2{margin-bottom:12px;}
.feature-list{list-style:none;display:flex;flex-direction:column;gap:24px; padding-left: 0;}
.feature-list li{display:flex;gap:16px;align-items:flex-start}
.feature-list .icon-circle{flex:none;margin:0;width:46px;height:46px}
.feature-list h4{font-size:17px;margin-bottom:3px}
.feature-list p{font-size:15px;color:var(--ink-soft)}
.browser{background:#fff;border-radius:14px;box-shadow:var(--shadow);overflow:hidden;border:1px solid var(--line)}
.browser-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--paper-2);border-bottom:1px solid var(--line)}
.browser-bar .dot{width:11px;height:11px;border-radius:50%;background:#c9c4ba}
.browser-bar .url{flex:1;margin-left:10px;background:#fff;border-radius:6px;padding:5px 12px;
  font-size:13px;color:var(--ink-soft)}
.browser-body{aspect-ratio:16/11;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:12px;color:var(--blue);background:linear-gradient(180deg,#f7fafc,#eef4f8)}
.browser-body .ph-icon{width:70px;height:70px;border-radius:14px;background:var(--blue-tint);
  display:flex;align-items:center;justify-content:center}
.browser-body strong{font-size:17px}
.browser-body span{font-size:14px;color:var(--ink-soft)}

#all-in-one 
.icon-circle .material-symbols-outlined {
	    font-size: 30px;
    background: #164056;
    color: white;
    border-radius: 50%;
    padding: 12px;
}

#video-test-certi .hsmbct-item-title, #video-test-certi .hsmbct-item-text{
	color: #164056;
}