/* ALF Boss Compliance Landing — isolated styles */ #alfboss-compliance-lp { --ab-blue: #066fac; --ab-blue-dark: #035b90; --ab-blue-ink: #073b5a; --ab-blue-soft: #edf7fc; --ab-cyan: #27a9e1; --ab-ink: #17232c; --ab-text: #43515b; --ab-muted: #6f7b84; --ab-line: #dce6ec; --ab-surface: #ffffff; --ab-surface-2: #f7fafc; --ab-green: #198754; --ab-amber: #b56b00; --ab-red: #c43d4b; --ab-radius-sm: 10px; --ab-radius-md: 16px; --ab-radius-lg: 24px; --ab-shadow: 0 24px 70px rgba(16, 49, 68, .14); --ab-shadow-sm: 0 12px 32px rgba(16, 49, 68, .10); --ab-font: "Hanken Grotesk", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; --ab-display: "Bricolage Grotesque", "Hanken Grotesk", ui-sans-serif, system-ui, sans-serif; color: var(--ab-ink); background: var(--ab-surface); font-family: var(--ab-font); font-size: 16px; line-height: 1.55; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; } .alfboss-lp-body { margin:0 !important; background:#fff; } #alfboss-compliance-lp *, #alfboss-compliance-lp *::before, #alfboss-compliance-lp *::after { box-sizing:border-box; } #alfboss-compliance-lp a { color:inherit; text-decoration:none; } #alfboss-compliance-lp button, #alfboss-compliance-lp input, #alfboss-compliance-lp select { font:inherit; } #alfboss-compliance-lp h1, #alfboss-compliance-lp h2, #alfboss-compliance-lp h3, #alfboss-compliance-lp p { margin-top:0; } .ab-container { width:min(1180px, calc(100% - 40px)); margin-inline:auto; } .ab-skip { position:fixed; left:16px; top:-80px; z-index:99999; background:#fff; color:#000; padding:10px 14px; border-radius:8px; box-shadow:var(--ab-shadow-sm); } .ab-skip:focus { top:14px; } .ab-topbar { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.92); backdrop-filter:blur(16px); border-bottom:1px solid rgba(220,230,236,.8); } .ab-topbar__inner { min-height:76px; display:flex; align-items:center; gap:28px; } .ab-brand { display:inline-flex; align-items:center; flex:0 0 auto; } .ab-brand__logo { width:auto; max-width:162px; max-height:52px; object-fit:contain; display:block; } .ab-brand__text { font-size:22px; font-weight:900; letter-spacing:-.04em; color:var(--ab-blue); } .ab-nav { display:flex; gap:26px; margin-left:auto; font-size:14px; font-weight:700; color:#43515b; } .ab-nav a { padding:10px 0; } .ab-nav a:hover { color:var(--ab-blue); } .ab-topbar .ab-btn { margin-left:6px; } .ab-btn { min-height:52px; display:inline-flex; align-items:center; justify-content:center; gap:10px; border:1px solid transparent; border-radius:12px; padding:0 22px; font-size:15px; font-weight:800; letter-spacing:-.01em; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease; } .ab-btn:hover { transform:translateY(-1px); } .ab-btn:active { transform:translateY(0); } .ab-btn:focus-visible, .ab-nav a:focus-visible, .ab-text-link:focus-visible, .ab-inline-cta:focus-visible, .ab-login-link:focus-visible, .ab-footer a:focus-visible { outline:3px solid rgba(6,111,172,.28); outline-offset:4px; border-radius:8px; } .ab-btn--primary { color:#fff !important; background:linear-gradient(135deg, var(--ab-blue), #0787cc); box-shadow:0 12px 26px rgba(6,111,172,.24); } .ab-btn--primary:hover { background:linear-gradient(135deg, var(--ab-blue-dark), #0678b6); box-shadow:0 16px 34px rgba(6,111,172,.30); } .ab-btn--outline { border-color:var(--ab-line); background:#fff; color:var(--ab-blue); } .ab-btn--outline:hover { border-color:rgba(6,111,172,.4); background:var(--ab-blue-soft); } .ab-btn--small { min-height:44px; padding:0 17px; font-size:14px; } .ab-btn--full { width:100%; } .ab-btn[disabled], .ab-btn.is-loading { opacity:.6; pointer-events:none; } .ab-hero { position:relative; overflow:hidden; background:linear-gradient(180deg,#f7fbfe 0%,#fff 100%); padding:82px 0 72px; border-bottom:1px solid #edf2f5; } .ab-hero__glow { position:absolute; width:640px; height:640px; border-radius:50%; right:-210px; top:-280px; background:radial-gradient(circle,rgba(39,169,225,.20),rgba(39,169,225,0) 68%); pointer-events:none; } .ab-hero__grid { position:relative; display:grid; grid-template-columns:1.02fr .98fr; gap:64px; align-items:center; } .ab-eyebrow { display:inline-flex; align-items:center; gap:10px; color:var(--ab-blue); text-transform:uppercase; letter-spacing:.12em; font-size:12px; font-weight:850; margin-bottom:20px; } .ab-eyebrow span { width:26px; height:2px; border-radius:2px; background:var(--ab-cyan); } .ab-hero h1 { max-width:730px; margin-bottom:22px; font-size:clamp(44px,5.2vw,70px); line-height:.98; letter-spacing:-.052em; font-weight:850; color:var(--ab-ink); } .ab-hero h1 em { font-style:normal; color:var(--ab-blue); } .ab-hero__lede { max-width:680px; margin-bottom:30px; font-size:20px; line-height:1.55; color:var(--ab-text); } .ab-hero__actions { display:flex; align-items:center; gap:24px; flex-wrap:wrap; } .ab-text-link { display:inline-flex; gap:9px; align-items:center; font-weight:750; color:var(--ab-ink); } .ab-text-link:hover { color:var(--ab-blue); } .ab-trust-row { display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:25px; color:#66737b; font-size:13px; font-weight:650; } .ab-trust-row b { color:var(--ab-green); margin-right:5px; } .ab-hero__visual { position:relative; padding:28px 0 26px; } .ab-browser { position:relative; border:1px solid #d8e5ec; border-radius:22px; overflow:hidden; background:#fff; box-shadow:0 34px 80px rgba(8,53,78,.18); transform:perspective(1200px) rotateY(-2deg) rotateX(1deg); } .ab-browser__bar { height:42px; display:flex; align-items:center; gap:6px; padding:0 13px; background:#f7fafc; border-bottom:1px solid #e6edf1; } .ab-browser__bar > span { width:8px; height:8px; background:#cad5dc; border-radius:50%; } .ab-browser__bar small { margin-left:8px; font-size:10px; color:#8c9aa4; } .ab-dashboard { min-height:390px; display:grid; grid-template-columns:56px 1fr; } .ab-dashboard__side { background:#073d5c; padding:16px 13px; display:flex; flex-direction:column; align-items:center; gap:16px; } .ab-mini-logo { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; background:#fff; color:var(--ab-blue); font-weight:900; font-size:11px; margin-bottom:13px; } .ab-dashboard__side i { width:27px; height:27px; border-radius:7px; background:rgba(255,255,255,.1); } .ab-dashboard__side i.is-active { background:#0d89ca; } .ab-dashboard__main { padding:24px; background:#fbfdfe; } .ab-dashboard__title { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; } .ab-dashboard__title div { display:grid; } .ab-dashboard__title small { color:#8a98a1; font-size:10px; } .ab-dashboard__title strong { font-size:18px; letter-spacing:-.02em; } .ab-status-pill { display:inline-flex; align-items:center; border-radius:999px; padding:6px 9px; background:#e8f6ef; color:#257150; font-size:9px; font-weight:800; white-space:nowrap; } .ab-status-pill--green { background:#e7f5ed; color:#27724f; } .ab-status-pill--amber { background:#fff1dc; color:#95610c; } .ab-status-pill--red { background:#fde9ec; color:#a83c49; } .ab-metric-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; } .ab-metric-grid article { padding:14px; border:1px solid #e7eef2; background:#fff; border-radius:11px; box-shadow:0 4px 12px rgba(26,66,90,.04); } .ab-metric-grid small, .ab-metric-grid span { display:block; font-size:9px; color:#85939d; } .ab-metric-grid strong { display:block; font-size:22px; margin:5px 0 1px; } .ab-task-panel { margin-top:14px; padding:14px; background:#fff; border:1px solid #e7eef2; border-radius:11px; } .ab-task-panel__head { display:flex; justify-content:space-between; font-size:10px; padding-bottom:9px; border-bottom:1px solid #edf2f4; } .ab-task-panel__head span { color:var(--ab-blue); } .ab-task { display:grid; grid-template-columns:9px 1fr auto; gap:10px; align-items:center; padding:11px 0; border-bottom:1px solid #f0f3f5; } .ab-task:last-child { border:0; } .ab-task div { display:grid; } .ab-task strong { font-size:10px; } .ab-task small { color:#8a98a1; font-size:8px; } .ab-task > span { font-size:8px; font-weight:700; color:var(--ab-blue); } .ab-dot { width:7px; height:7px; border-radius:50%; } .ab-dot--warn{background:#e4a42b}.ab-dot--danger{background:#d6515f}.ab-dot--ok{background:#2ca26c} .ab-float-card { position:absolute; display:flex; align-items:center; gap:9px; padding:10px 13px; border:1px solid #dce7ed; background:rgba(255,255,255,.97); border-radius:12px; box-shadow:var(--ab-shadow-sm); } .ab-float-card > span { width:30px; height:30px; display:grid; place-items:center; border-radius:9px; background:var(--ab-blue-soft); color:var(--ab-blue); font-weight:900; } .ab-float-card div { display:grid; } .ab-float-card strong { font-size:10px; }.ab-float-card small { color:#7a8992; font-size:8px; } .ab-float-card--top { right:-12px; top:3px; }.ab-float-card--bottom { left:-25px; bottom:5px; } .ab-proof-strip { border-bottom:1px solid #edf2f5; background:#fff; } .ab-proof-strip__grid { min-height:70px; display:flex; align-items:center; justify-content:space-between; gap:12px; overflow:hidden; } .ab-proof-strip span { color:#71808a; font-size:10px; font-weight:850; letter-spacing:.08em; white-space:nowrap; } .ab-proof-strip i { width:4px; height:4px; border-radius:50%; background:#b9c7ce; } .ab-section { padding:100px 0; } .ab-section-head { max-width:760px; margin-bottom:48px; }.ab-section-head--center { text-align:center; margin-inline:auto; } .ab-section-head--center .ab-eyebrow { justify-content:center; } .ab-section-head h2, .ab-feature__content h2, .ab-benefit-band h2, .ab-final h2 { font-size:clamp(34px,4vw,52px); line-height:1.07; letter-spacing:-.045em; margin-bottom:18px; } .ab-section-head p, .ab-feature__content > p { color:var(--ab-text); font-size:18px; } .ab-problem { background:#fff; } .ab-problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; } .ab-problem-card { padding:30px; border:1px solid var(--ab-line); border-radius:var(--ab-radius-md); background:#fff; box-shadow:0 9px 30px rgba(14,53,74,.05); } .ab-icon { width:44px; height:44px; display:grid; place-items:center; margin-bottom:24px; border-radius:12px; background:var(--ab-blue-soft); color:var(--ab-blue); font-size:12px; font-weight:900; } .ab-problem-card h3 { margin-bottom:10px; font-size:20px; letter-spacing:-.025em; }.ab-problem-card p { margin:0; color:var(--ab-text); } .ab-feature { background:var(--ab-surface-2); } .ab-feature--reverse { background:#fff; } .ab-feature__grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; } .ab-feature--reverse .ab-feature__content { order:1; }.ab-feature--reverse .ab-feature__visual { order:2; } .ab-kicker { margin-bottom:17px; color:var(--ab-blue); font-size:12px; letter-spacing:.12em; font-weight:900; } .ab-check-list { list-style:none; margin:28px 0; padding:0; display:grid; gap:18px; } .ab-check-list li { display:grid; grid-template-columns:28px 1fr; gap:12px; } .ab-check-list li > span { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; background:#e8f6ef; color:var(--ab-green); font-size:12px; font-weight:900; } .ab-check-list li div { display:grid; }.ab-check-list strong { font-size:15px; }.ab-check-list small { color:var(--ab-muted); font-size:14px; } .ab-inline-cta { display:inline-flex; gap:10px; color:var(--ab-blue) !important; font-weight:850; border-bottom:1px solid rgba(6,111,172,.22); padding-bottom:3px; } .ab-inline-cta:hover { border-color:var(--ab-blue); } .ab-feature__visual { position:relative; } .ab-card-stack { padding:42px 34px; min-height:440px; border-radius:28px; background:linear-gradient(135deg,#dff2fb,#f9fcfe); border:1px solid #d6e9f2; } .ab-ui-card { background:#fff; border:1px solid #dfe9ee; border-radius:15px; box-shadow:var(--ab-shadow-sm); } .ab-ui-card--staff { padding:22px; transform:rotate(-1deg); } .ab-ui-card__top { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:11px; } .ab-ui-card__top div { display:grid; }.ab-ui-card__top small { color:#87949c; font-size:10px; }.ab-ui-card__top strong { font-size:13px; } .ab-avatar { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; background:#e9f5fb; color:var(--ab-blue); font-size:11px; font-weight:900; } .ab-progress { height:7px; margin:20px 0 16px; border-radius:99px; background:#edf2f4; overflow:hidden; }.ab-progress span { display:block; height:100%; background:var(--ab-blue); border-radius:99px; } .ab-ui-row { display:flex; justify-content:space-between; gap:12px; padding:12px 0; border-top:1px solid #edf2f4; font-size:11px; }.ab-ui-row b { color:#2f7958; }.ab-ui-row.is-due b { color:var(--ab-amber); } .ab-ui-card--note { width:72%; margin:-10px 0 0 auto; padding:13px 15px; display:flex; align-items:center; gap:10px; transform:rotate(1deg); } .ab-bell { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; background:#fff0dc; color:#aa6d10; }.ab-ui-card--note div { display:grid; }.ab-ui-card--note small { font-size:9px; color:#86949d; }.ab-ui-card--note strong { font-size:11px; } .ab-resident-panel { padding:22px; border-radius:22px; background:#fff; border:1px solid #dbe7ed; box-shadow:var(--ab-shadow); } .ab-resident-panel__head { display:flex; align-items:center; justify-content:space-between; gap:12px; }.ab-resident-panel__head div { display:grid; }.ab-resident-panel__head small { color:#87949c; font-size:10px; }.ab-resident-panel__head strong { font-size:20px; }.ab-resident-panel__head button { border:0; border-radius:9px; padding:8px 10px; background:var(--ab-blue); color:#fff; font-size:9px; } .ab-resident-filter { display:flex; gap:8px; margin:20px 0 13px; padding-bottom:12px; border-bottom:1px solid #edf2f4; }.ab-resident-filter span { padding:6px 9px; border-radius:8px; background:#f5f8fa; color:#76848e; font-size:9px; }.ab-resident-filter span.is-active { background:var(--ab-blue-soft); color:var(--ab-blue); font-weight:800; } .ab-resident-row { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:11px; padding:13px 0; border-bottom:1px solid #edf2f4; }.ab-resident-row:last-child{border:0}.ab-resident-row div:nth-child(2){display:grid}.ab-resident-row strong{font-size:12px}.ab-resident-row small{font-size:9px;color:#89969e}.ab-avatar--blue{background:#e5f3fb}.ab-avatar--purple{background:#f0eaff;color:#6a52a7}.ab-avatar--pink{background:#fdebf1;color:#a84d6d} .ab-workflow { background:#082f46; color:#fff; } .ab-workflow .ab-eyebrow { color:#85cef1; }.ab-workflow .ab-section-head h2 { color:#fff; } .ab-steps { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; gap:18px; align-items:start; } .ab-steps article > span { width:37px; height:37px; display:grid; place-items:center; margin-bottom:20px; border-radius:11px; background:#0a7fbd; color:#fff; font-weight:900; } .ab-steps h3 { font-size:17px; line-height:1.25; margin-bottom:8px; }.ab-steps p { margin:0; color:#b8cad4; font-size:14px; } .ab-step-line { width:45px; height:1px; margin-top:19px; background:rgba(255,255,255,.2); } .ab-benefit-band { background:#eff8fc; } .ab-benefit-band__grid { display:grid; grid-template-columns:1.1fr .9fr; gap:70px; align-items:center; }.ab-benefit-band small { color:var(--ab-blue); font-weight:900; letter-spacing:.12em; }.ab-benefit-band h2 { margin:12px 0 0; font-size:clamp(32px,3.6vw,48px); } .ab-benefit-list { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.ab-benefit-list span { display:flex; align-items:center; min-height:48px; padding:0 14px; border:1px solid #d6e7ef; border-radius:10px; background:#fff; font-size:13px; font-weight:750; }.ab-benefit-list span::first-letter { color:var(--ab-green); } .ab-final { background:linear-gradient(135deg,#063653,#075f8d); color:#fff; } .ab-final__grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:80px; align-items:center; }.ab-eyebrow--light { color:#9bd9f4; }.ab-final h2 { color:#fff; }.ab-final__copy > p { color:#c5d7e0; font-size:18px; } .ab-final__points { display:flex; gap:10px 20px; flex-wrap:wrap; margin:24px 0; color:#e5f2f7; font-size:13px; font-weight:700; }.ab-final__points span::first-letter{color:#84d5ac}.ab-login-link { color:#fff !important; border-bottom:1px solid rgba(255,255,255,.35); font-weight:750; } .ab-form-card { padding:34px; border-radius:22px; background:#fff; color:var(--ab-ink); box-shadow:0 30px 80px rgba(0,0,0,.24); }.ab-form-card__head small { color:var(--ab-blue); font-weight:900; letter-spacing:.12em; }.ab-form-card__head h3 { margin:7px 0 5px; font-size:28px; letter-spacing:-.035em; }.ab-form-card__head p { color:var(--ab-muted); margin-bottom:24px; } .ab-trial-form { display:grid; gap:14px; }.ab-field-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.ab-trial-form label { display:grid; gap:6px; color:#3d4b54; font-size:12px; font-weight:800; } .ab-trial-form input, .ab-trial-form select { width:100%; min-height:48px; border:1px solid #ccd9df; border-radius:10px; background:#fff; color:var(--ab-ink); padding:0 13px; outline:0; transition:border-color .2s, box-shadow .2s, background .2s; } .ab-trial-form input::placeholder { color:#98a5ad; }.ab-trial-form input:hover, .ab-trial-form select:hover { border-color:#a9bdc7; }.ab-trial-form input:focus-visible, .ab-trial-form select:focus-visible { border-color:var(--ab-blue); box-shadow:0 0 0 3px rgba(6,111,172,.14); }.ab-trial-form input:invalid:not(:placeholder-shown) { border-color:#d4747f; background:#fffafb; } .ab-consent { grid-template-columns:auto 1fr !important; align-items:start; gap:9px !important; font-weight:600 !important; color:#64727b !important; }.ab-consent input { width:17px; min-height:17px; height:17px; margin-top:2px; accent-color:var(--ab-blue); }.ab-form-note { margin:0; text-align:center; color:#8a979f; font-size:10px; } .ab-alert { margin-bottom:16px; border-radius:10px; padding:12px 14px; font-size:13px; font-weight:700; }.ab-alert--success { background:#e9f7ef; color:#256b4d; }.ab-alert--error { background:#fdecef; color:#a33c48; } .ab-footer { background:#062b40; color:#a9bcc6; border-top:1px solid rgba(255,255,255,.07); } .ab-footer__grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:44px; padding:66px 0 52px; } .ab-footer .ab-brand__text { color:#fff; } .ab-footer .ab-brand__logo { filter:none; max-height:40px; } .ab-footer__tagline { margin:20px 0 24px; max-width:340px; font-size:14px; line-height:1.65; color:#93a7b2; } .ab-footer__social { display:flex; gap:12px; } .ab-footer__social a { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.09); color:#c6d5dd; transition:background .18s ease, color .18s ease, transform .18s ease, border-color .18s ease; } .ab-footer__social a:hover { background:#18a987; border-color:#18a987; color:#fff; transform:translateY(-2px); } .ab-footer__col { display:flex; flex-direction:column; } .ab-footer__col h4 { margin:0 0 18px; font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:#e7eef2; } .ab-footer__col a { font-size:14px; line-height:1.4; color:#a9bcc6; padding:7px 0; transition:color .16s ease, padding-left .16s ease; } .ab-footer__col a:hover { color:#fff; padding-left:4px; } .ab-footer__contact a, .ab-footer__contact p { display:flex; gap:10px; align-items:flex-start; font-size:14px; line-height:1.55; color:#a9bcc6; } .ab-footer__contact p { margin:9px 0 0; } .ab-footer__contact span { color:#44bea1; font-size:15px; line-height:1.4; flex:0 0 auto; } .ab-footer__bar { border-top:1px solid rgba(255,255,255,.08); } .ab-footer__bar-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 0; } .ab-footer__bar p { margin:0; font-size:12.5px; color:#8199a5; } .ab-footer__bar-links { display:flex; gap:22px; font-size:12.5px; } .ab-footer__bar-links a { color:#93a7b2; } .ab-footer a:hover, .ab-footer__bar-links a:hover { color:#fff; } .ab-real-shot { position:relative; } .ab-real-shot__frame { position:relative; overflow:hidden; border:1px solid #d7e4eb; border-radius:24px; background:#fff; box-shadow:0 30px 75px rgba(8,53,78,.18); } .ab-real-shot__frame img { width:100%; height:auto; display:block; } .ab-real-shot__caption { display:flex; align-items:center; gap:10px; margin-top:14px; color:#64727b; font-size:12px; font-weight:700; } .ab-real-shot__caption span { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:var(--ab-green); box-shadow:0 0 0 5px rgba(25,135,84,.10); } .ab-real-shot--hero .ab-real-shot__frame { border-radius:26px; transform:perspective(1200px) rotateY(-2deg) rotateX(1deg); } .ab-real-shot--hero img { aspect-ratio:1000/469; object-fit:cover; } .ab-product-shot { position:relative; min-height:430px; display:grid; place-items:center; padding:36px; border-radius:28px; background:linear-gradient(135deg,#eaf7fc,#f9fcfe); border:1px solid #d6e9f2; overflow:hidden; } .ab-product-shot::before { content:""; position:absolute; width:360px; height:360px; border-radius:50%; background:rgba(39,169,225,.10); top:-130px; right:-100px; } .ab-product-shot img { position:relative; z-index:1; max-width:100%; max-height:390px; width:auto; height:auto; object-fit:contain; filter:drop-shadow(0 22px 28px rgba(8,53,78,.14)); } .ab-product-shot--wide img { width:100%; max-height:none; } .ab-source-note { position:absolute; left:22px; bottom:18px; z-index:2; padding:7px 10px; border-radius:999px; background:rgba(255,255,255,.92); border:1px solid rgba(215,228,235,.9); color:#60717b; font-size:10px; font-weight:800; box-shadow:0 8px 20px rgba(8,53,78,.08); } @media (max-width: 980px) { .ab-nav { display:none; } .ab-hero { padding-top:58px; } .ab-hero__grid, .ab-feature__grid, .ab-final__grid, .ab-benefit-band__grid { grid-template-columns:1fr; gap:50px; } .ab-hero__content { max-width:760px; } .ab-feature--reverse .ab-feature__content, .ab-feature--reverse .ab-feature__visual { order:initial; } .ab-steps { grid-template-columns:1fr 1fr; gap:30px; }.ab-step-line { display:none; } .ab-proof-strip__grid { justify-content:flex-start; overflow-x:auto; } .ab-footer__grid { grid-template-columns:1fr 1fr; gap:36px 30px; padding:52px 0 40px; } .ab-footer__brand { grid-column:1 / -1; } } @media (max-width: 640px) { .ab-container { width:min(100% - 28px, 1180px); } .ab-topbar__inner { min-height:66px; gap:12px; }.ab-topbar .ab-btn { margin-left:auto; }.ab-brand__logo { max-width:128px; max-height:42px; }.ab-btn--small { min-height:40px; padding:0 12px; } .ab-hero { padding:48px 0 52px; }.ab-hero h1 { font-size:44px; }.ab-hero__lede { font-size:17px; }.ab-hero__actions { align-items:stretch; flex-direction:column; }.ab-hero__actions .ab-btn { width:100%; }.ab-text-link { justify-content:center; } .ab-float-card { display:none; }.ab-browser { transform:none; }.ab-dashboard { min-height:330px; grid-template-columns:44px 1fr; }.ab-dashboard__main { padding:14px; }.ab-metric-grid { grid-template-columns:1fr; }.ab-metric-grid article:nth-child(n+2) { display:none; } .ab-section { padding:72px 0; }.ab-problem-grid { grid-template-columns:1fr; }.ab-feature__grid { gap:36px; }.ab-card-stack { min-height:auto; padding:25px 18px; }.ab-ui-card--note { width:90%; }.ab-benefit-list { grid-template-columns:1fr; }.ab-steps { grid-template-columns:1fr; } .ab-field-row { grid-template-columns:1fr; }.ab-form-card { padding:24px 18px; }.ab-final__grid { gap:38px; } .ab-footer__grid { grid-template-columns:1fr; gap:32px; }.ab-footer__col a { padding:6px 0; } .ab-footer__bar-inner { flex-direction:column; align-items:flex-start; gap:12px; } } @media (prefers-reduced-motion: reduce) { #alfboss-compliance-lp *, #alfboss-compliance-lp *::before, #alfboss-compliance-lp *::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; } } /* ========================================================== ALF BOSS BRAND THEME OVERRIDES Current brand direction: white / soft gray + teal-green + charcoal. Blue is intentionally removed as a dominant brand color. ========================================================== */ #alfboss-compliance-lp { --ab-blue: #18a987; --ab-blue-dark: #0d8d70; --ab-blue-ink: #252525; --ab-blue-soft: #edf9f5; --ab-cyan: #44bea1; --ab-ink: #252525; --ab-text: #545454; --ab-muted: #777777; --ab-line: #e5e5e5; --ab-surface: #ffffff; --ab-surface-2: #f7f7f5; --ab-green: #18a987; --ab-shadow: 0 24px 70px rgba(26, 36, 32, .12); --ab-shadow-sm: 0 12px 32px rgba(26, 36, 32, .08); } .alfboss-lp-body { background:#fff; } #alfboss-compliance-lp .ab-brand__logo[src=""] { display:none; } #alfboss-compliance-lp .ab-brand__text { color:#2d2d2d; letter-spacing:-.05em; } #alfboss-compliance-lp .ab-brand__text b { color:#18a987; font-weight:900; } .ab-topbar { background:rgba(255,255,255,.96); border-color:#ececea; } .ab-nav { color:#404040; } .ab-nav a:hover { color:#18a987; } .ab-btn--primary { background:#18a987; box-shadow:0 12px 26px rgba(24,169,135,.20); } .ab-btn--primary:hover { background:#0d8d70; box-shadow:0 16px 34px rgba(24,169,135,.24); } .ab-btn--outline { background:#fff; border-color:#dcdcd8; color:#2f2f2f; } .ab-btn--outline:hover { border-color:#18a987; background:#edf9f5; color:#0d8d70; } .ab-btn:focus-visible, .ab-nav a:focus-visible, .ab-text-link:focus-visible, .ab-inline-cta:focus-visible, .ab-login-link:focus-visible, .ab-footer a:focus-visible { outline-color:rgba(24,169,135,.30); } .ab-hero { background:linear-gradient(180deg,#fafaf8 0%,#ffffff 100%); border-color:#eeeeeb; } .ab-hero__glow { background:radial-gradient(circle,rgba(24,169,135,.13),rgba(24,169,135,0) 70%); } .ab-eyebrow { color:#0d8d70; } .ab-eyebrow span { background:#18a987; } .ab-hero h1 em { color:#18a987; } .ab-text-link:hover { color:#18a987; } .ab-real-shot__frame, .ab-browser { border-color:#e4e4e0; box-shadow:0 30px 70px rgba(29,39,35,.13); } .ab-real-shot__caption span { background:#18a987; box-shadow:0 0 0 5px rgba(24,169,135,.10); } .ab-proof-strip { border-color:#eeeeeb; } .ab-proof-strip span { color:#6b6b68; } .ab-proof-strip i { background:#c9c9c4; } .ab-problem { background:#fff; } .ab-problem-card { border-color:#e7e7e3; box-shadow:0 9px 28px rgba(40,48,44,.045); } .ab-icon { background:#edf9f5; color:#0d8d70; } .ab-feature { background:#f7f7f5; } .ab-feature--reverse { background:#fff; } .ab-check-list li > span { background:#eaf7f2; color:#11866c; } .ab-product-shot, .ab-card-stack { background:linear-gradient(145deg,#eef8f4 0%,#fafaf8 100%); border-color:#dfece7; } .ab-product-shot::before { background:rgba(24,169,135,.08); } .ab-source-note { border-color:#e1e5e2; color:#656965; } .ab-avatar, .ab-avatar--blue { background:#e8f7f2; color:#0d8d70; } .ab-progress span { background:#18a987; } .ab-resident-panel__head button { background:#18a987; } .ab-resident-filter span.is-active { background:#edf9f5; color:#0d8d70; } /* Dark sections use ALF Boss charcoal, not blue */ .ab-workflow { background:#292c2b; } .ab-workflow .ab-eyebrow, .ab-eyebrow--light { color:#80d7c0; } .ab-workflow .ab-section-head p, .ab-workflow .ab-steps p { color:#c8cecb; } .ab-steps article > span { background:#18a987; } .ab-step-line { background:rgba(255,255,255,.18); } .ab-benefit-band { background:#f0f7f4; } .ab-benefit-band small { color:#0d8d70; } .ab-benefit-list span { border-color:#dce7e2; } .ab-final { background:linear-gradient(135deg,#242725,#343a37); } .ab-final__copy > p { color:#d0d5d2; } .ab-final__points { color:#eef3f0; } .ab-form-card { box-shadow:0 30px 80px rgba(0,0,0,.20); } .ab-form-card__head small { color:#0d8d70; } .ab-trial-form input:focus-visible, .ab-trial-form select:focus-visible { border-color:#18a987; box-shadow:0 0 0 3px rgba(24,169,135,.14); } .ab-consent input { accent-color:#18a987; } .ab-footer { background:#1c1f1e; color:#b3b8b5; } .ab-footer__tagline { color:#9aa19d; } .ab-footer__col a, .ab-footer__contact a, .ab-footer__contact p { color:#b3b8b5; } .ab-footer__bar p, .ab-footer__bar-links a { color:#8a908c; } .ab-footer .ab-brand__text { color:#e7e9e7; } .ab-footer .ab-brand__text b { color:#46c3a3; } /* Prototype marker also follows the brand */ .ab-prototype-badge { background:#252525 !important; color:#fff !important; border:1px solid rgba(255,255,255,.12); } /* WordPress form integration */ #alfboss-compliance-lp .ab-hp{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important;} #alfboss-compliance-lp .ab-alert{padding:14px 16px;margin:0 0 18px;border-radius:12px;font-weight:600;} #alfboss-compliance-lp .ab-alert--success{background:#e9f7ef;color:#176b3a;border:1px solid #bfe6cf;} #alfboss-compliance-lp .ab-alert--error{background:#fff1f2;color:#9f2735;border:1px solid #f3c5ca;} #alfboss-compliance-lp .ab-btn:disabled{opacity:.65;cursor:not-allowed;transform:none;} /* ===== Production header ===== The ALF Boss logo is a white wordmark on a transparent background, so the header uses a dark charcoal bar (matching the footer) where it reads clearly and the brand feels cohesive top-to-bottom. */ #alfboss-compliance-lp .ab-topbar { background: rgba(28,31,30,.92); -webkit-backdrop-filter: saturate(150%) blur(16px); backdrop-filter: saturate(150%) blur(16px); border-bottom: 1px solid rgba(255,255,255,.06); box-shadow: 0 6px 24px rgba(0,0,0,.14); } #alfboss-compliance-lp .ab-topbar__inner { min-height:74px; gap:32px; } #alfboss-compliance-lp .ab-topbar .ab-brand__logo { width: auto; max-width: 170px; max-height: 44px; object-fit: contain; } #alfboss-compliance-lp .ab-topbar .ab-brand { transition: transform .18s ease, opacity .18s ease; } #alfboss-compliance-lp .ab-topbar .ab-brand:hover { transform: translateY(-1px); opacity: .92; } #alfboss-compliance-lp .ab-topbar .ab-brand__text { color: #ffffff; } #alfboss-compliance-lp .ab-topbar .ab-brand__text b { color: #46c3a3; } #alfboss-compliance-lp .ab-topbar .ab-nav { gap: 30px; font-size: 14.5px; font-weight: 600; color: #d7dcda; } #alfboss-compliance-lp .ab-topbar .ab-nav a { position: relative; color: #d7dcda; padding: 8px 2px; transition: color .16s ease; } #alfboss-compliance-lp .ab-topbar .ab-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; border-radius: 2px; background: #18a987; transform: scaleX(0); transform-origin: left; transition: transform .2s ease; } #alfboss-compliance-lp .ab-topbar .ab-nav a:hover { color: #ffffff; } #alfboss-compliance-lp .ab-topbar .ab-nav a:hover::after { transform: scaleX(1); } #alfboss-compliance-lp .ab-topbar .ab-nav a:focus-visible, #alfboss-compliance-lp .ab-topbar .ab-btn:focus-visible, #alfboss-compliance-lp .ab-topbar .ab-brand:focus-visible { outline: 3px solid rgba(70,195,163,.45); outline-offset: 4px; } #alfboss-compliance-lp .ab-topbar .ab-btn--outline { background: #18a987; border-color: #18a987; color: #fff; box-shadow: 0 10px 22px rgba(24,169,135,.28); } #alfboss-compliance-lp .ab-topbar .ab-btn--outline:hover { background: #23c39c; border-color: #23c39c; color: #06231b; box-shadow: 0 14px 30px rgba(24,169,135,.36); } /* ===== Type system (matches approved design) ===== Bricolage Grotesque for display headings, Hanken Grotesk for body. */ #alfboss-compliance-lp h1, #alfboss-compliance-lp h2, #alfboss-compliance-lp h3, #alfboss-compliance-lp .ab-brand__text { font-family: var(--ab-display); letter-spacing: -.03em; font-weight: 700; } #alfboss-compliance-lp .ab-hero h1 { font-weight: 700; letter-spacing: -.035em; } #alfboss-compliance-lp .ab-steps article > span, #alfboss-compliance-lp .ab-icon { font-family: var(--ab-display); } /* Softer, more refined card + control radii */ #alfboss-compliance-lp { --ab-radius-md: 20px; } #alfboss-compliance-lp .ab-problem-card, #alfboss-compliance-lp .ab-form-card, #alfboss-compliance-lp .ab-real-shot__frame, #alfboss-compliance-lp .ab-product-shot { border-radius: 20px; } #alfboss-compliance-lp .ab-btn { border-radius: 12px; } #alfboss-compliance-lp .ab-btn--small { border-radius: 10px; } /* ===== Theme/plugin overrides fixes ===== */ /* Header CTA must never wrap ("Start Free Trial" was breaking to 2 lines) */ #alfboss-compliance-lp .ab-btn { white-space: nowrap; } /* The