*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,sans-serif;line-height:1.65;color:#1a1f36;background:#f8f9fc;font-size:16px}
main img,.hero img,.card img{max-width:100%;height:auto;display:block}
.wrap{max-width:80rem;margin:0 auto;padding:0 1rem}
@media(min-width:640px){.wrap{padding:0 1.5rem}}

/* NAVBAR */
.seo-header{
  background-color:#0f1123;
  border-bottom:none;
  position:sticky;
  top:0;
  z-index:100;
}
.seo-header-inner{
  padding:0 24px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  max-width:80rem;
  margin:0 auto;
}
.seo-logo{
  display:flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  color:inherit;
  flex-shrink:0;
  min-width:0;
}
.seo-logo:hover{text-decoration:none}
.seo-logo img,
.seo-logo-img,
.seo-logo svg{
  width:32px!important;
  height:32px!important;
  max-width:32px!important;
  max-height:32px!important;
  object-fit:contain;
  flex-shrink:0;
  overflow:hidden;
}
.seo-logo-text{
  font-size:16px;
  font-weight:700;
  color:#fff;
  line-height:1.2;
  min-width:0;
}
.seo-brand-name{
  font-size:16px;
  font-weight:700;
  color:#fff;
  line-height:1.2;
}
.seo-brand-domain,
.seo-logo-domain{
  display:block;
  font-size:11px;
  font-weight:400;
  color:#888;
  letter-spacing:normal;
  margin-top:2px;
}
.seo-nav{
  display:none;
  align-items:center;
  gap:24px;
  flex-wrap:nowrap;
}
@media(min-width:1024px){.seo-nav{display:flex}}
.seo-nav a{
  color:#ccc;
  text-decoration:none;
  font-size:14px;
  white-space:nowrap;
}
.seo-nav a:hover{color:#fff;text-decoration:none}
.seo-header-actions,
.seo-nav-auth{
  display:flex;
  align-items:center;
  gap:16px;
  flex-shrink:0;
}
.seo-link-login,
.seo-nav-auth a.seo-link-login{
  color:#ccc;
  font-size:14px;
  text-decoration:none;
  white-space:nowrap;
}
.seo-link-login:hover{color:#fff;text-decoration:none}
.seo-btn-register,
.seo-nav-auth a.seo-btn-register{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#0f1123;
  background:#d4af37;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  padding:8px 16px;
  border-radius:999px;
  white-space:nowrap;
}
.seo-btn-register:hover{filter:brightness(1.08);text-decoration:none}

/* FOOTER */
.seo-footer{
  background-color:#0f1123;
  padding:0;
  color:#888;
  font-size:14px;
  overflow:hidden;
  border-top:none;
  margin-top:0;
}
.seo-footer *{max-width:100%}
.seo-footer svg{display:none!important}
.seo-footer img,
.seo-footer .seo-logo-img{
  width:32px!important;
  height:32px!important;
  max-width:32px!important;
  max-height:32px!important;
  object-fit:contain;
}
.seo-footer-social{display:none!important}
.seo-footer-grid{
  display:grid;
  gap:32px;
  max-width:80rem;
  margin:0 auto;
  padding:40px 24px;
}
@media(min-width:768px){.seo-footer-grid{grid-template-columns:repeat(3,1fr)}}
.seo-footer-tagline{
  margin-top:12px;
  font-size:14px;
  color:#888;
  max-width:24rem;
  line-height:1.6;
}
.seo-footer-label{
  font-size:12px;
  font-weight:600;
  letter-spacing:.08em;
  color:#888;
  text-transform:uppercase;
}
.seo-footer-links{list-style:none;margin:12px 0 0;padding:0}
.seo-footer-links li{margin-bottom:8px}
.seo-footer-links li:last-child{margin-bottom:0}
.seo-footer-links a{
  font-size:14px;
  color:#ccc;
  text-decoration:none;
}
.seo-footer-links a:hover{color:#fff;text-decoration:none}
.seo-footer-bar{border-top:1px solid rgba(255,255,255,.08)}
.seo-footer-bar-inner{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:12px;
  max-width:80rem;
  margin:0 auto;
  padding:20px 24px;
  font-size:12px;
  color:#888;
}

.blog-meta{font-size:.85rem;color:#6b7280;margin-bottom:1rem}
.blog-article section{margin-bottom:2rem}
.blog-links{font-size:.9rem;margin-top:2rem}
.blog-list{display:grid;gap:1.25rem;margin:2rem 0 3rem}
@media(min-width:768px){.blog-list{grid-template-columns:repeat(2,1fr)}}
.blog-card{background:#fff;border:1px solid #dde3ef;border-radius:12px;padding:1.25rem 1.5rem;box-shadow:0 2px 8px rgba(26,35,64,.04)}
.blog-card h2{font-size:1.1rem;margin:0 0 .5rem;border:none;padding:0}
.blog-card h2 a{color:#1a2340;text-decoration:none}
.blog-card h2 a:hover{color:#3d4f8f}
.blog-card-meta{font-size:.8rem;color:#6b7280;margin-bottom:.5rem}
.blog-card-excerpt{font-size:.92rem;color:#3d4663;margin-bottom:.75rem}
.blog-card-link{font-size:.88rem;font-weight:600;color:#3d4f8f;text-decoration:none}
.blog-card-link:hover{text-decoration:underline}

/* --- Page content --- */
main a{color:#3d4f8f;text-decoration:none}
main a:hover{color:#c45c3e;text-decoration:underline}
.hero{background:linear-gradient(135deg,oklch(0.17 0.18 268),oklch(0.4 0.16 290));color:#fff;padding:2.5rem 0 3rem}
.hero h1{font-size:clamp(1.6rem,4vw,2.4rem);line-height:1.15;margin-bottom:1rem;font-weight:700}
.hero p{font-size:1.05rem;color:rgba(255,255,255,.82);max-width:52rem}
.badge{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);padding:.35rem .85rem;border-radius:999px;font-size:.75rem;margin-bottom:1rem}
main{padding:2rem 0 3rem}
section{margin-bottom:2.5rem}
h2{font-size:1.45rem;color:#1a2340;margin:2rem 0 1rem;padding-bottom:.5rem;border-bottom:2px solid #e8ecf4}
h3{font-size:1.1rem;color:#2d3a66;margin:1.25rem 0 .6rem}
p{margin-bottom:1rem;color:#3d4663}
ul,ol{margin:0 0 1rem 1.35rem;color:#3d4663}
li{margin-bottom:.4rem}
.table-wrap{overflow-x:auto;margin:1.25rem 0;border-radius:12px;border:1px solid #dde3ef;background:#fff;box-shadow:0 2px 12px rgba(26,35,64,.06)}
table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:640px}
th,td{padding:.7rem .85rem;text-align:left;border-bottom:1px solid #eef1f7}
th{background:oklch(0.17 0.18 268);color:#fff;font-weight:600;white-space:nowrap}
tr:nth-child(even) td{background:#f8f9fc}
tr:hover td{background:#eef3ff}
.win{color:#0d7a4e;font-weight:700}
.lose{color:#9a3412}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;margin:1.25rem 0}
.card{background:#fff;border:1px solid #dde3ef;border-radius:12px;padding:1.15rem;box-shadow:0 2px 8px rgba(26,35,64,.04)}
.card h3{margin-top:0;font-size:1rem}
.faq-item{background:#fff;border:1px solid #dde3ef;border-radius:10px;padding:1.1rem 1.25rem;margin-bottom:.85rem}
.faq-item h3{font-size:1rem;margin:0 0 .5rem;color:#1a2340}
.cta{background:linear-gradient(135deg,oklch(0.17 0.18 268),oklch(0.4 0.16 290));color:#fff;border-radius:16px;padding:2rem;margin:2rem 0;text-align:center}
.cta h2{color:#fff;border:none;margin:0 0 .75rem;padding:0}
.cta p{color:rgba(255,255,255,.85)}
.btn{display:inline-block;background:oklch(0.72 0.17 35);color:#fff!important;padding:.75rem 1.5rem;border-radius:999px;font-weight:600;margin-top:1rem;text-decoration:none!important}
.btn:hover{filter:brightness(1.1);color:#fff!important}
.btn-secondary{background:transparent;border:2px solid rgba(255,255,255,.5);margin-left:.5rem}
.link-grid{columns:3;column-gap:1.5rem;font-size:.88rem}
.link-grid a{display:block;margin-bottom:.35rem;break-inside:avoid}
.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}
@media(max-width:700px){.pros-cons{grid-template-columns:1fr}.link-grid{columns:2}}
@media(max-width:480px){.link-grid{columns:1}}
.toc{background:#fff;border:1px solid #dde3ef;border-radius:12px;padding:1.25rem;margin-bottom:2rem}
.toc ol{margin-bottom:0}
.keyword-block{background:#fff;border-left:4px solid oklch(0.78 0.14 75);padding:1rem 1.25rem;margin:1rem 0;border-radius:0 8px 8px 0}
.steps{counter-reset:step}
.steps li{list-style:none;position:relative;padding-left:2.5rem;margin-bottom:1rem}
.steps li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;width:1.75rem;height:1.75rem;background:oklch(0.4 0.16 290);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700}
.loc-toolbar{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1rem}
.loc-search{flex:1;min-width:200px;padding:.75rem 1rem;border:1px solid #dde3ef;border-radius:8px;font-size:1rem}
.loc-filter{padding:.75rem 1rem;border:1px solid #dde3ef;border-radius:8px;font-size:1rem;background:#fff}
.loc-count{font-size:.9rem;color:#3d4663;margin-bottom:1.5rem}
.loc-region{margin-bottom:2.5rem}
.loc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.75rem}
.loc-card{display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid #dde3ef;border-radius:10px;padding:.75rem 1rem;text-decoration:none!important;color:inherit!important;transition:border-color .15s,box-shadow .15s}
.loc-card:hover{border-color:oklch(0.4 0.16 290);box-shadow:0 2px 8px rgba(26,35,64,.08)}
.loc-flag{font-size:1.25rem;line-height:1}
.loc-name{flex:1;font-weight:600;font-size:.9rem;color:#1a2340}
.loc-badge{font-size:.65rem;background:#0d7a4e;color:#fff;padding:.2rem .55rem;border-radius:999px;font-weight:600;white-space:nowrap}