/* Public pages: the home page (design: Home) and the sign-in layout (design: Login). */

.hp { --cta:#2b6ea3; --cta-dk:#225a86; --navy:var(--sidebar-bg); }
.hp a { text-decoration:none; }
.hp-wrap { max-width:1200px; margin:0 auto; padding-inline:32px; box-sizing:border-box; }
.hp-nav .hp-navlink { color:rgba(255,255,255,0.78); font-size:13.5px; font-weight:500; }
.hp-nav .hp-navlink:hover { color:#fff; }
.hp-cta { display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 20px; border-radius:var(--radius-sm); background:var(--cta); color:#fff !important; font-size:14px; font-weight:600; border:1px solid var(--cta-dk); white-space:nowrap; transition:background 120ms ease; }
.hp-cta:hover { background:var(--cta-dk); }
.hp-ghost { display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 18px; border-radius:var(--radius-sm); color:#fff !important; font-size:14px; font-weight:500; border:1px solid rgba(255,255,255,0.22); white-space:nowrap; transition:background 120ms ease; }
.hp-ghost:hover { background:rgba(255,255,255,0.06); }
.hp-eyebrow { font-size:11.5px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--cta); margin:0 0 12px; }
.hp-h2 { font-size:clamp(24px, 3vw, 32px); font-weight:600; letter-spacing:-0.5px; line-height:1.2; margin:0 0 12px; text-wrap:balance; }
.hp-lede { font-size:15px; line-height:1.6; color:var(--text-secondary); margin:0; max-width:620px; text-wrap:pretty; }
.hp-card { background:var(--bg-surface); border:1px solid var(--border-color); border-radius:8px; box-shadow:0 2px 4px rgba(30,38,51,.04); }
.hp-step { position:relative; }
.hp-step + .hp-step::before { content:"→"; position:absolute; inset-inline-start:-15px; top:50%; transform:translateY(-50%); color:var(--text-muted); font-size:14px; }
.hp-plan-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.hp-plan-list li { display:flex; gap:10px; align-items:flex-start; font-size:13.5px; line-height:1.45; color:var(--text); }
.hp-plan-list svg { flex-shrink:0; margin-top:2px; color:var(--green); }
.hp-plan-btn { display:flex; align-items:center; justify-content:center; height:44px; border-radius:var(--radius-sm); font-size:14px; font-weight:600; border:1px solid var(--border-color); color:var(--text) !important; background:var(--bg-surface); transition:background 120ms ease; }
.hp-plan-btn:hover { background:var(--bg-surface-secondary); }
.hp-ph { font-family:var(--font-mono, monospace); font-size:0.62em; font-weight:600; letter-spacing:0; color:#9a5b00; background:var(--yellow-lt); border:1px dashed #c97f00; border-radius:4px; padding:2px 6px; vertical-align:middle; }
.hp-footlink { color:var(--text-secondary); font-size:13px; }
.hp-footlink:hover { color:var(--text); }
@media (max-width: 860px) {
  .hp-navlinks { display:none !important; }
  .hp-step + .hp-step::before { display:none; }
}
@media (max-width: 560px) {
  .hp-wrap { padding-inline:16px; }
  .hp-signin { display:none !important; }
}
body { background: var(--bg-surface); color: var(--text); }
[dir="rtl"] .hp-step + .hp-step::before { transform: translateY(-50%) scaleX(-1); }
[dir="rtl"] .hp-arrow { display: inline-block; transform: scaleX(-1); }
.hp-lang { background: none; border: 0; padding: 0; cursor: pointer; font-family: inherit; }
.hp-msg { margin-bottom: 12px; padding: 10px 12px; border-radius: var(--radius-sm); font-size: 13px; background: rgba(255,255,255,0.1); color: #fff; border: 1px solid rgba(255,255,255,0.22); }
.hp-msg.error { background: rgba(214,57,57,0.18); border-color: rgba(214,57,57,0.5); }
.hp-msg.success { background: rgba(47,179,68,0.16); border-color: rgba(47,179,68,0.45); }
#demo-email::placeholder { color: rgba(255,255,255,0.55); }

/* Sign in, password reset: half marketing panel, half card (design: Login) */
.mk { display: flex; min-height: 100vh; background: var(--body-bg); }
.mk .mk-panel { flex: 0 0 50%; width: 50%; }
.mk .auth-page { flex: 0 0 50%; width: 50%; min-width: 0; box-sizing: border-box; position: relative; overflow: hidden; isolation: isolate; }
.mk a { color: var(--primary); text-decoration: none; }
.mk a:hover { text-decoration: underline; }
.mk .mk-panel a, .mk .mk-panel a:hover { color: #fff; text-decoration: none; }
.mk .auth-card .form-group { margin-bottom: 16px; }
.mk .auth-card .form-label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 6px; }
.mk .auth-card .form-label-row .form-label { margin-bottom: 0; }
.mk .auth-card p.auth-text { font-size: 13px; line-height: 1.55; color: var(--text-secondary); margin: 0 0 18px; }
.mk .auth-submit { width: 100%; justify-content: center; height: 38px; }
.mk .auth-lang { position: absolute; top: 20px; inset-inline-end: 24px; font-size: 12.5px; }
.mk .auth-lang button { background: none; border: 0; padding: 0; color: var(--text-muted); font: inherit; cursor: pointer; }
.mk .auth-lang button:hover { color: var(--text); }
.mk .nonfield { margin-bottom: 16px; }
@media (max-width: 768px) { .mk [data-mkt-panel] { display: none !important; } .mk .auth-page { flex: 1 1 100%; width: 100%; } }
@media (min-width: 769px) { .mk [data-card-brand] { display: none !important; } }
