:root{
  --red:#F94A37; --orange:#FB7533; --mint:#DCF7F8; --mint2:#C9F2F4;
  --text:#222221; --muted:rgba(34,34,33,.72); --border:rgba(34,34,33,.12);
  --shadow:0 18px 50px rgba(0,0,0,.10); --shadow2:0 10px 26px rgba(0,0,0,.10);
  --radius:22px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;line-height:1.6;background:#fff}
a{color:inherit;text-decoration:none}
.container{max-width:1120px;margin:0 auto;padding:0 20px}
.topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:900}
.brand .logo{height:36px;width:auto;max-width:220px;object-fit:contain;display:block}
.menu{display:none;gap:8px;font-size:14px;flex-wrap:wrap}
.menu a{padding:8px 10px;border-radius:999px}
.menu a:hover{background:rgba(201,242,244,.55)}
.actions{display:flex;align-items:center;gap:10px}
.lang{border:1px solid var(--border);background:#fff;border-radius:999px;padding:8px 12px;font-size:13px;cursor:pointer}
.lang:hover{background:rgba(220,247,248,.6)}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:10px 14px;font-size:13px;color:#fff;background:var(--orange);border:0;cursor:pointer}
.btn:hover{opacity:.92}
.btn.red{background:var(--red)}
.pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:10px 14px;font-size:13px;border:1px solid var(--border);background:#fff}
.pill:hover{background:rgba(220,247,248,.5)}
@media(min-width:920px){ .menu{display:flex} }

.hero{position:relative;padding:74px 0 58px;background:linear-gradient(180deg, rgba(220,247,248,.58), rgba(255,255,255,1));overflow:hidden}
.hero:before{content:"";position:absolute;top:-140px;right:60px;width:460px;height:460px;background:radial-gradient(circle at 30% 30%, rgba(249,74,55,.22), rgba(251,117,51,.16), rgba(201,242,244,0) 70%);filter:blur(2px);border-radius:999px;pointer-events:none}
.grid{display:grid;gap:18px}
@media(min-width:920px){ .grid.two{grid-template-columns:1.2fr .8fr;align-items:start} }
h1{font-size:46px;letter-spacing:-.03em;line-height:1.05;margin:0}
.lead{margin-top:14px;font-size:18px;color:var(--muted)}
.kicker{font-size:12px;color:rgba(34,34,33,.62);margin-top:14px}
.section{padding:56px 0;border-top:1px solid var(--border)}
.section.soft{background:rgba(220,247,248,.32)}
h2{font-size:30px;letter-spacing:-.02em;margin:0}
h3{margin:0;font-size:18px}
.cards{display:grid;gap:14px;margin-top:18px}
@media(min-width:920px){ .cards.three{grid-template-columns:repeat(3,1fr)} .cards.two{grid-template-columns:repeat(2,1fr)} .cards.four{grid-template-columns:repeat(4,1fr)} }
.card{border:1px solid var(--border);border-radius:var(--radius);padding:22px;background:#fff;transition:transform .18s ease, box-shadow .18s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.card.mint{background:linear-gradient(180deg, rgba(220,247,248,.7), rgba(255,255,255,.92))}
.badge{display:inline-flex;align-items:center;gap:8px;padding:4px 10px;border-radius:999px;font-size:12px;border:1px solid var(--border);background:rgba(255,255,255,.86)}
.small{font-size:13px;color:var(--muted)}
.list{margin:12px 0 0;padding-left:18px;color:rgba(34,34,33,.84)}
.list li{margin:8px 0}
.callout{border-left:4px solid var(--orange);padding:12px 14px;background:rgba(251,117,51,.10);border-radius:14px}
.table{width:100%;border-collapse:collapse;margin-top:12px}
.table th,.table td{border-bottom:1px solid var(--border);padding:10px 0;text-align:left;font-size:14px;vertical-align:top}
.blogmeta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.thumb{width:100%;height:auto;border-radius:18px;border:1px solid var(--border);display:block;margin-top:14px;box-shadow:var(--shadow2)}
.thumb-sm{width:100%;height:auto;border-radius:16px;border:1px solid var(--border);display:block;margin-top:10px}

.reveal{opacity:0;transform:translateY(10px);transition:opacity .55s ease, transform .55s ease}
.reveal.in{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1;transform:none;transition:none} .card{transition:none} }

.footer{border-top:1px solid var(--border);padding:36px 0;background:#fafafa}
.footergrid{display:grid;gap:16px}
@media(min-width:920px){ .footergrid{grid-template-columns:1.2fr .8fr 1fr} }
.footer a:hover{opacity:.82}
.hr{border-top:1px solid var(--border);margin-top:16px;padding-top:14px}

.input{width:100%;padding:12px 14px;border-radius:14px;border:1px solid var(--border);font-size:14px}
textarea.input{min-height:130px;resize:vertical}
.notice{font-size:12px;color:rgba(34,34,33,.68)}
/* Mobile burger menu */
.burger{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:999px;border:1px solid var(--border);background:#fff;cursor:pointer}
.burger:hover{background:rgba(220,247,248,.6)}
.burger span{display:block;width:18px;height:2px;background:rgba(34,34,33,.78);position:relative}
.burger span:before,.burger span:after{content:"";position:absolute;left:0;width:18px;height:2px;background:rgba(34,34,33,.78)}
.burger span:before{top:-6px}
.burger span:after{top:6px}

@media(min-width:920px){ .burger{display:none !important} }

/* Mobile dropdown menu */
@media(max-width:919px){
  .burger{display:inline-flex !important;background:#fff;border:1px solid var(--border)}
  .menu{display:none;position:absolute;right:20px;top:64px;flex-direction:column;align-items:stretch;min-width:240px;
        background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border:1px solid var(--border);
        border-radius:16px;padding:10px;box-shadow:var(--shadow2)}
  .menu.open{display:flex}
  .menu a{padding:10px 12px}
}

@media(max-width:919px){ .topbar .container{position:relative} }