:root{
  --bg: #0b0f17;
  --panel: rgba(255,255,255,.06);
  --panel2: rgba(255,255,255,.08);
  --text: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.66);
  --line: rgba(255,255,255,.12);
  --accent: rgba(120,170,255,.95);
  --good: rgba(120,255,180,.9);
  --warn: rgba(255,200,120,.9);
  --bad: rgba(255,120,140,.9);
  --shadow: 0 18px 50px rgba(0,0,0,.5);
  --radius: 18px;
  --radius2: 12px;
  --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Apple Color Emoji", "Segoe UI Emoji";
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: var(--font);
  color: var(--text);
  background:
    radial-gradient(1000px 700px at 10% 10%, rgba(120,170,255,.14), transparent 55%),
    radial-gradient(900px 600px at 90% 20%, rgba(255,120,200,.10), transparent 55%),
    radial-gradient(900px 700px at 30% 90%, rgba(120,255,180,.10), transparent 55%),
    linear-gradient(180deg, #070a10, #0b0f17 40%, #070a10);
  letter-spacing: .2px;
}

a{ color: inherit; text-decoration:none; }
a:hover{ color: white; }

.wrap{
  max-width: 1240px;
  margin: 0 auto;
  padding: 26px 18px 34px;
}

.shell{
  display:grid;
  grid-template-columns: 290px 1fr;
  gap: 16px;
  min-height: calc(100vh - 60px);
}

@media (max-width: 980px){
  .shell{ grid-template-columns: 1fr; }
  .sidebar{ position: sticky; top: 0; z-index: 20; }
}

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.brand{
  display:flex;
  align-items:center;
  gap: 10px;
}

.badge{
  width: 38px;
  height: 38px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(120,170,255,.95), rgba(255,120,200,.8));
  box-shadow: var(--shadow);
  display:grid;
  place-items:center;
  font-weight: 800;
}

.brand h1{
  margin:0;
  font-size: 16px;
  line-height: 1.2;
}
.brand .sub{
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted);
}

.pills{
  display:flex;
  gap: 8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.pill{
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  border-radius: 999px;
  padding: 7px 10px;
  font-size: 12px;
  color: var(--muted);
}

.sidebar{
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.04));
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
}

.sidebar .head{
  padding: 14px 14px 10px;
  border-bottom: 1px solid var(--line);
}

.sidebar .head .title{
  font-size: 13px;
  font-weight: 700;
  margin: 0;
}
.sidebar .head .hint{
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--muted);
}

.nav{
  padding: 8px;
  display:flex;
  flex-direction:column;
  gap: 6px;
}

.nav a{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 12px;
  border: 1px solid transparent;
  color: var(--muted);
}

.nav a .dot{
  width: 9px;
  height: 9px;
  border-radius: 99px;
  background: rgba(255,255,255,.22);
  box-shadow: 0 0 0 1px rgba(255,255,255,.10);
}

.nav a.active{
  color: rgba(255,255,255,.95);
  background: rgba(120,170,255,.12);
  border-color: rgba(120,170,255,.22);
}
.nav a.active .dot{
  background: rgba(120,170,255,.92);
}

.card{
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
}

.card .content{
  padding: 18px 18px 18px;
}

.kicker{
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted);
}

h2{
  margin: 10px 0 10px;
  font-size: 26px;
  line-height: 1.15;
}

p{
  color: rgba(255,255,255,.80);
  line-height: 1.6;
  margin: 10px 0;
}

hr{
  border: none;
  border-top: 1px solid var(--line);
  margin: 16px 0;
}

.grid{
  display:grid;
  gap: 12px;
}
.grid.two{ grid-template-columns: 1fr 1fr; }
.grid.three{ grid-template-columns: 1fr 1fr 1fr; }
@media (max-width: 980px){
  .grid.two,.grid.three{ grid-template-columns: 1fr; }
}

.box{
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  border-radius: var(--radius2);
  padding: 14px;
}

.box h3{
  margin:0 0 8px;
  font-size: 14px;
}
.box p{ margin:0; color: rgba(255,255,255,.74); }

.list{
  margin: 10px 0 0;
  padding-left: 18px;
  color: rgba(255,255,255,.78);
  line-height: 1.7;
}

.footerbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  margin-top: 14px;
  padding: 12px 14px;
  border-top: 1px solid var(--line);
  background: rgba(0,0,0,.12);
}

.btn{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.86);
  font-size: 13px;
}
.btn:hover{
  border-color: rgba(120,170,255,.35);
  background: rgba(120,170,255,.10);
}

.tagline{
  font-size: 12px;
  color: var(--muted);
}

.callout{
  border-left: 3px solid rgba(120,170,255,.85);
  padding: 10px 12px;
  background: rgba(120,170,255,.08);
  border-radius: 12px;
  color: rgba(255,255,255,.86);
}

.mini{
  font-size: 12px;
  color: var(--muted);
}

.codebox{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 12px;
  color: rgba(255,255,255,.84);
  background: rgba(0,0,0,.25);
  border: 1px solid var(--line);
  padding: 12px;
  border-radius: 12px;
  overflow:auto;
  white-space: pre;
}


/* AeroVista 2026 parent brand — Notion current guide, 2026-08-13.
   Visual-only layer: preserve all existing HTML content and navigation. */
:root{
 --bg:#0F1115;--panel:#181c23;--panel2:#20252c;
 --text:#E8EDF2;--muted:#b0bac5;--line:rgba(192,192,192,.18);
 --accent:#00AEEF;--accent-strong:#00AEEF;--focus:#70d8ff;
 --font:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
 color-scheme:dark;
}
html{scroll-behavior:smooth}
body{
 background:linear-gradient(145deg,#0F1115 0%,#151a20 55%,#0F1115 100%);
 color:var(--text);font-family:var(--font);letter-spacing:0;
}
a:focus-visible,button:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.skip-link{position:absolute;left:12px;top:-90px;z-index:1000;background:#E8EDF2;color:#0F1115;padding:12px 18px;border-radius:8px}
.skip-link:focus{top:10px}
.brand h1,.content h2,.content h3{font-family:"Orbitron","Montserrat",system-ui,sans-serif}
.brand h1{font-size:clamp(14px,2vw,17px);letter-spacing:.035em}
.brand .sub{color:var(--muted)}
.badge{background:linear-gradient(145deg,#303b46,#11161b);border:1px solid rgba(192,192,192,.5);color:#E8EDF2;border-radius:9px;box-shadow:none}
.sidebar,.card{background:linear-gradient(180deg,#1b2027,#151a20);border-color:var(--line);box-shadow:0 12px 34px rgba(0,0,0,.22)}
.box{background:#1c2229;border-color:var(--line)}
.pill{background:#1b2027;border-color:var(--line)}
.nav a{min-height:44px}
.nav a.active{background:rgba(0,174,239,.09);border-color:rgba(0,174,239,.32);color:var(--text)}
.nav a.active .dot{background:#00AEEF}
.callout{border-left-color:#00AEEF;background:rgba(0,174,239,.07)}
.btn{min-height:44px;justify-content:center}
.btn:hover{border-color:rgba(0,174,239,.55);background:rgba(0,174,239,.10)}
.content h2{font-size:clamp(1.5rem,3.7vw,2.25rem);letter-spacing:-.015em;line-height:1.25}
.content h3{line-height:1.45}
.content p{font-size:clamp(.98rem,1.4vw,1.07rem)}
.mobile-menu{display:none;border:1px solid rgba(0,174,239,.5);background:#202b35;color:#E8EDF2;border-radius:9px;padding:12px 16px;font:inherit;font-weight:700;cursor:pointer;min-height:46px}
@media(max-width:980px){
 .wrap{padding:12px 12px 28px}
 .shell{display:flex;flex-direction:column;min-height:0;gap:12px}
 .topbar{align-items:flex-start}
 .pills{display:none}
 .sidebar{position:static;box-shadow:none}
 .sidebar .head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px}
 .sidebar .head .hint{display:none}
 .mobile-menu{display:inline-flex;align-items:center;gap:8px}
 .nav{display:none;padding:8px}
 .sidebar.is-open .nav{display:flex}
 .card .content{padding:20px 16px}
 .footerbar{flex-wrap:wrap;padding:12px}
 .footerbar .btn{flex:1}
 .grid.two,.grid.three{grid-template-columns:1fr}
}
@media(max-width:420px){
 .brand h1{font-size:15px}
 .brand .sub{font-size:11px}
 .badge{width:36px;height:36px;flex:none}
 .footerbar .tagline{width:100%}
 .box{padding:16px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Mobile layout correction — 2026-11-01 */
html,body{width:100%;max-width:100%;overflow-x:clip}
.wrap,.shell,.card,.sidebar,.content,.grid,.box{min-width:0}
img,svg,video,iframe{max-width:100%;height:auto}
.content{overflow-wrap:anywhere}
.codebox{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere;overflow-x:auto}
@media(min-width:981px){
 .shell{grid-template-columns:minmax(240px,290px) minmax(0,1fr);align-items:start}
 .sidebar{position:sticky;top:16px;max-height:calc(100dvh - 32px);overflow:auto}
}
@media(max-width:980px){
 .wrap{width:100%;max-width:100%;padding:12px max(12px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
 .shell{display:flex;flex-direction:column;gap:12px;min-height:auto}
 .topbar{margin-bottom:12px;min-width:0}
 .brand{min-width:0}
 .brand>div:last-child{min-width:0}
 .sidebar{width:100%;position:relative;z-index:2;overflow:visible}
 .sidebar .head{min-height:58px}
 .nav{max-height:min(68dvh,540px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
 .nav a{min-height:48px;line-height:1.4}
 .card{width:100%;overflow:hidden}
 .card .content{padding:clamp(16px,4vw,24px)}
 .grid.two,.grid.three{grid-template-columns:minmax(0,1fr)}
 .grid>[style*="grid-column"]{grid-column:auto!important}
 .box{padding:16px}
 .footerbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .footerbar .tagline{grid-column:1/-1}
 .footerbar .btn{min-width:0;width:100%;text-align:center;white-space:normal}
 .footerbar .btn:only-child{grid-column:1/-1}
}
@media(max-width:380px){
 .brand h1{font-size:14px}
 .card .content{padding:16px 14px}
 .footerbar{padding:12px 10px}
 .mobile-menu{padding:10px 12px}
}

/* Layout hotfix: prevent sidebar and content overlap on narrow viewports */
.shell{align-items:start;min-height:0}
.sidebar{align-self:start;min-height:0}
.card{align-self:start;min-width:0}
@media(max-width:1200px){
 .shell{display:flex!important;flex-direction:column!important;gap:12px!important;min-height:0!important}
 .sidebar{position:relative!important;top:auto!important;width:100%!important;height:auto!important;max-height:none!important;overflow:visible!important;z-index:5}
 .sidebar .head{display:flex!important;align-items:center;justify-content:space-between;gap:12px}
 .sidebar .head .hint{display:none!important}
 .mobile-menu{display:inline-flex!important}
 .sidebar .nav{display:none!important}
 .sidebar.is-open .nav{display:flex!important;max-height:min(65dvh,520px);overflow-y:auto}
 .card{width:100%!important;position:relative!important;z-index:1}
 .grid.two,.grid.three{grid-template-columns:minmax(0,1fr)!important}
 .grid>[style*="grid-column"]{grid-column:auto!important}
}

/* Experience refinement: clean editorial hierarchy and page journey */
:root{--radius:16px;--radius2:12px}
.topbar{padding:4px 2px 8px}
.brand .badge{font-family:"Orbitron",sans-serif;font-size:13px;letter-spacing:.06em}
.card{position:relative}
.card:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,#00AEEF,rgba(0,174,239,.14) 65%,transparent);pointer-events:none}
.kicker{color:#83dfff;font-weight:700;font-size:11px;letter-spacing:.17em}
.content h2{margin:12px 0 18px}
.content h3{font-size:clamp(13px,1.5vw,16px)}
.content p{line-height:1.75}
.box{transition:border-color .18s ease,background .18s ease}
.box:hover{border-color:rgba(0,174,239,.34);background:#202832}
.nav a{transition:background .15s ease,border-color .15s ease,color .15s ease}
.nav a:hover{background:rgba(0,174,239,.075);color:#E8EDF2}
.nav a .dot{flex:0 0 9px}
.btn{font-family:var(--font);font-weight:650}
.btn[data-next]{border-color:rgba(0,174,239,.42);background:rgba(0,174,239,.10);color:#E8EDF2}
.journey{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:0 2px}
.journey-label{font-size:11px;color:var(--muted);font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.journey-count{font-size:12px;color:#8fdef8;font-variant-numeric:tabular-nums}
.journey-track{height:3px;width:100%;background:#29323b;border-radius:99px;overflow:hidden}
.journey-fill{height:100%;background:#00AEEF;border-radius:99px;transition:width .2s ease}
.mobile-current{display:none;color:#9adcf2;font-size:12px;margin-left:auto;min-width:0;max-width:44%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.site-footer{margin:24px 4px 4px;padding:16px 0 4px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:11px}
.site-footer a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:1200px){
 .mobile-current{display:block}
 .sidebar .head .title{margin:0}
 .sidebar .head{gap:8px}
 .mobile-menu{flex:0 0 auto}
}
@media(max-width:420px){
 .sidebar .head .title{font-size:12px}
 .mobile-current{max-width:36%}
 .mobile-menu{font-size:13px}
 .content h2{font-size:clamp(22px,7vw,30px)}
 .journey{margin-bottom:10px}
}

/* Desktop refinement: restore a true two-column workspace above tablet width.
   Mobile and tablet layout rules remain unchanged. */
@media (min-width:1201px){
 .wrap{max-width:1480px;padding:32px clamp(24px,3vw,48px) 40px}
 .topbar{margin-bottom:22px;padding:8px 4px 16px;border-bottom:1px solid rgba(192,192,192,.12)}
 .brand{gap:14px}
 .brand .badge{width:46px;height:46px;font-size:15px}
 .brand h1{font-size:19px}
 .brand .sub{font-size:13px}
 .shell{display:grid;grid-template-columns:minmax(250px,280px) minmax(0,1fr);gap:24px;align-items:start}
 .sidebar{position:sticky;top:24px;max-height:calc(100dvh - 48px);overflow:auto;scrollbar-width:thin;box-shadow:0 12px 36px rgba(0,0,0,.18)}
 .sidebar .head{padding:19px 18px 15px}
 .sidebar .head .title{font-size:14px}
 .sidebar .head .hint{line-height:1.5}
 .nav{padding:12px;gap:3px}
 .nav a{padding:11px 12px;border-radius:10px;font-size:13px;line-height:1.35}
 .card{grid-column:2;min-width:0;border-radius:18px}
 .card .content{padding:clamp(30px,3.5vw,54px)}
 .content h2{font-size:clamp(30px,2.7vw,42px);max-width:23ch;line-height:1.18;margin-bottom:22px}
 .content>p{max-width:76ch}
 .content p{line-height:1.8}
 .grid{gap:16px}
 .grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
 .grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
 .box{padding:22px;min-width:0}
 .box h3{font-size:15px}
 .footerbar{padding:17px 26px}
 .journey{padding:20px 26px 14px;margin:0;border-bottom:1px solid var(--line)}
 .journey-track{height:4px}
 .site-footer{margin-top:32px}
}
@media (min-width:1201px) and (max-width:1360px){
 .shell{grid-template-columns:minmax(225px,250px) minmax(0,1fr);gap:18px}
 .card .content{padding:30px}
}

/* Agreements Center and orientation refinements */
@media (min-width:1201px){.card .content .journey{margin:-12px 0 22px;padding:0 0 18px;border-bottom:1px solid var(--line)}}
@media (max-width:1200px){.card .content .journey{margin:0 0 18px;padding:0 0 16px;border-bottom:1px solid var(--line)}}
.card .content .journey .journey-track{flex-basis:100%}
.box a.btn{margin-top:10px}
a:not(.btn):focus-visible{outline:2px solid var(--focus);outline-offset:3px}
@media(max-width:640px){.box a.btn{display:flex;width:100%;white-space:normal;text-align:center}.content .callout{overflow-wrap:anywhere}}