.product-note{background:#eaf6ff;border-color:#cce8ff}.product-note .product-kicker{color:#1268a5}.note-primary.button{background:#168fe8;border-color:#168fe8;color:#fff}.note-primary.button:hover{background:#0b70bd}
@media(min-width:1200px){.product-grid.boki-family{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(min-width:960px) and (max-width:1199px){.product-grid.boki-family{grid-template-columns:repeat(2,minmax(0,1fr))}}
.note-hero{background:radial-gradient(circle at 82% 18%,#d7efff 0,transparent 38%),#eef8ff;padding:76px 0}.note-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}.note-identity{display:flex;gap:15px;align-items:center}.note-identity img{width:82px;height:82px;object-fit:contain}.note-identity strong{display:block;font-size:29px}.note-identity span{display:block;color:#49718d;font-size:14px}.note-hero h1{font-size:clamp(42px,5vw,68px);line-height:1.18;letter-spacing:-.05em;margin:27px 0 18px;color:#173d61}.note-hero p{max-width:590px;line-height:1.85;color:#496377}.note-label{font-size:13px;font-weight:750;color:#1473b2}.note-demo{background:#fff;border:1px solid #cde7f7;border-radius:28px;padding:27px;box-shadow:0 22px 50px #186aa41a}.note-demo h2{font-size:17px;margin:0 0 14px}.note-demo blockquote{margin:0;padding:16px;border-radius:16px;background:#eff8ff;line-height:1.8}.note-next{margin-top:15px;padding:17px;border-radius:16px;background:#eaf9f1;color:#1d6345}.note-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.note-feature{padding:25px;border:1px solid var(--line);border-radius:20px;background:#fff}.note-feature h3{margin:0 0 10px;font-size:19px}.note-feature p{margin:0;color:var(--ink-2);line-height:1.7}.note-price{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.note-price article{padding:24px;border-radius:18px;background:#f0f8ff}.note-price strong{display:block;font-size:27px;color:#1268a5;margin:7px 0}.note-price p{line-height:1.7}.note-status{background:#173d61;color:#fff;border-radius:24px;padding:35px}.note-status p{color:#d5e9f5;line-height:1.8}.note-status a{color:#fff}
@media(max-width:850px){.note-grid{grid-template-columns:1fr;gap:30px}.note-demo{max-width:600px}.note-feature-grid,.note-price{grid-template-columns:1fr 1fr}}@media(max-width:600px){.note-hero{padding:45px 0}.note-hero h1{font-size:42px}.note-feature-grid,.note-price{grid-template-columns:1fr}.note-status{padding:25px}}