:root{
  --paper:#FFFFFF;
  --paper-soft:#F7F9FA;
  --ink:#14213D;
  --ink-soft:#5B6470;
  --ink-faint:#727C87;
  --cool:#1E9BB5;
  --cool-soft:#E7F6F9;
  --heat:#FF8552;
  --heat-soft:#FFEEE5;
  --line:#E7ECEF;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Plus Jakarta Sans', sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:840px; margin:0 auto; padding:0 28px;}
.wrap-wide{max-width:1120px; margin:0 auto; padding:0 28px;}
@media (max-width:720px){ .wrap, .wrap-wide{padding:0 20px;} }

/* Logo */
.logo{display:flex; align-items:center; gap:10px;}
.logo-word{font-weight:800; font-size:19px; letter-spacing:-0.01em;}
.logo-word .ac{color:var(--cool); font-weight:700;}

/* Header */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  max-width:1120px; margin:0 auto; padding:18px 28px;
  display:flex; align-items:center; justify-content:space-between;
}
@media (max-width:720px){ .header-inner{padding:18px 20px;} }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 22px; border-radius:999px;
  font-weight:700; font-size:14.5px;
  border:1px solid transparent;
  cursor:pointer; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-primary{background:var(--ink); color:#fff;}
.btn-primary:hover{transform:translateY(-1px); box-shadow:0 6px 18px rgba(20,33,61,0.18);}

.nav-links{display:none; align-items:center; gap:24px;}
@media (min-width:880px){.nav-links{display:flex;}}
.nav-links a{font-size:14px; font-weight:600; color:var(--ink-soft);}
.nav-links a:hover{color:var(--ink);}

/* Mobile hamburger + menu (matches main site) */
.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:44px; height:44px; padding:11px; border:1px solid var(--line);
  border-radius:11px; background:#fff; cursor:pointer;
}
.nav-toggle span{display:block; height:2px; width:100%; background:var(--ink); border-radius:2px; transition:transform .22s ease, opacity .22s ease;}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-menu{display:none; flex-direction:column; padding:6px 28px 18px; border-top:1px solid var(--line); max-width:1120px; margin:0 auto;}
.mobile-menu.open{display:flex;}
.mobile-menu a{font-size:16px; font-weight:600; color:var(--ink); padding:14px 2px; border-bottom:1px solid var(--line);}
.mobile-menu a.btn{margin-top:14px; color:#fff; border-bottom:none; justify-content:center;}
@media (max-width:879px){
  .nav-toggle{display:flex;}
  .header-inner > .btn{display:none;}
  .mobile-menu{padding-left:20px; padding-right:20px;}
}
@media (min-width:880px){
  .mobile-menu{display:none !important;}
}

/* Breadcrumb */
.breadcrumb{font-size:13px; color:var(--ink-faint); margin:28px 0 14px;}
.breadcrumb a{color:var(--cool); font-weight:600;}
.breadcrumb a:hover{text-decoration:underline;}

/* Article */
.article-eyebrow{font-size:12.5px; font-weight:700; color:var(--cool); text-transform:uppercase; letter-spacing:.06em; margin-bottom:12px;}
article h1{font-size:36px; font-weight:800; letter-spacing:-0.02em; line-height:1.15; margin-bottom:16px;}
@media (max-width:560px){ article h1{font-size:28px;} }
.article-dek{font-size:17px; color:var(--ink-soft); margin-bottom:36px; max-width:640px;}
article h2{font-size:22px; font-weight:800; letter-spacing:-0.01em; margin:40px 0 14px;}
article h3{font-size:16.5px; font-weight:700; margin:24px 0 10px;}
article p{font-size:15.5px; color:var(--ink-soft); margin-bottom:16px;}
article ul, article ol{margin:0 0 16px 22px; color:var(--ink-soft); font-size:15.5px;}
article li{margin-bottom:8px;}
article strong{color:var(--ink);}
article table{width:100%; border-collapse:collapse; margin:16px 0 24px; font-size:14.5px;}
article th, article td{text-align:left; padding:10px 14px; border-bottom:1px solid var(--line);}
article th{font-weight:700; color:var(--ink); background:var(--paper-soft);}

/* Callout / CTA box */
.callout{
  background:var(--cool-soft); border-radius:16px; padding:26px 28px; margin:32px 0;
}
.callout-title{font-size:17px; font-weight:800; margin-bottom:8px;}
.callout p{color:var(--ink-soft); margin-bottom:18px; font-size:14.5px;}
.callout .btn-primary{background:var(--ink); color:#fff;}

.disclaimer{
  background:var(--heat-soft); border-radius:12px; padding:16px 20px; margin:24px 0;
  font-size:13.5px; color:var(--ink-soft);
}
.disclaimer strong{color:var(--ink);}

/* Related guides grid */
.related-title{font-size:20px; font-weight:800; margin:48px 0 18px;}
.related-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:48px;}
@media (max-width:560px){ .related-grid{grid-template-columns:1fr;} }
.related-card{
  border:1px solid var(--line); border-radius:14px; padding:20px;
  transition:border-color .15s ease;
}
.related-card:hover{border-color:var(--cool);}
.related-card-title{font-weight:700; font-size:15px; margin-bottom:6px; color:var(--ink);}
.related-card-text{font-size:13px; color:var(--ink-faint);}

/* Hub index */
.hub-hero{padding:56px 0 16px;}
.hub-hero h1{font-size:38px;}
.hub-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:32px 0 64px;}
@media (max-width:640px){ .hub-grid{grid-template-columns:1fr;} }
.hub-card{
  border:1px solid var(--line); border-radius:16px; padding:26px;
  transition:border-color .15s ease;
}
.hub-card:hover{border-color:var(--cool);}
.hub-card-title{font-size:17px; font-weight:700; margin-bottom:8px;}
.hub-card-text{font-size:14px; color:var(--ink-soft); line-height:1.6;}

/* Footer */
footer{border-top:1px solid var(--line); padding:40px 0 32px; margin-top:40px;}
.footer-grid{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:24px; margin-bottom:24px;}
.footer-cols{display:flex; gap:48px; flex-wrap:wrap;}
.footer-col-title{font-size:12.5px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px;}
.footer-col a{display:block; font-size:14px; color:var(--ink-soft); margin-bottom:8px;}
.footer-bottom{font-size:12.5px; color:var(--ink-faint); border-top:1px solid var(--line); padding-top:20px;}
.badge-fgas{
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid var(--line); border-radius:999px; padding:6px 12px;
  font-size:12px; font-weight:700; color:var(--ink-soft);
}

.back-home{display:inline-block; margin:24px 0 2px; font-size:14px; font-weight:700; color:var(--cool); text-decoration:none;}
.back-home:hover{text-decoration:underline;}
