.hero { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); border:1px solid var(--line); border-radius:16px; overflow:hidden; margin-top:2px; background:white; }
.hero-copy { padding:52px 46px; }
.hero .eyebrow { font-size:9px; color:var(--blue); display:flex; align-items:center; gap:8px; }
.status-dot { width:6px; height:6px; background:var(--blue); border-radius:50%; }
.hero h1 { font-size:clamp(35px,4.3vw,57px); letter-spacing:-.045em; line-height:1.1; margin:26px 0 22px; }
.hero h1>span { color:var(--blue); }
.hero-copy>p { font-size:14px; color:var(--muted); line-height:1.85; max-width:420px; margin-bottom:30px; }
.hero-notes { display:flex; gap:22px; flex-wrap:wrap; font-size:10px; color:var(--muted); margin-top:30px; }
.hero-notes span { display:flex; align-items:center; gap:7px; }
.hero-notes .icon { width:16px; height:16px; color:var(--blue); }
.hero-visual { position:relative; display:flex; flex-direction:column; justify-content:center; padding:28px 30px; background-color:#eaf0fa; background-image:linear-gradient(#dfe7f4 1px,transparent 1px),linear-gradient(90deg,#dfe7f4 1px,transparent 1px); background-size:28px 28px; }
.hero-visual img { width:100%; margin:auto; }
.diagram-label { font-size:8px; letter-spacing:.16em; color:#6f85a6; }
.diagram-footer { display:flex; justify-content:space-between; align-items:flex-end; color:#556e92; font-size:11px; line-height:1.6; }
.diagram-number { font-family:monospace; font-size:10px; }
.category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.category-card { background:white; border:1px solid var(--line); border-radius:var(--radius); padding:26px; position:relative; display:block; color:var(--ink); min-height:178px; transition:border-color .15s,box-shadow .15s,transform .15s; }
.category-card:hover { border-color:#93b2ec; color:var(--ink); box-shadow:var(--shadow); transform:translateY(-2px); }
.category-card-icon { width:40px; height:40px; display:grid; place-items:center; background:#edf3ff; color:var(--blue); border-radius:8px; margin-bottom:20px; }
.category-card-image { display:block; width:120px; height:120px; object-fit:contain; margin:0 auto 20px; }
.category-card h2 { font-size:17px; line-height:1.4; margin-bottom:8px; }
.category-card-caption { font-size:11px; color:var(--muted); }
.category-card>.icon { position:absolute; right:24px; bottom:26px; width:17px; height:17px; color:#98a7bb; }
.how-it-works { border-top:1px solid var(--line); margin-top:64px; padding-top:38px; display:grid; grid-template-columns:1fr 1.8fr; gap:50px; }
.how-it-works h2 { font-size:28px; }
.how-it-works ol { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.how-it-works li>span { display:block; color:var(--blue); font-family:monospace; font-size:12px; margin-bottom:18px; }
.how-it-works h3 { font-size:14px; line-height:1.45; margin-bottom:8px; }
.how-it-works p { color:var(--muted); font-size:12px; }
@media(max-width:1000px) { .hero-copy { padding:36px 30px; }.hero-notes { gap:12px; }.category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.how-it-works { grid-template-columns:1fr; gap:30px; } }
@media(max-width:720px) { .hero { grid-template-columns:1fr; }.hero-copy { padding:30px 24px; }.hero h1 { font-size:39px; }.hero-visual { min-height:260px; padding:18px 22px; }.hero-visual img { max-height:220px; }.category-card { padding:20px; min-height:174px; }.category-card h2 { font-size:15px; overflow-wrap:anywhere; }.category-card>.icon { right:17px; bottom:23px; }.category-card-caption { font-size:10px; }.how-it-works { margin-top:40px; }.how-it-works ol { grid-template-columns:1fr; gap:24px; }.how-it-works li { display:flex; gap:18px; }.how-it-works li>span { margin-top:3px; } }
@media(max-width:380px) { .hero h1 { font-size:34px; }.category-grid { grid-template-columns:1fr; } }

.home-banners { min-width:0; background:#eaf0fa; display:flex; flex-direction:column; }
.home-banner { padding:32px 30px 12px; min-height:460px; display:flex; flex-direction:column; align-items:flex-start; }
.home-banner[hidden],.banner-controls[hidden] { display:none; }
.home-banner h2 { font-size:clamp(24px,2.6vw,34px); line-height:1.15; letter-spacing:-.03em; margin:16px 0 10px; }
.home-banner p { font-size:14px; color:var(--muted); margin:0; }
.home-banner img { width:100%; height:210px; object-fit:contain; margin:14px auto; mix-blend-mode:multiply; }
.home-banner .button { margin-top:auto; }
.banner-business { background:#e8f2ef; }
.banner-connect { background:#f5eee4; }
.banner-controls { display:flex; align-items:center; justify-content:center; gap:12px; padding:12px 20px 20px; margin-top:auto; }
.banner-controls button { min-width:44px; min-height:44px; border:1px solid #b7c7de; border-radius:50%; background:white; color:var(--ink,#122139); cursor:pointer; }
.banner-dots { display:flex; gap:2px; }
.banner-dots button { border:0; background:transparent; position:relative; }
.banner-dots button::after { content:''; position:absolute; width:9px; height:9px; background:#9aa9bd; border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); }
.banner-dots button[aria-current=true]::after { width:22px; border-radius:8px; background:var(--blue); }
.home-banners:focus-visible,.banner-controls button:focus-visible { outline:3px solid var(--blue); outline-offset:-3px; }
@media(max-width:720px) { .home-banner { padding:26px 24px 10px; min-height:410px; }.home-banner img { height:190px; }.home-banner h2 { font-size:28px; } }
@media(max-width:380px) { .home-banner { padding:24px 20px 10px; }.home-banner .button { width:100%; justify-content:center; }.banner-controls { gap:6px; } }