/* Phoenix Immersion — brochure-aligned
   - Navigation bar uses brochure color
   - Everything else is white, except clickable elements/buttons
   Change nav color here if needed.
*/
:root{
  --nav: #C02830;
  --navText: #ffffff;
  --navHover: #8E1B22;

  --link: #C02830;
  --btn: #C02830;
  --btnHover: #8E1B22;

  --bg:#ffffff;
  --paper:#ffffff;
  --ink:#1f1f1f;
  --muted:#666666;
  --border:#e2e2e2;
  --border2:#bdbdbd;
  --warn:#fff7d6;
  --max:1100px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
a{color:var(--link)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 14px}

/* Top utility bar (white) */
.topbar{background:#fff;border-bottom:1px solid var(--border);font-size:12px}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;padding:8px 0;gap:10px}
.topbar-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.topbar-right .sep{color:#888}
.lang-btn{
  padding:6px 10px;border:1px solid var(--border2);background:#fff;cursor:pointer;
  font-size:12px;font-weight:800
}
.lang-btn.active{background:var(--btn);color:#fff;border-color:var(--btn)}

/* Header (white) */
.header{background:#fff;border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.logo{height:46px;width:auto;display:block}
.tagline{color:var(--muted);font-size:12px}

/* Horizontal nav bar (brochure color) */
.navbar{background:var(--nav);}
.navbar-inner{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0}
.nav-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

.nav-link{
  display:inline-block;
  padding:9px 12px;
  text-decoration:none;
  color:var(--navText);
  font-size:13px;
  font-weight:800;
  border:1px solid rgba(255,255,255,0.18);
  background:transparent;
}
.nav-link:hover{background:rgba(255,255,255,0.12)}
.nav-link.active{background:rgba(255,255,255,0.18)}
.nav-link.apply{
  background:#fff;
  color:var(--nav);
  border-color:#fff;
}
.nav-link.apply:hover{background:#f3f3f3}

/* Mobile menu button */
.menu-btn{
  display:none;
  border:1px solid rgba(255,255,255,0.35);
  background:transparent;
  color:var(--navText);
  padding:9px 12px;
  font-weight:900;
  cursor:pointer;
}
.menu-btn:hover{background:rgba(255,255,255,0.12)}

/* Main */
.main{padding:14px 0}
.panel{background:#fff;border:1px solid var(--border);margin-bottom:12px}
.panel-title{padding:10px 12px;font-weight:900;font-size:14px;background:#fff;border-bottom:1px solid var(--border)}
.panel-body{padding:12px;font-size:13px;line-height:1.65}

.notice{border:1px dashed var(--border2);background:var(--warn);padding:10px;margin-bottom:10px}
.table{width:100%;border-collapse:collapse;font-size:13px;background:#fff}
.table th,.table td{border:1px solid var(--border);padding:8px 10px;text-align:left;vertical-align:top}
.table th{background:#fff;font-weight:900}

.bullets{margin:6px 0 0 18px}
.bullets li{margin:4px 0}

/* Buttons */
.btn{
  display:inline-block;
  padding:9px 12px;
  border:1px solid var(--btn);
  background:var(--btn);
  color:#fff;
  text-decoration:none;
  font-weight:900;
  font-size:13px;
}
.btn:hover{background:var(--btnHover);border-color:var(--btnHover)}
.btn-secondary{
  background:#fff;
  color:var(--btn);
}
.btn-secondary:hover{background:#f5f5f5;border-color:var(--btn)}

hr.sep{border:none;border-top:1px solid var(--border);margin:12px 0}

/* Iframe container */
.iframe-wrap{border:1px solid var(--border);background:#fff}
.iframe-wrap iframe{width:100%;height:820px;border:0}

/* Footer */
.footer{margin:12px 0 18px;background:#fff;border:1px solid var(--border)}
.footer-inner{padding:10px 12px;font-size:12px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.hint{font-size:12px;color:var(--muted)}

/* Responsive */
@media (max-width: 900px){
  .nav-links{gap:6px}
  .nav-link{padding:9px 10px}
}
@media (max-width: 720px){
  .header-inner{flex-direction:column;align-items:flex-start}
  .menu-btn{display:inline-block}
  .nav-links{
    display:none;
    width:100%;
    flex-direction:column;
    gap:0;
    margin-top:10px;
  }
  .nav-links.open{display:flex}
  .nav-link{width:100%}
}