.ba-archive { overflow:hidden; background:#fff }
.ba-hero { position:relative; height:459px; overflow:hidden; background:#0f5db3; color:#fff }
.ba-pattern { position:absolute; inset:0; opacity:.08; background:url('../figma-home/hero-rectangle9798.png') center top/1552px 887px no-repeat; pointer-events:none }
.ba-hero::after { content:""; position:absolute; inset:auto 0 0; height:179px; background:linear-gradient(transparent,#0f5db3); pointer-events:none }
.ba-hero-copy { position:relative; z-index:2; top:189px; max-width:927px; text-align:center }
.ba-hero-copy p { margin:0 0 15px; font-size:16px; font-weight:600; line-height:24px }
.ba-hero-copy h1 { max-width:none; margin:0 0 23px; color:#fff; font-size:54px; font-weight:600; letter-spacing:-.02em; line-height:65px }
.ba-hero-copy>div { font-size:18px; line-height:26px }
.ba-flower { position:absolute; z-index:1; width:235px; height:232px; background:#3379c7; mask:url('../figma-home/hero-rectangle9805.png') center/contain no-repeat; -webkit-mask:url('../figma-home/hero-rectangle9805.png') center/contain no-repeat }
.ba-flower-left { left:-131px; top:177px }.ba-flower-right { right:-56px; top:144px }
.ha-figma-blog .primary-nav a.is-current-blog, .ha-figma-blog .primary-nav a.is-current-blog span { color:#cdf84e; font-weight:600 }
.ha-figma-blog .primary-nav a.is-current-blog img { filter:brightness(0) saturate(100%) invert(87%) sepia(65%) saturate(659%) hue-rotate(23deg) brightness(104%) contrast(101%) }
.ba-toolbar { min-height:160px; display:flex; align-items:center; background:#fff }
.ba-filters { width:100%; display:flex; align-items:center; justify-content:space-between; gap:32px }
.ba-search, .ba-select { height:50px; display:flex; align-items:center; border:2px solid #cdf84e; border-radius:50px; background:#fff }
.ba-search { width:510px; max-width:100%; gap:10px; padding:0 20px }
.ba-search img { width:33px; height:33px; flex:none }
.ba-search input { width:100%; min-width:0; padding:0; border:0; outline:0; color:#05284e; background:none; font-size:16px; line-height:24px }
.ba-search input::placeholder { color:#68696b; opacity:1 }
.ba-search input::-webkit-search-cancel-button { cursor:pointer }
.ba-filter-right { display:flex; align-items:center; gap:31px }
.ba-filter-label { display:flex; align-items:center; gap:12px; color:#68696b; font-size:18px; font-weight:500; line-height:26px; white-space:nowrap }
.ba-select { position:relative; width:197px; flex:none; padding:0 20px }
.ba-select select { width:100%; height:100%; padding:0 26px 0 0; appearance:none; border:0; outline:0; color:#68696b; background:transparent; cursor:pointer; font-size:16px }
.ba-select img { position:absolute; right:20px; width:24px; height:24px; pointer-events:none }
.ba-search:focus-within, .ba-select:focus-within { box-shadow:0 0 0 3px #cdf84e55 }
.ba-listing { padding:80px 0; background:#fff }
.ba-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px 23px; align-items:start; padding:0 2px }
.ba-card { height:516px; overflow:hidden; padding:24px 16px 22px; border-radius:16px; background:#eef3ff }
.ba-image { display:block; height:238px; overflow:hidden; margin-bottom:30px; border-radius:14px }
.ba-image img { display:block; width:100%; height:100%; object-fit:cover }
.ba-card-copy { display:flex; height:202px; flex-direction:column; gap:12px }
.ba-card h2 { display:-webkit-box; overflow:hidden; margin:0; color:#05284e; font-size:24px; font-weight:600; line-height:28px; letter-spacing:0; -webkit-box-orient:vertical; -webkit-line-clamp:2 }
.ba-card h2 a { color:inherit }
.ba-card-copy>p { display:-webkit-box; height:96px; overflow:hidden; margin:0; color:#020d1a; font-size:16px; line-height:24px; -webkit-box-orient:vertical; -webkit-line-clamp:3 }
.ba-read-more { display:flex; align-items:center; gap:10px; margin-top:auto; color:#0f5db3; font-size:18px; font-weight:500; line-height:26px }
.ba-read-more span { display:inline-block; font-size:14px; transform:translateY(-1px) }
.ba-pagination { display:flex; justify-content:center; margin-top:60px }
.ba-pagination a { min-width:152px; height:55px; display:flex; align-items:center; justify-content:center; padding:0 30px; border-radius:50px; color:#05284e; background:#cdf84e; font-size:18px; font-weight:500; line-height:22px }
.ba-pagination a:hover { background:#b7e33c }
.ba-empty { grid-column:1/-1; min-height:300px; display:grid; place-items:center; color:#68696b; font-size:18px }
@media(max-width:1100px) { .ba-filters { flex-wrap:wrap }.ba-filter-right { margin-left:auto }.ba-search { width:min(100%,460px) }.ba-hero-copy { max-width:850px }.ba-grid { grid-template-columns:repeat(2,minmax(0,1fr)) } }
@media(max-width:780px) { .ba-hero { height:420px }.ba-hero-copy { top:145px; max-width:620px }.ba-hero-copy h1 { font-size:42px; line-height:1.15 }.ba-hero-copy>div { font-size:16px; line-height:24px }.ba-flower { width:150px; height:148px; opacity:.7 }.ba-flower-left { left:-95px; top:175px }.ba-flower-right { right:-95px; top:120px }.ba-toolbar { padding:28px 0 }.ba-search { width:100% }.ba-filter-right { width:100%; justify-content:space-between; margin-left:0; gap:14px }.ba-filter-label { font-size:15px }.ba-select { width:165px }.ba-listing { padding:54px 0 }.ba-grid { gap:30px 16px }.ba-card h2 { font-size:19px; line-height:23px }.ba-card-copy>p { font-size:14px; line-height:21px } }
@media(max-width:560px) { .ba-hero { height:395px }.ba-hero-copy { top:133px }.ba-hero-copy h1 { font-size:34px }.ba-hero-copy>div { font-size:14px; line-height:21px }.ba-filter-right { display:grid; grid-template-columns:1fr 1fr; gap:12px }.ba-filter-label { display:grid; gap:5px; font-size:13px }.ba-select { width:100%; padding-inline:13px }.ba-select select { font-size:13px }.ba-select img { right:12px }.ba-grid { grid-template-columns:1fr; gap:26px }.ba-card h2 { font-size:21px; line-height:25px }.ba-pagination { margin-top:40px } }