:root{
  --bg:            #0A0C10;
  --bg-elevated:   #0F1218;
  --surface:       #171B24;
  --surface-hover: #1D222D;
  --border:        #262B36;
  --border-bright: #363D4C;

  --text-primary:   #EDEFF3;
  --text-secondary: #9BA3B4;
  --text-muted:     #6B7180;

  --accent-gold:      #E8B34D;
  --accent-gold-dim:  rgba(232,179,77,0.14);
  --accent-teal:      #2FA79B;
  --accent-teal-dim:  rgba(47,167,155,0.14);

  --font-display: 'Space Grotesk', sans-serif;
  --font-body:    'Inter', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;

  --header-h: 76px;
  --ease: cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{ box-sizing:border-box; }
* {
  scrollbar-width: thin;
  scrollbar-color: var(--surface-hover) var(--bg);
}
html{ scroll-behavior:smooth; }
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: var(--bg);
  border-left: 1px solid var(--border);
}

::-webkit-scrollbar-thumb {
  background: var(--surface-hover);
  border: 2px solid var(--bg);
  border-radius: var(--radius-sm);
  transition: background .2s var(--ease);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--border-bright);
}
body{
  margin:0;
  background:var(--bg);
  color:var(--text-primary);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
body.no-scroll{ overflow:hidden; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.01ms !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; }
}

:focus-visible{
  outline:2px solid var(--accent-gold);
  outline-offset:2px;
}

.loader{
  position:fixed;
  inset:0;
  z-index:999;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:18px;
  background:var(--bg);
  transition:opacity .5s var(--ease), visibility .5s var(--ease);
}
.loader.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.loader-mark{
  width:56px;
  height:56px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--accent-gold-dim);
  border:1px solid var(--border-bright);
  font-family:var(--font-display);
  font-weight:700;
  font-size:24px;
  color:var(--accent-gold);
  animation:loaderPulse 1.4s ease-in-out infinite;
}
@keyframes loaderPulse{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.08); }
}
.loader-bar{
  width:140px;
  height:3px;
  border-radius:4px;
  background:var(--border);
  overflow:hidden;
}
.loader-bar span{
  display:block;
  height:100%;
  width:40%;
  background:linear-gradient(90deg, var(--accent-teal), var(--accent-gold));
  animation:loaderSweep 1.1s ease-in-out infinite;
}
@keyframes loaderSweep{
  0%{ transform:translateX(-100%); }
  100%{ transform:translateX(350%); }
}
.loader-text{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin:0;
}

.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

.section-inner{
  max-width:1180px;
  margin:0 auto;
  padding:0 32px;
}
.eyebrow{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--accent-teal);
  margin:0 0 14px;
}
.section-title{
  font-family:var(--font-display);
  font-weight:600;
  font-size:clamp(28px,3.6vw,40px);
  line-height:1.15;
  margin:0 0 48px;
  max-width:640px;
  letter-spacing:-0.01em;
}

.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:13px 24px;
  border-radius:var(--radius-sm);
  font-size:14.5px;
  font-weight:600;
  white-space:nowrap;
  transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
}
.btn-primary{
  background:var(--accent-gold);
  color:#15130B;
}
.btn-primary:hover{ background:#f0c064; transform:translateY(-1px); }
.btn-ghost{
  border:1px solid var(--border-bright);
  color:var(--text-primary);
}
.btn-ghost:hover{ border-color:var(--accent-teal); background:var(--accent-teal-dim); }

.site-header{
  position:fixed;
  top:0; left:0; right:0;
  height:var(--header-h);
  z-index:100;
  border-bottom:1px solid var(--border);
}
.site-header::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:rgba(10,12,16,.72);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
}
.header-inner{
  max-width:1280px;
  margin:0 auto;
  height:100%;
  padding:0 28px;
  display:flex;
  align-items:center;
  gap:28px;
}
.logo{
  display:flex;
  align-items:center;
  gap:10px;
  font-family:var(--font-display);
  font-weight:600;
  font-size:18.5px;
  color:var(--text-primary);
  margin-right:auto;
}
.logo-accent{ color:var(--accent-gold); }
.logo-mark{ display:flex; }

.main-nav{ display:flex; }
.nav-list{ display:flex; align-items:center; gap:4px; }
.nav-item{ position:relative; }
.nav-item > a,
.nav-link{
  display:flex;
  align-items:center;
  gap:6px;
  padding:10px 14px;
  border-radius:var(--radius-sm);
  font-size:14.5px;
  font-weight:500;
  color:var(--text-secondary);
  transition:color .15s var(--ease), background .15s var(--ease);
}
.nav-item > a:hover,
.nav-link:hover,
.nav-item.is-open > .nav-link{
  color:var(--text-primary);
  background:var(--surface);
}
.chev{ transition:transform .2s var(--ease); color:var(--text-muted); }
.nav-item.is-open > .nav-link .chev{ transform:rotate(180deg); }

.dropdown{
  position:absolute;
  top:calc(100% + 10px);
  left:0;
  min-width:250px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:8px;
  box-shadow:0 20px 40px -12px rgba(0,0,0,.55);
  opacity:0;
  visibility:hidden;
  transform:translateY(6px);
  transition:opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}
.nav-item.is-open > .dropdown{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.dropdown-item{ position:relative; }
.dropdown-item > a,
.dropdown-item > button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  padding:10px 12px;
  border-radius:var(--radius-sm);
  font-size:14px;
  color:var(--text-secondary);
  text-align:left;
}
.dropdown-item > a:hover,
.dropdown-item > button:hover,
.dropdown-item.is-open > button{
  background:var(--surface-hover);
  color:var(--text-primary);
}
.chev-right{ color:var(--text-muted); flex-shrink:0; }

.submenu{
  position:absolute;
  top:-8px;
  left:calc(100% + 8px);
  min-width:220px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:8px;
  box-shadow:0 20px 40px -12px rgba(0,0,0,.55);
  opacity:0;
  visibility:hidden;
  transform:translateX(6px);
  transition:opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}
.dropdown-item.is-open > .submenu{
  opacity:1;
  visibility:visible;
  transform:translateX(0);
}
.submenu li a{
  display:block;
  padding:10px 12px;
  border-radius:var(--radius-sm);
  font-size:14px;
  color:var(--text-secondary);
}
.submenu li a:hover{ background:var(--surface-hover); color:var(--text-primary); }

@media (hover:hover) and (pointer:fine){
  .nav-item.has-dropdown:hover > .dropdown{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
  }
  .dropdown-item.has-submenu:hover > .submenu{
    opacity:1;
    visibility:visible;
    transform:translateX(0);
  }
}

.nav-cta{ margin-left:6px; }

.menu-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:40px; height:40px;
  border-radius:var(--radius-sm);
  z-index:101;
}
.menu-toggle span{
  width:20px; height:2px;
  background:var(--text-primary);
  transition:transform .25s var(--ease), opacity .25s var(--ease);
}
.menu-toggle.is-active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.menu-toggle.is-active span:nth-child(2){ opacity:0; }
.menu-toggle.is-active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.hero{
  position:relative;
  min-height:92vh;
  display:flex;
  align-items:center;
  padding:calc(var(--header-h) + 40px) 32px 80px;
  overflow:hidden;
  background:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(47,167,155,.10), transparent 60%),
    var(--bg);
}
.hero-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:.55;
  z-index:0;
}
.hero-inner{
  position:relative;
  z-index:1;
  max-width:1180px;
  margin:0 auto;
  width:100%;
}
.hero-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(38px,6vw,64px);
  line-height:1.08;
  letter-spacing:-0.02em;
  margin:0 0 24px;
  max-width:760px;
}
.accent-underline{ color:var(--accent-gold); }
.hero-sub{
  font-size:17.5px;
  color:var(--text-secondary);
  max-width:560px;
  margin:0 0 36px;
}
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }

.section{ padding:100px 0; }
.section-alt{ background:var(--bg-elevated); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }

.card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:20px;
}
.service-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:28px 24px;
  transition:border-color .2s var(--ease), transform .2s var(--ease);
}
.service-card:hover{ border-color:var(--border-bright); transform:translateY(-3px); }
.card-icon{
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  background:var(--accent-gold-dim);
  color:var(--accent-gold);
  margin-bottom:18px;
}
.service-card h3{
  font-family:var(--font-display);
  font-size:18px;
  font-weight:600;
  margin:0 0 10px;
}
.service-card p{ font-size:14.5px; color:var(--text-secondary); margin:0; }

.mission-inner{ max-width:760px; }
.mission-text{ font-size:16.5px; color:var(--text-secondary); }

.connect-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:20px;
}
.connect-card{
  display:block;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:28px 24px;
  transition:border-color .2s var(--ease), transform .2s var(--ease), background .2s var(--ease);
}
.connect-card:hover{
  border-color:var(--accent-teal);
  background:var(--surface-hover);
  transform:translateY(-3px);
}
.connect-icon{
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  background:var(--accent-teal-dim);
  color:var(--accent-teal);
  margin-bottom:18px;
}
.connect-card h3{
  font-family:var(--font-display);
  font-size:17px;
  font-weight:600;
  margin:0 0 10px;
}
.connect-card p{ font-size:14px; color:var(--text-secondary); margin:0; }

.team-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:20px;
  max-width:640px;
}
.team-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px 26px;
  text-align:center;
  transition:border-color .2s var(--ease), transform .2s var(--ease);
}
.team-card:hover{ border-color:var(--border-bright); transform:translateY(-3px); }
.team-avatar{
  width:64px; height:64px;
  margin:0 auto 18px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-display);
  font-weight:600;
  font-size:20px;
  background:var(--accent-teal-dim);
  color:var(--accent-teal);
}
.team-card h3{
  font-family:var(--font-display);
  font-size:18px;
  font-weight:600;
  margin:0 0 4px;
}
.team-role{ font-size:13.5px; color:var(--text-muted); margin:0 0 14px; }
.team-email{
  display:block;
  font-size:13.5px;
  color:var(--accent-teal);
  margin-bottom:18px;
  word-break:break-word;
}
.team-email:hover{ text-decoration:underline; }
.team-about{ width:100%; justify-content:center; }

.cta-section{
  padding:100px 0;
  background:linear-gradient(180deg, var(--bg-elevated), var(--bg));
  border-top:1px solid var(--border);
}
.cta-inner{ text-align:center; }
.cta-inner .section-title{ margin:0 auto 16px; }
.cta-sub{ max-width:520px; margin:0 auto 36px; color:var(--text-secondary); font-size:15.5px; }
.cta-inner .hero-actions{ justify-content:center; }

.site-footer{ background:var(--bg-elevated); border-top:1px solid var(--border); padding-top:64px; }
.footer-inner{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:32px;
  padding-bottom:48px;
}
.footer-brand p{ font-size:14px; color:var(--text-muted); margin-top:14px; max-width:280px; }
.footer-col h4{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin:0 0 16px;
}
.footer-col a{ display:block; font-size:14px; color:var(--text-secondary); padding:6px 0; }
.footer-col a:hover{ color:var(--accent-gold); }
.footer-bottom{
  border-top:1px solid var(--border);
  padding:22px 32px;
  text-align:center;
  font-size:13px;
  color:var(--text-muted);
}
.footer-bottom a{ color:var(--text-secondary); }
.footer-bottom a:hover{ color:var(--accent-gold); }

.legal-hero{
  padding:calc(var(--header-h) + 64px) 32px 60px;
  background:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(47,167,155,.10), transparent 60%),
    var(--bg);
  border-bottom:1px solid var(--border);
}
.legal-hero-inner{ max-width:800px; margin:0 auto; }
.legal-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(32px,4.5vw,48px);
  line-height:1.1;
  letter-spacing:-0.02em;
  margin:0 0 14px;
}
.legal-updated{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--text-muted);
  margin:0;
}

.legal-body{ padding:70px 0 100px; }
.legal-inner{ max-width:760px; margin:0 auto; padding:0 32px; }
.legal-inner h2{
  font-family:var(--font-display);
  font-weight:600;
  font-size:22px;
  margin:48px 0 16px;
  letter-spacing:-0.01em;
}
.legal-inner h2:first-child{ margin-top:0; }
.legal-inner p{
  font-size:15.5px;
  color:var(--text-secondary);
  margin:0 0 16px;
}
.legal-inner ul{
  margin:0 0 16px;
  padding-left:20px;
  list-style:disc;
}
.legal-inner li{
  font-size:15.5px;
  color:var(--text-secondary);
  margin-bottom:8px;
  padding-left:4px;
}
.legal-inner strong{ color:var(--text-primary); font-weight:600; }
.legal-inner a{ color:var(--accent-teal); }
.legal-inner a:hover{ text-decoration:underline; }
.legal-note{
  background:var(--surface);
  border:1px solid var(--border);
  border-left:3px solid var(--accent-gold);
  border-radius:var(--radius-md);
  padding:18px 20px;
  margin:0 0 16px;
}
.legal-note p{ margin:0; color:var(--text-secondary); font-size:14.5px; }

/* Profile page additions */
.profile-hero{
  padding:calc(var(--header-h) + 56px) 32px 60px;
  background:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(47,167,155,.10), transparent 60%),
    var(--bg);
  border-bottom:1px solid var(--border);
}
.profile-hero-inner{
  max-width:1180px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:32px;
  flex-wrap:wrap;
}
.profile-avatar-lg{
  width:104px; height:104px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-display);
  font-weight:700;
  font-size:34px;
  background:var(--accent-teal-dim);
  color:var(--accent-teal);
  border:1px solid var(--border-bright);
  flex-shrink:0;
}
.profile-heading{ flex:1; min-width:220px; }
.profile-name{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(30px,4.4vw,46px);
  line-height:1.1;
  letter-spacing:-0.02em;
  margin:0 0 8px;
}
.profile-role{
  font-family:var(--font-mono);
  font-size:13.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--accent-gold);
  margin:0 0 18px;
}
.profile-actions{ display:flex; gap:14px; flex-wrap:wrap; }

.profile-stats{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:20px;
  max-width:820px;
  margin:0 0 8px;
}
.stat-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:22px 22px;
}
.stat-card .stat-value{
  font-family:var(--font-display);
  font-weight:700;
  font-size:24px;
  color:var(--accent-teal);
  margin:0 0 6px;
}
.stat-card .stat-label{
  font-size:13px;
  color:var(--text-muted);
  margin:0;
}

.profile-body{ padding:70px 0 100px; }
.profile-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:40px;
  align-items:start;
}
.profile-main h2{
  font-family:var(--font-display);
  font-weight:600;
  font-size:22px;
  margin:44px 0 16px;
  letter-spacing:-0.01em;
}
.profile-main h2:first-child{ margin-top:0; }
.profile-main p{
  font-size:15.5px;
  color:var(--text-secondary);
  margin:0 0 16px;
}
.skill-tags{ display:flex; flex-wrap:wrap; gap:10px; margin:0 0 8px; }
.skill-tag{
  font-family:var(--font-mono);
  font-size:12.5px;
  padding:8px 14px;
  border-radius:var(--radius-sm);
  background:var(--accent-gold-dim);
  color:var(--accent-gold);
  border:1px solid var(--border);
}
.profile-side{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:26px 24px;
  position:sticky;
  top:calc(var(--header-h) + 24px);
}
.profile-side h3{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin:0 0 18px;
}
.side-link{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 0;
  font-size:14.5px;
  color:var(--text-secondary);
  border-bottom:1px solid var(--border);
}
.side-link:last-child{ border-bottom:none; }
.side-link:hover{ color:var(--accent-teal); }
.side-icon{
  width:30px; height:30px;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  background:var(--accent-teal-dim);
  color:var(--accent-teal);
  flex-shrink:0;
}
.back-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--text-muted);
  margin-bottom:24px;
}
.back-link:hover{ color:var(--accent-gold); }

@media (max-width:900px){
  .footer-inner{ grid-template-columns:1fr 1fr; }
  .profile-grid{ grid-template-columns:1fr; }
  .profile-side{ position:static; }
}

@media (max-width:820px){
  .nav-cta{ display:none; }
  .menu-toggle{ display:flex; }

  .main-nav{
    position:fixed;
    top:0; left:0; right:0; bottom:0;
    background:var(--bg);
    padding:calc(var(--header-h) + 20px) 24px 40px;
    overflow-y:auto;
    transform:translateX(100%);
    transition:transform .3s var(--ease);
    z-index:99;
    visibility:hidden;
  }
  .main-nav.is-open{
    transform:translateX(0);
    visibility:visible;
  }
  .nav-list{ flex-direction:column; align-items:stretch; gap:2px; }
  .nav-item > a, .nav-link{ width:100%; padding:16px 14px; font-size:17px; justify-content:space-between; }

  .dropdown{
    position:static;
    opacity:1; visibility:visible; transform:none;
    display:none;
    box-shadow:none;
    border:none;
    background:var(--bg-elevated);
    margin:4px 0 4px 12px;
  }
  .nav-item.is-open > .dropdown{ display:block; }

  .submenu{
    position:static;
    opacity:1; visibility:visible; transform:none;
    display:none;
    box-shadow:none;
    border:none;
    background:var(--surface);
    margin:4px 0 4px 12px;
  }
  .dropdown-item.is-open > .submenu{ display:block; }

  .footer-inner{ grid-template-columns:1fr; }
}

@media (max-width:520px){
  .section{ padding:72px 0; }
  .profile-hero-inner{ text-align:center; justify-content:center; }
  .profile-actions{ justify-content:center; }
}