/* Kita Konsul Blog — shared styles */
:root{--teal:#086788;--cyan:#06AED5;--amber:#F0C808;--ink:#14212b;--muted:#5b6b78;--bg:#f6f9fb;--line:#e3ebf0;--radius:18px;}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Segoe UI',system-ui,-apple-system,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.7;-webkit-font-smoothing:antialiased;}
img{max-width:100%;}
a{color:var(--teal);text-decoration:none;}
a:hover{text-decoration:underline;}
.container{max-width:1120px;margin:0 auto;padding:0 24px;}
/* Nav */
.blog-nav{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;backdrop-filter:blur(8px);}
.blog-nav .container{display:flex;align-items:center;justify-content:space-between;height:68px;}
.blog-brand{font-weight:800;font-size:20px;color:var(--ink);text-decoration:none;letter-spacing:-.02em;}
.blog-brand span{color:var(--teal);}
.blog-brand small{display:block;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);}
.blog-nav-links{display:flex;gap:22px;align-items:center;font-size:14px;font-weight:600;}
.blog-nav-links a{color:var(--ink);text-decoration:none;}
.blog-nav-links a:hover{color:var(--teal);}
.btn{display:inline-block;background:linear-gradient(135deg,var(--teal),var(--cyan));color:#fff!important;padding:10px 20px;border-radius:999px;font-weight:700;font-size:14px;text-decoration:none!important;box-shadow:0 6px 16px rgba(8,103,136,.25);}
.btn-amber{background:linear-gradient(135deg,#e8a400,var(--amber));box-shadow:0 6px 16px rgba(240,200,8,.3);}
/* Hero */
.blog-hero{background:linear-gradient(135deg,var(--teal) 0%,#0b7fa6 55%,var(--cyan) 100%);color:#fff;padding:76px 0 64px;position:relative;overflow:hidden;}
.blog-hero::after{content:"";position:absolute;right:-120px;top:-120px;width:340px;height:340px;border-radius:50%;background:rgba(255,255,255,.08);}
.blog-hero .eyebrow{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin-bottom:14px;}
.blog-hero h1{font-size:clamp(30px,5vw,48px);line-height:1.15;max-width:820px;font-weight:800;letter-spacing:-.02em;}
.blog-hero p{max-width:680px;margin-top:18px;font-size:18px;opacity:.95;}
.blog-hero .meta{margin-top:22px;font-size:13px;opacity:.85;}
/* Article body */
.blog-body{padding:64px 0 30px;}
.article{max-width:820px;margin:0 auto;}
.article h2{font-size:26px;margin:44px 0 14px;color:var(--teal);letter-spacing:-.01em;padding-top:8px;}
.article h2::before{content:"";display:block;width:44px;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--teal),var(--cyan));margin-bottom:10px;}
.article h3{font-size:19px;margin:26px 0 8px;color:var(--ink);}
.article p{margin-bottom:16px;font-size:16.5px;}
.article ul,.article ol{margin:0 0 18px 22px;}
.article li{margin-bottom:8px;font-size:16px;}
.article strong{color:var(--teal);}
.article .lead{font-size:19px;color:var(--muted);font-style:normal;}
.callout{background:var(--bg);border-left:4px solid var(--cyan);border-radius:0 12px 12px 0;padding:18px 22px;margin:26px 0;}
.callout-amber{border-left-color:var(--amber);}
.callout h4{font-size:15px;margin-bottom:6px;color:var(--teal);text-transform:uppercase;letter-spacing:.08em;}
/* Cards */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;margin-top:40px;}
.blog-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:.2s;text-decoration:none!important;color:var(--ink);box-shadow:0 2px 10px rgba(8,103,136,.06);}
.blog-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(8,103,136,.14);}
.blog-card .cat{padding:18px 22px 0;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);}
.blog-card h3{padding:6px 22px 0;font-size:20px;line-height:1.3;}
.blog-card p{padding:10px 22px 0;color:var(--muted);font-size:14.5px;flex:1;}
.blog-card .more{padding:14px 22px 20px;font-weight:700;color:var(--teal);font-size:14px;}
/* CTA */
.blog-cta{background:var(--bg);border-top:1px solid var(--line);padding:56px 0;margin-top:40px;text-align:center;}
.blog-cta h2{color:var(--teal);font-size:28px;margin-bottom:10px;}
.blog-cta p{color:var(--muted);max-width:560px;margin:0 auto 22px;}
.blog-cta .actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
/* Footer */
.blog-footer{background:var(--ink);color:#cbd5dc;padding:34px 0;font-size:13px;}
.blog-footer .container{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.blog-footer a{color:var(--amber);}
/* Breadcrumb */
.crumbs{font-size:13px;color:var(--muted);margin-top:16px;}
.crumbs a{color:var(--teal);}
/* back link top */
.back-top{display:inline-block;margin:26px 0 0;font-weight:700;}
@media(max-width:640px){.blog-nav-links{display:none;}.article h2{font-size:22px;}}