:root { --navy:#17233f; --blue:#3459e6; --blue-dark:#243db8; --sky:#edf3ff; --paper:#fff; --ink:#17233f; --muted:#65708a; --line:#dce3f0; --orange:#ff8b42; --mint:#76dbbf; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; color:var(--ink); background:var(--paper); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; }
h1,h2,h3,p { margin-top:0; }
.bevx-site-header { display:flex; align-items:center; justify-content:space-between; gap:28px; max-width:1240px; margin:0 auto; padding:20px 28px; background:#fff; }
.bevx-site-name { display:inline-flex; align-items:center; gap:10px; color:var(--navy); font-size:1.35rem; font-weight:800; letter-spacing:-.05em; text-decoration:none; }
.brand-mark { display:inline-flex; align-items:end; gap:2px; width:27px; height:27px; padding:5px; background:var(--blue); border-radius:7px; transform:rotate(-7deg); }
.brand-mark:after { display:none; }
.brand-mark span { display:block; width:4px; background:#fff; border-radius:5px; }
.brand-mark span:nth-child(1) { height:8px; }.brand-mark span:nth-child(2) { height:13px; }.brand-mark span:nth-child(3) { height:18px; }
.bevx-navigation { flex:0 1 auto; }
.bevx-navigation ul { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:4px; margin:0; padding:5px; list-style:none; background:var(--sky); border:1px solid #dce5f8; border-radius:8px; }
.bevx-navigation a { display:block; padding:8px 11px; border-radius:5px; color:#394764; font-size:.78rem; font-weight:700; letter-spacing:.01em; line-height:1; text-decoration:none; transition:color .2s ease,background .2s ease,box-shadow .2s ease; }
.bevx-navigation a:hover { color:var(--blue); background:#fff; box-shadow:0 2px 7px rgba(30,50,95,.08); }
.bevx-navigation a[aria-current] { color:#fff; background:var(--blue); box-shadow:0 2px 7px rgba(52,89,230,.22); }
.text-link:hover { color:var(--blue); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:14px 22px; border:1px solid var(--blue); border-radius:5px; color:#fff; background:var(--blue); font-size:.82rem; font-weight:700; letter-spacing:.01em; text-decoration:none; transition:background .2s ease,transform .2s ease,box-shadow .2s ease; }
.button:before { display:none; }
.button:hover { background:var(--blue-dark); border-color:var(--blue-dark); box-shadow:0 10px 18px rgba(52,89,230,.2); transform:translateY(-2px); }
.button-small { padding:11px 17px; }.button-primary { background:var(--blue); }
main { overflow:hidden; }
.hero { position:relative; display:flex; align-items:center; min-height:650px; max-width:1240px; margin:0 auto; padding:76px 28px 90px; }
.hero:before { content:""; position:absolute; z-index:-2; top:0; right:-50vw; bottom:0; left:47%; background:var(--sky); border-radius:0 0 0 130px; }
.hero:after { content:""; position:absolute; z-index:-1; top:95px; right:7%; width:380px; height:380px; background:#dbe7ff; border-radius:50%; }
.hero-copy { position:relative; z-index:1; width:51%; }
.eyebrow { margin-bottom:17px; color:var(--blue); font-size:.72rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.status-dot { display:inline-block; width:8px; height:8px; margin:0 7px 1px 0; background:var(--orange); border-radius:50%; }
h1,h2 { color:var(--navy); font-family:Arial,Helvetica,sans-serif; font-weight:800; letter-spacing:-.055em; }
h1 { max-width:620px; margin-bottom:24px; font-size:clamp(3.25rem,5.9vw,5.4rem); line-height:.98; }h1 em { color:var(--blue); font-style:normal; }
.hero-text { max-width:465px; margin-bottom:0; color:var(--muted); font-size:1.04rem; line-height:1.7; }
.hero-actions { display:flex; align-items:center; gap:25px; margin-top:31px; }.text-link { color:var(--navy); font-size:.83rem; font-weight:700; text-decoration:none; }
.hero-notes { display:flex; flex-wrap:wrap; gap:13px 24px; margin-top:44px; color:#59657b; font-size:.74rem; font-weight:600; }.hero-notes span:before { content:"✓"; margin-right:6px; color:var(--blue); font-weight:800; }
.app-window { position:absolute; z-index:1; top:92px; right:-30px; width:594px; height:397px; overflow:hidden; background:#fff; border:1px solid #d5ddeb; border-radius:10px; box-shadow:0 23px 45px rgba(30,50,95,.19); transform:rotate(-2.2deg); }
.window-topbar { display:flex; align-items:center; justify-content:space-between; height:37px; padding:0 13px; color:#72809a; background:#f8faff; border-bottom:1px solid #e2e7f0; font-size:9px; }.window-controls { display:flex; gap:5px; }.window-controls i { width:7px; height:7px; background:#c7d0df; border-radius:50%; }.window-controls i:first-child { background:#ff8b78; }.window-controls i:nth-child(2) { background:#ffd36d; }
.tiny-mark { margin-right:4px; padding:2px 4px; color:#fff; background:var(--blue); border-radius:3px; }.workspace { display:flex; height:calc(100% - 37px); }
.app-sidebar { display:flex; flex-direction:column; align-items:center; gap:17px; width:40px; padding-top:12px; color:#8090a8; background:#f8faff; border-right:1px solid #e2e7f0; font-size:12px; }.sidebar-logo { margin-bottom:5px; color:var(--blue); font-size:15px; font-weight:800; }.side-icon.active { padding:4px 7px; color:#fff; background:var(--blue); border-radius:4px; }.side-bottom { margin-top:auto; margin-bottom:14px; }
.chat-panel { width:262px; padding:15px 12px; background:#fff; }.chat-head { display:flex; align-items:center; justify-content:space-between; padding-bottom:12px; border-bottom:1px solid #e5e9f0; color:var(--navy); font-size:9px; }.chat-head span { color:#34a77d; font-size:7px; }.chat-thread { padding-top:14px; }.bubble { padding:9px; border-radius:6px; font-size:9px; line-height:1.45; }.user-bubble { margin-left:25px; color:#314462; background:#eaf0ff; }.assistant-message { display:flex; gap:7px; margin-top:14px; color:#65718a; font-size:9px; line-height:1.45; }.assistant-message p { margin-bottom:8px; }.assistant-avatar { width:17px; height:17px; flex:0 0 17px; padding-top:2px; color:#fff; background:var(--blue); border-radius:50%; font-size:9px; text-align:center; }.progress-line { width:145px; height:4px; margin-bottom:4px; overflow:hidden; background:#e3e8f2; border-radius:4px; }.progress-line span { display:block; width:76%; height:100%; background:var(--blue); }.assistant-message small { color:#8994a7; font-size:7px; }.prompt-box { display:flex; align-items:center; justify-content:space-between; margin-top:80px; padding:9px; color:#8793a6; background:#f8faff; border:1px solid #dce3ed; border-radius:5px; font-size:8px; }.prompt-box b { padding:1px 5px; color:#fff; background:var(--blue); border-radius:3px; }
.site-preview { flex:1; background:#f6eee7; }.preview-bar { display:flex; justify-content:space-between; padding:13px 14px; color:#58493e; background:#fffaf5; font-family:Arial,sans-serif; font-size:8px; }.preview-content { position:relative; height:100%; padding:35px 22px; color:#443128; background:linear-gradient(135deg,#f9eee4,#ead5c1); }.preview-content > p { color:#ad6f4a; font-size:6px; letter-spacing:.08em; }.preview-content h2 { margin:9px 0 13px; color:#422d23; font-family:Georgia,serif; font-size:26px; line-height:.95; letter-spacing:-.05em; }.preview-content button { padding:7px 10px; color:#fff; background:#9f5638; border:0; border-radius:2px; font-size:7px; }.coffee-card { position:absolute; right:15px; bottom:48px; width:94px; height:103px; padding:13px 10px; color:#fff8ed; background:#6b3928; box-shadow:7px 8px 0 rgba(135,78,47,.15); transform:rotate(4deg); }.coffee-card span { display:block; margin-bottom:15px; font-size:26px; }.coffee-card small { color:#f5d4bd; font-size:6px; }
.proof { display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; align-items:center; max-width:1184px; margin:0 auto; padding:28px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.proof > p { margin:0; color:var(--blue); font-size:.64rem; font-weight:800; letter-spacing:.09em; }.proof div { padding-left:23px; border-left:1px solid var(--line); }.proof strong,.proof span { display:block; }.proof strong { color:var(--navy); font-size:.84rem; }.proof span { margin-top:4px; color:var(--muted); font-size:.68rem; }
.process { max-width:1184px; margin:0 auto; padding:119px 0 112px; }.section-intro { display:flex; align-items:end; justify-content:space-between; }.section-intro h2 { margin:0; font-size:clamp(2.45rem,4vw,3.8rem); line-height:.98; }.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:58px; margin-top:68px; }.steps article { position:relative; padding:24px 23px 25px; border:1px solid var(--line); border-radius:4px; }.steps article:nth-child(1) { transform:rotate(-1.5deg); }.steps article:nth-child(2) { transform:rotate(.8deg); }.steps article:nth-child(3) { transform:rotate(-.6deg); }.steps article:before { content:""; position:absolute; top:0; left:0; width:100%; height:4px; background:var(--blue); }.step-number { color:var(--blue); font-size:.73rem; font-weight:800; }.steps h3 { margin:30px 0 12px; color:var(--navy); font-size:1.05rem; letter-spacing:-.03em; }.steps p { max-width:290px; margin-bottom:0; color:var(--muted); font-size:.87rem; line-height:1.65; }
.feature-band { display:grid; grid-template-columns:.88fr 1.12fr; gap:85px; padding:104px max(28px,calc((100% - 1184px)/2)); color:#fff; background:var(--navy); }.eyebrow-light { color:#aebdff; }.feature-copy h2 { margin-bottom:24px; color:#fff; font-size:clamp(2.6rem,4.1vw,4rem); line-height:.97; }.feature-copy > p:not(.eyebrow) { max-width:410px; color:#bcc6dc; line-height:1.7; }.light-link { display:inline-block; margin-top:14px; color:#fff; border-bottom:1px solid #91a8ff; padding-bottom:4px; }.feature-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.feature-grid article { min-height:203px; padding:25px; background:rgba(255,255,255,.08); border-radius:4px; }.feature-grid article:nth-child(1) { transform:rotate(-1.3deg); }.feature-grid article:nth-child(2) { transform:rotate(.9deg); }.feature-grid article:nth-child(4) { transform:rotate(-.8deg); }.feature-icon { display:block; color:#92aaff; font-size:21px; }.feature-grid h3 { margin:31px 0 9px; color:#fff; font-size:.96rem; letter-spacing:-.02em; }.feature-grid p { margin:0; color:#c0c9da; font-size:.77rem; line-height:1.62; }.feature-grid strong { color:#fff; }
.closing { position:relative; padding:119px 30px 126px; overflow:hidden; text-align:center; background:#f2f6ff; }.closing:before { content:""; position:absolute; top:-145px; left:-80px; width:360px; height:360px; background:#d9e5ff; border-radius:50%; }.closing:after { content:""; position:absolute; right:-100px; bottom:-170px; width:380px; height:380px; background:#dbe7ff; border-radius:50%; }.closing .eyebrow,.closing h2,.closing .button { position:relative; z-index:1; }.closing h2 { margin:0 0 32px; font-size:clamp(3.15rem,6vw,5.4rem); line-height:.94; }
footer { display:flex; align-items:center; justify-content:space-between; max-width:1184px; margin:0 auto; padding:27px 0; color:var(--muted); font-size:.72rem; }footer .bevx-site-name { color:var(--navy); }footer p { margin:0; }.bevx-site-name:focus-visible,.bevx-navigation a:focus-visible,a:focus-visible { outline:2px solid var(--orange); outline-offset:4px; }
@media (max-width:900px) { .bevx-site-header { flex-wrap:wrap; padding:20px 24px; }.bevx-navigation { order:3; flex:1 0 100%; }.bevx-navigation ul { justify-content:flex-start; }.hero { padding:67px 24px 65px; }.hero-copy { width:58%; }.app-window { right:-160px; }.proof,.process { margin-right:24px; margin-left:24px; }.proof { grid-template-columns:1fr 1fr; gap:20px; }.proof > p { grid-column:1 / -1; }.proof div:nth-of-type(1) { padding-left:0; border-left:0; }.process { padding:82px 0; }.feature-band { gap:42px; padding:74px 24px; }footer { margin:0 24px; } }
@media (max-width:620px) { .bevx-site-header { gap:14px 12px; }.bevx-navigation ul { gap:3px; padding:4px; }.bevx-navigation a { padding:8px 9px; font-size:.74rem; }.button-small { padding:10px 12px; font-size:.68rem; }.hero { display:block; min-height:0; padding-top:61px; }.hero:before { left:25%; border-radius:0 0 0 70px; }.hero:after { top:260px; right:-240px; width:330px; height:330px; }.hero-copy { width:100%; }h1 { font-size:clamp(3rem,14vw,4rem); }.app-window { position:relative; top:auto; right:auto; width:123%; height:300px; margin:49px 0 0 8px; transform:rotate(-1.2deg); }.chat-panel { width:48%; padding:11px 8px; }.site-preview { min-width:52%; }.prompt-box { margin-top:45px; }.hero-notes { margin-top:34px; }.proof { grid-template-columns:1fr; padding:25px 0; }.proof div,.proof div:nth-of-type(1) { padding-left:0; border-left:0; }.section-intro { display:block; }.section-intro .eyebrow { margin-bottom:15px; }.steps { grid-template-columns:1fr; gap:22px; margin-top:45px; }.steps h3 { margin-top:21px; }.feature-band { grid-template-columns:1fr; }.feature-grid { margin-top:5px; }.feature-grid article { min-height:180px; padding:19px; }.feature-grid h3 { margin-top:23px; }footer { flex-wrap:wrap; gap:16px; } }