/* Scoped site header/nav for standalone tool pages.
   All rules live under .atp-nav so they never collide with a tool's
   own stylesheet. Mirrors the homepage header (assets/site.css). */
.atp-nav{
  --atp-dark:#0a1b33;
  --atp-gold-bright:#e8c766;
  --atp-grad-gold:linear-gradient(135deg,#e8c766 0%,#c9a62c 60%,#a8861f 100%);
  --atp-font-display:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;
  font-family:"Poppins","Helvetica Neue",Arial,sans-serif;
}
.atp-nav .wrap{max-width:1180px;margin:0 auto;padding:0 1.5rem}
.atp-nav .topbar{background:#0a1b33;color:#cfdae6;font-size:.82rem;font-weight:500}
.atp-nav .topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:.5rem;padding-bottom:.5rem;flex-wrap:wrap}
.atp-nav .topbar a{color:var(--atp-gold-bright);text-decoration:none;font-weight:600}
.atp-nav .topbar a:hover{color:#fff}
.atp-nav .site-header{background:rgba(10,27,51,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(232,199,102,.18)}
.atp-nav .nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 0}
.atp-nav .brand-logo img{height:42px;width:auto;display:block}
.atp-nav .nav-links{display:flex;gap:1.6rem;align-items:center;flex-wrap:wrap}
.atp-nav .nav-links a{color:#d7e0ec;text-decoration:none;font-size:.95rem;font-weight:500}
.atp-nav .nav-links a:hover{color:#fff}
.atp-nav .btn{display:inline-block;font-family:var(--atp-font-display);font-weight:700;font-size:.95rem;
  background:var(--atp-grad-gold);color:#241d04;padding:.78rem 1.6rem;border-radius:999px;
  text-decoration:none;border:0;cursor:pointer;box-shadow:0 6px 18px rgba(201,166,44,.35);
  transition:transform .18s ease,box-shadow .18s ease}
.atp-nav .btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(201,166,44,.45);color:#241d04}
.atp-nav .nav-links .has-drop{position:relative}
.atp-nav .nav-links .has-drop>a::after{content:" \25BE";font-size:.72em;color:var(--atp-gold-bright)}
.atp-nav .nav-links .drop{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(8px);min-width:290px;background:#0a1b33;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:.55rem;opacity:0;visibility:hidden;transition:opacity .18s,transform .18s,visibility .18s;box-shadow:0 18px 44px rgba(0,0,0,.55);z-index:60}
.atp-nav .nav-links .has-drop:hover .drop,.atp-nav .nav-links .has-drop:focus-within .drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.atp-nav .nav-links .drop a{display:block;padding:.62rem .95rem;border-radius:9px;font-size:.9rem;white-space:nowrap}
.atp-nav .nav-links .drop a:hover{background:rgba(201,166,44,.14);color:#fff}
.atp-nav .nav-links .drop a span.sub{display:block;font-size:.76rem;color:#8b93a7;font-weight:400}
.atp-nav .nav-toggle{display:none;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.22);border-radius:10px;padding:.62rem .68rem;cursor:pointer;flex-direction:column;gap:5px;align-items:center;justify-content:center}
.atp-nav .nav-toggle span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:transform .2s ease,opacity .2s ease}
.atp-nav .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.atp-nav .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.atp-nav .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.atp-nav .mobile-menu{display:none;position:absolute;top:100%;left:0;right:0;background:#0a1b33;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 24px 48px rgba(0,0,0,.5);max-height:calc(100dvh - 80px);overflow-y:auto;z-index:55}
.atp-nav .mobile-menu.open{display:block}
.atp-nav .m-links{padding:.4rem 1.25rem 1.4rem}
.atp-nav .m-links .has-drop{display:grid;grid-template-columns:1fr auto;border-bottom:1px solid rgba(255,255,255,.07)}
.atp-nav .m-links .has-drop>a{grid-column:1;grid-row:1;display:flex;align-items:center;padding:.95rem 0;color:#eef2f9;text-decoration:none;font-weight:600;font-size:1.02rem}
.atp-nav .m-drop-toggle{grid-column:2;grid-row:1;background:none;border:0;color:var(--atp-gold-bright);font-size:1.25rem;line-height:1;padding:.95rem .4rem .95rem 1rem;cursor:pointer;transition:transform .2s ease}
.atp-nav .m-links .has-drop.m-open .m-drop-toggle{transform:rotate(180deg)}
.atp-nav .m-links .drop{grid-column:1/-1;display:none;padding:0 0 .6rem}
.atp-nav .m-links .has-drop.m-open .drop{display:block}
.atp-nav .m-links .drop a{display:block;padding:.62rem 0 .62rem 1rem;color:#b9c6da;text-decoration:none;font-size:.95rem;border-left:2px solid rgba(201,166,44,.35)}
.atp-nav .m-links .drop a span.sub{display:block;font-size:.78rem;color:#8b93a7;font-weight:400}
.atp-nav .m-links>a.btn{display:block;text-align:center;margin-top:1.1rem}
@media(max-width:1024px){
  .atp-nav .nav-links{display:none}
  .atp-nav .nav-toggle{display:inline-flex}
  .atp-nav .topbar .wrap{font-size:.82rem;gap:.4rem}
}
@media(max-width:900px){
  .atp-nav .brand-logo img{height:36px}
}
