[data-style] h1,[data-style] h2,[data-style] h3,[data-style] .sample-title{font-family:var(--variant-heading),sans-serif!important}html[data-style] body,[data-style] .sample-body{font-family:var(--variant-body),sans-serif}[data-style] .button{font-family:var(--variant-heading),sans-serif;isolation:isolate;letter-spacing:.2px;white-space:normal;border:1px solid #b8efce;min-height:48px;padding:16px 25px;transition:filter .2s,background .2s,transform .2s;position:relative}[data-style] .button:hover{filter:brightness(1.12);transform:translateY(-2px)}[data-style] .button:focus-visible{outline-offset:4px;outline:3px solid #fff;box-shadow:inset 0 0 0 3px #244b39}[data-style="01"] .button{clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);border:0}[data-style="02"] h1,[data-style="02"] h2,[data-style="02"] .sample-title{font-weight:500;letter-spacing:-1px!important}[data-style="02"] .button{border-radius:32px 32px 5px 5px;padding-inline:30px;font-size:17px;font-weight:700}[data-style="03"] .button{clip-path:polygon(16px 0,100% 0,calc(100% - 16px) 100%,0 100%);border:0;padding-inline:32px;font-size:17px;font-weight:600}[data-style="04"] .button{color:#b8efce;background:0 0;border:1px solid #567d68;border-left:0;border-right:0;padding-inline:28px;font-size:12px}[data-style="04"] .button:before,[data-style="04"] .button:after{color:#b8efce;align-items:center;font:32px IBM Plex Mono,monospace;display:grid;position:absolute;inset-block:0}[data-style="04"] .button:before{content:"[";left:0}[data-style="04"] .button:after{content:"]";right:0}[data-style="04"] .button:hover{background:#1a3025}[data-style="05"] .button{border-radius:99px;padding-right:60px;font-size:11px}[data-style="05"] .button:after{content:"↗";color:#b8efce;background:#10231a;border-radius:50%;place-items:center;width:34px;height:34px;font-size:18px;display:grid;position:absolute;top:50%;right:6px;transform:translateY(-50%)}[data-style="05"] .button>span{display:none}[data-style="06"] .button{clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 50%,calc(100% - 18px) 100%,18px 100%,0 50%);border:0;padding-inline:30px;font-weight:600}[data-style="07"] .button{border-radius:4px 25px;padding-right:30px;font-weight:600;box-shadow:4px 4px #34523f}[data-style="08"] .button{clip-path:polygon(0 0,calc(100% - 22px) 0,calc(100% - 22px) 7px,100% 7px,100% calc(100% - 7px),22px calc(100% - 7px),22px 100%,0 100%);border:0;padding:20px 28px}[data-style="09"] .button{clip-path:polygon(8px 0,calc(100% - 8px) 0,calc(100% - 8px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 8px) calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 8px),0 calc(100% - 8px),0 8px,8px 8px);border:0;padding-inline:30px;font-size:16px}[data-style="10"] .button{clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);border:0;padding-inline:29px}[data-style="10"] .button:before{content:"";clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px),0 7px);pointer-events:none;border:1px solid #3f7255;position:absolute;inset:5px}html[data-style="04"] .hero h1,html[data-style="05"] .hero h1{letter-spacing:-2px;font-size:clamp(33px,3.7vw,56px)}html[data-style="06"] .hero h1{letter-spacing:-1.5px;font-size:clamp(35px,3.8vw,60px)}.variant-preview-bar{z-index:80;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#0d1917f5;border:1px solid #638571;align-items:center;gap:25px;width:max-content;max-width:94vw;padding:15px 22px;font:11px DM Sans,sans-serif;display:flex;position:fixed;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 12px 50px #0008}.variant-preview-bar span{color:#b8efce;letter-spacing:1px}.variant-preview-bar a{color:#e9eee7;text-underline-offset:4px;text-decoration:underline}.variant-preview-bar a:hover{color:#b8efce}@media (width<=760px){html[data-style] .hero h1{letter-spacing:-1px;font-size:clamp(30px,6.8vw,48px)}html[data-style] .service h3{overflow-wrap:anywhere}.variant-preview-bar{flex-wrap:wrap;gap:12px;padding:12px;font-size:10px}.variant-preview-bar span{width:100%}}@media (prefers-reduced-motion:reduce){[data-style] .button{transition:none}}