@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root { --ink:#16253b; --muted:#66748a; --blue:#1552ee; --line:#e0e7ef; --paper:#f6f8fc; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.65 'DM Sans',sans-serif; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
button,a,input,textarea,select { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #7098ff; outline-offset:4px; }
h1,h2,h3 { font-family:Manrope,sans-serif; line-height:1.15; letter-spacing:-.045em; margin:0 0 20px; }
h1 { font-size:clamp(2.7rem,5.2vw,4.9rem); font-weight:800; }
h2 { font-size:clamp(1.7rem,3vw,2.6rem); }
h3 { font-size:1.2rem; letter-spacing:-.02em; }
p { margin:0 0 20px; } small { color:var(--muted); }
.container { width:min(1180px,calc(100% - 64px)); margin:auto; }
.public-header { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:25px 0; }
.public-brand { display:flex; align-items:center; gap:12px; font:800 1.2rem Manrope,sans-serif; letter-spacing:-.03em; }
.public-brand img { width:40px; height:40px; object-fit:contain; }
.public-brand span span { display:block; font:500 .7rem 'DM Sans',sans-serif; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); }
.public-nav { display:flex; align-items:center; gap:28px; font-size:.9rem; font-weight:600; }
.public-nav a:hover,.text-link:hover { color:var(--blue); }
.btn { display:inline-flex; justify-content:center; align-items:center; gap:10px; padding:13px 23px; border-radius:10px; border:1px solid transparent; font-weight:700; font-size:.94rem; cursor:pointer; line-height:1.5; transition:transform .18s,background .18s; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:var(--blue); color:white; box-shadow:0 6px 16px #1552ee18; }
.btn-primary:hover { background:#1041ca; }
.btn-ghost { border-color:var(--line); background:white; color:var(--ink); }
.btn-white { background:white; color:var(--blue); }
.eyebrow { font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.18em; color:var(--blue); margin-bottom:20px; }
.pill { display:inline-flex; gap:8px; align-items:center; padding:7px 13px; border:1px solid #cdddff; background:#edf3ff; color:#174bc0; border-radius:30px; font-size:.78rem; font-weight:700; margin-bottom:25px; }
.pill::before { content:''; height:6px; width:6px; border-radius:50%; background:#1552ee; }
.landing-hero { display:grid; grid-template-columns:1.15fr 1fr; align-items:center; gap:70px; padding:65px 0 85px; }
.landing-hero h1 em,.apply-copy h1 em { color:var(--blue); font-style:normal; }
.lede { color:var(--muted); font-size:1.1rem; max-width:540px; }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin:28px 0 16px; }
.subtle { color:var(--muted); font-size:.84rem; }
.product-preview { padding:25px; background:white; border:1px solid var(--line); border-radius:20px; box-shadow:0 28px 70px #23376612; transform:rotate(-2deg); }
.preview-top { display:flex; justify-content:space-between; align-items:center; padding-bottom:20px; border-bottom:1px solid var(--line); font-weight:700; }
.preview-top span { font-size:.7rem; color:var(--muted); font-weight:500; }
.preview-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:24px 0; }
.preview-tile { padding:20px 15px; background:#f1f5ff; border-radius:12px; }
.preview-tile:nth-child(2) { background:#eaf8f3; }
.preview-tile:nth-child(3) { background:#f2edff; }
.preview-tile:nth-child(4) { background:#fff5e8; }
.preview-tile strong { display:block; font:700 1.1rem Manrope,sans-serif; margin-bottom:6px; }
.preview-tile span { font-size:.78rem; color:var(--muted); }
.preview-row { display:flex; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding:14px 0; font-size:.84rem; }
.preview-check { color:#188063; font-weight:700; }
.capability-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:22px 0; display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; font-size:.84rem; color:var(--muted); }
.public-section { padding:80px 0; }
.section-intro { max-width:680px; margin-bottom:35px; }
.features { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.feature { background:white; padding:28px; border:1px solid var(--line); border-radius:16px; }
.feature p { color:var(--muted); font-size:.93rem; margin:0; }
.feature-number { display:inline-flex; height:38px; width:38px; align-items:center; justify-content:center; background:#edf3ff; color:var(--blue); font-size:.8rem; font-weight:800; border-radius:10px; margin-bottom:22px; }
.cta-panel { background:#132d68; padding:50px; border-radius:22px; color:white; display:flex; justify-content:space-between; align-items:center; gap:30px; }
.cta-panel p { color:#d4e0ff; margin:0; max-width:580px; }
.cta-panel h2 { max-width:640px; }
.public-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:15px; padding:35px 0; color:var(--muted); font-size:.8rem; border-top:1px solid var(--line); margin-top:60px; }
.public-footer div { display:flex; gap:22px; }
.apply-layout { display:grid; grid-template-columns:1fr 1.05fr; gap:75px; padding:45px 0 25px; align-items:start; }
.apply-copy { padding-top:25px; }
.apply-copy h1 { font-size:clamp(2.7rem,4.4vw,4.1rem); }
.benefit-list { margin:32px 0; display:grid; gap:22px; }
.benefit { display:grid; grid-template-columns:28px 1fr; gap:12px; }
.benefit > span { color:#16836a; font-weight:800; }
.benefit strong { display:block; font-size:.98rem; margin-bottom:4px; }
.benefit p { font-size:.9rem; color:var(--muted); margin:0; }
.expectation { padding:24px; background:#eaf0fc; border-radius:14px; margin-top:35px; }
.expectation h3 { font-size:1rem; margin-bottom:14px; }
.expectation ol { padding-left:20px; margin:0; color:var(--muted); font-size:.88rem; }
.expectation li { padding:4px 0; }
.form-card { background:white; border:1px solid var(--line); border-radius:20px; padding:35px; box-shadow:0 15px 50px #20335a08; }
.form-card h2 { font-size:1.7rem; margin-bottom:10px; }
.form-card > p { font-size:.9rem; color:var(--muted); }
.public-form { display:grid; gap:20px; margin-top:25px; }
.form-pair { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.public-form label { display:grid; gap:7px; font-size:.82rem; font-weight:600; }
.public-form input,.public-form textarea,.public-form select { width:100%; min-width:0; padding:12px 13px; border:1px solid #d9e1ec; border-radius:9px; background:#fbfcfe; color:var(--ink); font-size:.94rem; }
.public-form input:focus,.public-form textarea:focus,.public-form select:focus { border-color:var(--blue); background:white; }
.public-form textarea { resize:vertical; }
.public-form .btn { width:100%; }
.form-note { font-size:.76rem; line-height:1.6; color:var(--muted); margin:0; }
.notice { border:1px solid #c7dafb; background:#eff5ff; color:#20416f; padding:16px 20px; border-radius:12px; margin:20px 0; overflow-wrap:anywhere; }
.notice-danger,.notice-warning { background:#fff5ed; border-color:#f1d7bd; color:#854414; }
.notice-success { background:#ebf8f1; border-color:#bae4cd; color:#1c6242; }
.application-honeypot { position:absolute; left:-10000px; }
.success-card { padding:45px 35px; }
.success-icon { display:flex; justify-content:center; align-items:center; width:58px; height:58px; border-radius:50%; background:#eaf8f0; color:#16836a; font-size:1.6rem; margin-bottom:25px; }
.login-layout { display:grid; grid-template-columns:1.15fr 1fr; gap:80px; align-items:center; min-height:calc(100vh - 230px); padding:45px 0; }
.login-story { background:#eaf0ff; border:1px solid #dce6fa; border-radius:24px; padding:50px; position:relative; overflow:hidden; }
.login-story::after { content:''; width:260px; height:260px; border:45px solid #d9e5ff; border-radius:50%; position:absolute; bottom:-180px; right:-70px; pointer-events:none; }
.login-story > * { position:relative; z-index:1; }
.login-story::after { z-index:0; }
.login-story h1 { font-size:clamp(2.4rem,4vw,3.7rem); }
.login-story .lede { font-size:1rem; }
.login-points { display:grid; gap:12px; margin-top:35px; font-size:.9rem; }
.login-points span::before { content:'✓'; color:var(--blue); margin-right:12px; font-weight:800; }
.login-welcome { font-size:.75rem; color:var(--blue); text-transform:uppercase; letter-spacing:.16em; font-weight:700; margin-bottom:18px; }
.password-wrap { position:relative; }
.password-wrap input { padding-right:65px; }
.password-toggle { position:absolute; right:12px; top:50%; transform:translateY(-50%); padding:4px; background:none; border:0; color:var(--blue); font-size:.75rem; font-weight:700; cursor:pointer; }
.auth-choice-label { margin:0 0 10px; font-size:.8rem; font-weight:600; color:var(--muted); }
.auth-methods { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:6px; padding:5px; border:1px solid var(--line); border-radius:14px; background:#f3f6fc; }
.public-form .auth-methods .btn { min-width:0; padding:12px 6px; font-size:.82rem; border-radius:10px; line-height:1.4; white-space:normal; }
.auth-methods .btn-ghost { background:transparent; border-color:transparent; color:var(--muted); }
.auth-methods .btn-primary { box-shadow:0 3px 10px #1749e51a; }
.auth-methods .btn:hover { transform:none; }
.auth-methods .btn:focus-visible { outline:3px solid #93b5ff; outline-offset:2px; }
.public-form .verification-code { font-size:1.1rem; letter-spacing:.08em; }
.form-divider { border-top:1px solid var(--line); margin-top:26px; padding-top:22px; text-align:center; font-size:.85rem; color:var(--muted); }
.text-link { color:var(--blue); font-weight:700; }
.faq { margin-top:45px; max-width:680px; }
.faq details { border-bottom:1px solid var(--line); padding:18px 0; }
.faq summary { font-weight:600; cursor:pointer; }
.faq p { margin:14px 0 0; color:var(--muted); font-size:.92rem; }
@media(max-width:960px) { .landing-hero,.apply-layout,.login-layout { gap:35px; } .public-nav { gap:16px; } .login-story { padding:30px; } .features { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) { .container { width:calc(100% - 32px); } .public-header { gap:12px; padding:20px 0; } .public-nav .desktop-link { display:none; } .public-nav { gap:10px; font-size:.8rem; } .public-nav .btn { padding:9px 13px; } .public-brand { font-size:1rem; } .landing-hero,.apply-layout,.login-layout { grid-template-columns:1fr; padding:35px 0; gap:35px; } .product-preview { transform:none; } .features { grid-template-columns:1fr; } .public-section { padding:50px 0; } .cta-panel { flex-direction:column; align-items:start; padding:30px; } .form-card { padding:25px; } .apply-copy { padding-top:0; } .login-story { padding:30px; } .login-layout { min-height:0; } .public-footer { margin-top:35px; } }
@media(max-width:420px) { .form-pair { grid-template-columns:1fr; } .public-brand img { width:32px; height:32px; } .public-brand span span { font-size:.6rem; } .public-nav .btn-ghost { display:none; } .actions .btn { width:100%; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .btn { transition:none; } .btn:hover { transform:none; } }
@media(max-width:420px) { .login-page .public-nav .btn-ghost,.application-page .public-nav .btn-ghost { display:inline-flex; } }

/* Comfortable phone defaults, expanded progressively on wider screens. */
.container { width:min(1180px,calc(100% - 32px)); }
.landing-hero,.apply-layout,.login-layout,.features,.form-pair { grid-template-columns:minmax(0,1fr); gap:24px; }
.landing-hero,.apply-layout,.login-layout { padding:28px 0; }
.landing-hero > *,.apply-layout > *,.login-layout > * { min-width:0; }
.public-header { gap:10px; flex-wrap:wrap; padding:18px 0; }
.public-nav { flex-wrap:wrap; gap:10px; }
.public-nav .desktop-link { display:none; }
.btn,.public-nav a { min-height:44px; }
.public-form input,.public-form select,.public-form textarea { font-size:16px; }
.public-form input,.public-form select { min-height:48px; }
.form-card,.login-story { padding:22px; }
.public-form label,.form-card,.notice { min-width:0; overflow-wrap:anywhere; }
.login-layout .form-card { order:0; }
.login-layout .login-story { order:1; }
.public-footer { flex-wrap:wrap; gap:16px; }
@media(min-width:640px) { .features,.form-pair { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:1024px) {
  .container { width:min(1180px,calc(100% - 64px)); }
  .public-nav .desktop-link { display:inline-flex; align-items:center; }
  .landing-hero { grid-template-columns:1.15fr 1fr; gap:60px; padding:65px 0 85px; }
  .apply-layout { grid-template-columns:1fr 1.05fr; gap:60px; padding:45px 0 25px; }
  .login-layout { grid-template-columns:1fr 1fr; gap:60px; }
  .login-layout .form-card,.login-layout .login-story { order:initial; }
  .features { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .form-card,.login-story { padding:36px; }
}

.mobile-application-link { display:inline-flex; margin-bottom:24px; }
#application { scroll-margin-top:20px; }
@media(min-width:1024px) { .mobile-application-link { display:none; } }

/* Cooperative member intake uses the same phone-first public form. */
.join-container { max-width:720px; padding-block:32px; }
.join-container h1 { font-size:clamp(1.8rem,5vw,3rem); overflow-wrap:anywhere; }
.join-container label:has(input[type="checkbox"]) { display:flex; align-items:flex-start; gap:10px; }
.join-container input[type="checkbox"] { width:20px; min-width:20px; height:20px; margin-top:4px; }

.member-workspace { display:grid; gap:24px; padding-bottom:40px; }
.member-workspace h1 { font-size:clamp(1.8rem,5vw,3rem); }
.member-workspace h2 { font-size:1.25rem; }
.member-balance-grid { display:grid; gap:16px; min-width:0; }
.member-balance-grid strong { font-size:1.65rem; overflow-wrap:anywhere; }
.member-workspace .table-card { background:white; padding:24px; border:1px solid var(--line); border-radius:14px; overflow-wrap:anywhere; }
.member-table-scroll { overflow-x:auto; }
.member-table-scroll table { border-collapse:collapse; width:100%; }
.member-table-scroll th,.member-table-scroll td { padding:12px; text-align:left; border-bottom:1px solid var(--line); }
@media(min-width:768px) { .member-balance-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }

.member-payment-consent { display:flex!important; align-items:flex-start; gap:12px; }
.member-payment-consent input[type=checkbox] { width:20px; min-width:20px; height:20px; margin:3px 0 0; }

.member-auth-options { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0; }
.member-auth-options a { padding:10px 14px; border:1px solid #dce5f5; border-radius:10px; }

/* Public cooperative membership application. */
.membership-join { max-width:1100px; padding-bottom:48px; }
.membership-layout { display:grid; gap:24px; padding-top:18px; align-items:start; }
.membership-intro { padding:12px 0; min-width:0; }
.membership-intro h1 { font-size:clamp(2rem,4vw,3.2rem); line-height:1.12; letter-spacing:-.045em; overflow-wrap:anywhere; margin:18px 0; }
.membership-intro > p { color:var(--muted); line-height:1.7; }
.membership-next { margin-top:28px; padding:22px; border-radius:18px; background:#eaf0ff; border:1px solid #dce5ff; }
.membership-next h2 { font-size:1rem; margin:0 0 14px; }
.membership-next ol { padding-left:22px; margin:0; display:grid; gap:14px; line-height:1.6; }
.membership-form-card h2 { font-size:1.5rem; margin:8px 0; }
.membership-caption { color:var(--muted); font-size:.88rem; line-height:1.6; font-weight:400; }
.membership-field-pair { display:grid; gap:20px; }
.public-form .membership-consent { display:flex; align-items:flex-start; gap:12px; padding:16px; background:#f5f7fb; border-radius:12px; line-height:1.6; font-size:.84rem; }
.public-form .membership-consent input[type=checkbox] { width:20px; min-width:20px; height:20px; min-height:20px; padding:0; margin:3px 0 0; flex:0 0 20px; accent-color:var(--blue); }
.membership-footnote { margin:0; text-align:center; }
.membership-success { padding:24px 0; text-align:center; }
.membership-success > span { display:inline-grid; place-items:center; width:64px; height:64px; border-radius:50%; background:#e9f8ef; color:#16734a; font-size:2rem; margin-bottom:16px; }
@media(min-width:540px) { .membership-field-pair { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:900px) { .membership-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:56px; padding-top:40px; } .membership-intro { padding-top:24px; } }

.member-bank-generation { margin-top:24px; padding-top:20px; border-top:1px solid #dce4f0; }
.member-bank-generation summary { cursor:pointer; font-weight:700; color:#174cff; padding:8px 0; }
.member-bank-complete { padding:14px; background:#eef8f2; border-radius:10px; color:#196344; }
