@font-face{font-family:'Noto Sans Thai';font-style:normal;font-weight:400;font-display:swap;src:url(noto-sans-thai-400.ttf) format('truetype');unicode-range:U+0E00-0E7F}
@font-face{font-family:'Noto Sans Thai';font-style:normal;font-weight:700;font-display:swap;src:url(noto-sans-thai-700.ttf) format('truetype');unicode-range:U+0E00-0E7F}
.bobbot-blog{font-family:Figtree,Arial,sans-serif;color:#4c4c4c;overflow:hidden}
.bobbot-blog .bb-blog-list,.bobbot-blog .bb-blog-list *{font-family:'Noto Sans Thai',Figtree,Arial,sans-serif!important}
.bobbot-blog *{box-sizing:border-box}
.bobbot-blog .bb-blog-hero{height:350px;background:linear-gradient(#0003,#0003),url("https://bobbottech.com/wp-content/uploads/2026/10/B-1-02-1.png") center/cover no-repeat;position:relative;display:flex;align-items:center;justify-content:center;padding:100px 24px 18px;overflow:hidden}
.bobbot-blog h1{position:relative;color:#fff;font-size:40px;line-height:1.5;text-transform:uppercase;font-weight:700;margin:0}
.bobbot-blog .bb-blog-list{padding:90px 24px 100px;background:linear-gradient(#f7f2e2,white 623px)}
.bobbot-blog .bb-blog-grid{max-width:1200px;margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 17px}
.bobbot-blog .bb-blog-card{min-width:0;padding:16px;background:white;border-radius:16px;transition:box-shadow .2s,transform .2s}
.bobbot-blog .bb-blog-card:hover,.bobbot-blog .bb-blog-card:focus-within{box-shadow:10px 10px 20px #9c9c9c40;transform:translateY(-3px)}
.bobbot-blog .bb-blog-image{display:block;aspect-ratio:357/201;border-radius:8px;overflow:hidden;background:#f3f1e9}
.bobbot-blog .bb-blog-image img{width:100%;height:100%;object-fit:cover;display:block}
.bobbot-blog .bb-blog-placeholder{height:100%;display:flex;align-items:center;justify-content:center;color:#102763;font-size:28px;letter-spacing:5px}
.bobbot-blog .bb-blog-card-copy{padding:16px 16px 0}
.bobbot-blog h2{font-size:20px;line-height:1.4;font-weight:700;margin:0 0 16px;color:#102763;overflow-wrap:anywhere}
.bobbot-blog a{text-decoration:none;color:inherit}
.bobbot-blog .bb-blog-detail{font-size:14px;display:inline-flex;align-items:center;gap:8px}
.bobbot-blog .bb-blog-detail span{width:12.5px;height:10px;background:url(arrow.svg) no-repeat}
.bobbot-blog a:focus-visible{outline:3px solid #338cff;outline-offset:4px}
.bobbot-blog .bb-blog-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:40px}
.bobbot-blog .page-numbers{padding:10px 16px;border:1px solid #ddd;border-radius:8px;background:white}
.bobbot-blog .page-numbers.current{background:#102763;color:white}
.bobbot-blog .bb-blog-empty{grid-column:1/-1;padding:60px 0;text-align:center}
.bobbot-blog .bb-blog-cta{min-height:396px;position:relative;display:flex;justify-content:center;align-items:center;padding:70px 24px;background:linear-gradient(#ffffff66,#f7f2e266),url(cta.png) center/cover no-repeat;text-align:center}
.bobbot-blog .bb-blog-cta:before{content:'';position:absolute;left:0;top:0;width:259px;height:273px;background:url(ring.svg) no-repeat;pointer-events:none}
.bobbot-blog .bb-blog-cta:after{content:'';position:absolute;bottom:0;left:0;right:0;height:180px;background:linear-gradient(transparent,white);pointer-events:none}
.bobbot-blog .bb-blog-cta>div{position:relative;z-index:1}
.bobbot-blog .bb-blog-cta h2{font-size:40px;line-height:1.25;text-transform:uppercase;margin-bottom:8px}
.bobbot-blog .bb-blog-cta p{font-size:18px;line-height:26px;margin:0 0 24px}
.bobbot-blog .bb-blog-button{display:inline-flex;justify-content:center;align-items:center;min-width:185px;min-height:44px;padding:10px 20px;border-radius:24px;background:#b28d1b;color:white;font-weight:700;position:relative;overflow:hidden}
.bobbot-blog .bb-blog-button:before{content:'';position:absolute;top:-50%;bottom:-50%;left:-40%;width:25%;background:#ffffff60;transform:skewX(-25deg)}
.bobbot-blog .bb-blog-button{transition:background-color .2s,transform .2s,box-shadow .2s}
.bobbot-blog .bb-blog-button:hover,.bobbot-blog .bb-blog-button:focus-visible{background:#967514;color:white;transform:translateY(-2px);box-shadow:0 7px 18px #0002}
.bobbot-blog .bb-blog-button:hover:before,.bobbot-blog .bb-blog-button:focus-visible:before{animation:bb-blog-shine .65s forwards;pointer-events:none}
@keyframes bb-blog-shine{from{left:-40%}to{left:130%}}
@media(max-width:1024px){.bobbot-blog .bb-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.bobbot-blog .bb-blog-hero{height:280px}.bobbot-blog .bb-blog-list{padding:48px 20px 60px}.bobbot-blog .bb-blog-grid{grid-template-columns:1fr;gap:24px}.bobbot-blog .bb-blog-cta h2{font-size:30px}.bobbot-blog .bb-blog-cta{padding-block:64px}.bobbot-blog h1{font-size:34px}}
@media(prefers-reduced-motion:reduce){.bobbot-blog .bb-blog-card,.bobbot-blog .bb-blog-button{transition:none}.bobbot-blog .bb-blog-button:hover,.bobbot-blog .bb-blog-button:focus-visible{transform:none}.bobbot-blog .bb-blog-button:hover:before,.bobbot-blog .bb-blog-button:focus-visible:before{animation:none}}