:root{
  --void: #0A0518;
  --void-rgb: 10,5,24;
  --navy: #130A2C;
  --navy-2: #1B1042;
  --gold: #F0A500;
  --gold-dim: #B87F00;
  --gold-hover: #F2C876;
  --purple: #8250FF;
  --purple-2: #3A1A7A;
  --heading: #EDEAE3;
  --text: #EDEAE3;
  --muted: #8B93A8;
  --line: rgba(237,234,227,0.10);
  --star: 237,234,227;
  --shadow-rgb: 200,170,255;
}
[data-theme="light"]{
  --void: #F3F1FB;
  --void-rgb: 243,241,251;
  --navy: #E8E3F7;
  --navy-2: #DED6F4;
  --gold: #B87000;
  --gold-dim: #8C5600;
  --gold-hover: #9C6300;
  --purple: #5B3FBF;
  --purple-2: #2A0D5E;
  --heading: #2A0D5E;
  --text: #14102B;
  --muted: #5B5670;
  --line: rgba(20,16,43,0.12);
  --star: 20,16,43;
  --shadow-rgb: 100,65,195;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--void);
  color:var(--text);
  font-family:'Inter',sans-serif;
  overflow-x:hidden;
}
body, nav, main, section, footer, .theme-toggle, .service-card, .btn-ghost{
  transition:background-color .3s ease, color .3s ease, border-color .3s ease;
}
::selection{background:var(--gold);color:var(--void);}
a{color:inherit;text-decoration:none;}

nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:flex-end;
  padding:22px 5vw;
  background:linear-gradient(180deg, rgba(var(--void-rgb),0.92), rgba(var(--void-rgb),0));
  backdrop-filter:blur(6px);
  transition:background-color .3s ease;
}
.page-main .nav-links{display:flex;gap:36px;font-size:14px;color:var(--muted);align-items:center;}
.page-main .nav-links a:hover{color:var(--gold);}

.theme-toggle{
  width:34px;height:34px;border-radius:50%;
  border:1px solid var(--line);background:transparent;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--text);
  transition:border-color .2s ease, color .2s ease;
}
.theme-toggle:hover{border-color:var(--gold-dim);color:var(--gold);}
.theme-toggle svg{width:16px;height:16px;}
.theme-toggle .icon-sun{display:none;}
[data-theme="light"] .theme-toggle .icon-sun{display:block;}
[data-theme="light"] .theme-toggle .icon-moon{display:none;}

.mark-wrap{margin-bottom:30px;}
.mark-wrap svg{width:clamp(260px, 34vw, 520px);height:auto;display:block;}
.mark-wrap .logo-light{display:none;}
[data-theme="light"] .mark-wrap .logo-dark{display:none;}
[data-theme="light"] .mark-wrap .logo-light{display:block;}

h1{
  font-family:'Space Grotesk',sans-serif;
  font-weight:600;
  font-size:clamp(36px, 5.6vw, 72px);
  line-height:1.06;
  letter-spacing:-0.01em;
  max-width:20ch;
  color:var(--heading);
}
h1 .accent{color:var(--gold);}
.tagline{
  margin-top:22px;
  font-size:clamp(15px,1.7vw,18px);
  color:var(--muted);
  max-width:54ch;
  line-height:1.6;
}

.contact .open-form{
  font-family:'Space Grotesk',sans-serif;
  font-weight:600;
  font-size:clamp(17px,2.1vw,22px);
  color:var(--gold);
  border:1px solid var(--gold-dim);
  border-radius:999px;
  padding:11px 22px;
  background:transparent;
  cursor:pointer;
  transition:color .2s ease, border-color .2s ease, transform .2s ease;
}
.contact .open-form:hover{
  color:var(--gold-hover);
  border-color:var(--gold-hover);
  transform:translateY(-1px);
}
.contact .direct-email{
  display:block;
  margin-top:14px;
  font-size:14px;
  color:var(--muted);
}
.contact .direct-email:hover{color:var(--gold-dim);}

.contact-modal{
  position:fixed;
  inset:0;
  z-index:250;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(6,3,18,0.75);
  backdrop-filter:blur(7px);
}
.contact-modal[aria-hidden="false"]{display:flex;}
.modal-panel{
  width:min(680px, 100%);
  max-height:92vh;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:20px;
  background:linear-gradient(165deg, rgba(var(--void-rgb),0.96), rgba(var(--void-rgb),0.88));
  box-shadow:0 24px 58px rgba(0,0,0,0.45);
  padding:22px;
  text-align:left;
}
.modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.modal-head h2{
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(24px, 3vw, 30px);
  line-height:1.15;
  color:var(--heading);
}
.modal-head p{
  margin-top:6px;
  font-size:14px;
  color:var(--muted);
  max-width:none;
}
.close-modal{
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid var(--line);
  background:transparent;
  color:var(--text);
  font-size:20px;
  line-height:1;
  cursor:pointer;
}
.close-modal:hover{color:var(--gold);border-color:var(--gold-dim);}

.contact-form{
  margin-top:16px;
  display:grid;
  gap:12px;
  grid-template-columns:1fr 1fr;
}
.form-group{display:flex;flex-direction:column;gap:6px;}
.form-group.full{grid-column:1 / -1;}
.form-group label{
  font-size:13px;
  letter-spacing:0.02em;
  color:var(--heading);
}
.form-group input,
.form-group select,
.form-group textarea{
  width:100%;
  font:inherit;
  color:var(--text);
  border:1px solid var(--line);
  border-radius:11px;
  background:rgba(var(--void-rgb),0.75);
  padding:11px 12px;
  outline:none;
}
.form-group textarea{
  min-height:124px;
  resize:vertical;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  border-color:var(--gold-dim);
  box-shadow:0 0 0 2px rgba(240,165,0,0.16);
}
.form-actions{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding-top:4px;
}
.btn-modal{
  font:inherit;
  border-radius:999px;
  border:1px solid var(--line);
  padding:10px 18px;
  cursor:pointer;
  background:transparent;
  color:var(--text);
}
.btn-modal.primary{
  border-color:var(--gold-dim);
  color:var(--gold);
}
.btn-modal:hover{border-color:var(--gold-dim);}

body.modal-open{overflow:hidden;}

[data-theme="light"] .modal-panel{
  background:linear-gradient(165deg, rgba(243,241,251,0.98), rgba(232,227,247,0.94));
}

.page-main .hero{
  position:relative;
  min-height:100vh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
  padding:150px 5vw 130px;
  isolation:isolate;
}
.page-main #starfield{
  position:absolute;inset:0;width:100%;height:100%;z-index:-1;
  opacity:0.55;
}
.page-main .hero::after{
  content:'';position:absolute;inset:0;z-index:-1;
  background:radial-gradient(ellipse at 50% 40%, rgba(var(--void-rgb),0) 0%, var(--void) 78%);
}
.page-main .tagline{max-width:52ch;}
.page-main .hero-cta{
  margin-top:36px;display:flex;gap:16px;flex-wrap:wrap;justify-content:center;
}
.page-main .btn{
  font-family:'Inter',sans-serif;font-weight:600;font-size:14.5px;
  padding:14px 28px;border-radius:2px;
  border:1px solid transparent;
  transition:all .2s ease;
}
.page-main .btn-primary{background:var(--gold);color:var(--void);}
.page-main .btn-primary:hover{background:var(--gold-hover);}
.page-main .btn-ghost{border-color:var(--line);color:var(--text);}
.page-main .btn-ghost:hover{border-color:var(--gold-dim);color:var(--gold);}
.page-main section{padding:110px 5vw;position:relative;}
.page-main .section-inner{max-width:1100px;margin:0 auto;}
.page-main h2{
  font-family:'Space Grotesk',sans-serif;font-weight:600;
  font-size:clamp(28px,3.4vw,40px);letter-spacing:-0.01em;max-width:24ch;
  color:var(--heading);
}
.page-main .services{border-top:1px solid var(--line);}
.page-main .service-grid{
  margin-top:56px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.page-main .service-card{
  background:var(--void);padding:44px 34px;
  display:flex;flex-direction:column;gap:18px;
  transition:background .25s ease;
}
.page-main .service-card:hover{background:var(--navy);}
.page-main .service-card svg{width:34px;height:34px;}
.page-main .service-card svg *{stroke:var(--gold);}
.page-main .service-card svg circle{fill:var(--gold);}
.page-main .service-card h3{
  font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:19px;
}
.page-main .service-card p{color:var(--muted);font-size:14.5px;line-height:1.65;}
.page-main .about{border-top:1px solid var(--line);}
.page-main .about-grid{
  display:grid;grid-template-columns:0.9fr 1.1fr;gap:80px;align-items:start;
}
.page-main .about p{
  color:var(--muted);font-size:16px;line-height:1.75;margin-top:20px;
}
.page-main .about p strong{color:var(--text);font-weight:600;}
.page-main .fact-list{margin-top:36px;display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line);}
.page-main .fact-row{
  display:flex;justify-content:space-between;gap:24px;padding:15px 0;
  border-bottom:1px solid var(--line);
  font-size:14px;
}
.page-main .fact-row span:first-child{color:var(--muted);}
.page-main .fact-row span:last-child{color:var(--gold);text-align:right;}
.page-main .contact{border-top:1px solid var(--line);text-align:center;}
.page-main .contact h2{margin:0 auto;}
.page-main .contact .tagline{margin-left:auto;margin-right:auto;}
.page-main .contact-cta{margin-top:40px;}
.page-main footer{
  border-top:1px solid var(--line);
  padding:32px 5vw;
  display:flex;justify-content:space-between;align-items:center;
  font-size:13px;color:var(--muted);
  flex-wrap:wrap;gap:12px;
}

.page-comingsoon{min-height:100vh;}
.page-comingsoon main{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:130px 5vw 80px;
  background:radial-gradient(ellipse at 50% 35%, rgba(var(--void-rgb),0) 0%, var(--void) 78%);
}
.page-comingsoon h1{
  font-size:clamp(32px, 5.4vw, 64px);
  line-height:1.08;
}
.page-comingsoon .contact{
  margin-top:34px;
  padding-top:28px;
  border-top:1px solid var(--line);
}
.page-comingsoon footer{
  border-top:1px solid var(--line);
  padding:24px 5vw;
  text-align:center;
  font-size:12.5px;
  color:var(--muted);
}

.page-projects .projects-nav{
  width:min(1200px, 100%);
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.page-projects .nav-back{
  color:var(--muted);
  font-size:14px;
  border-bottom:1px solid transparent;
}
.page-projects .nav-back:hover{color:var(--gold);border-bottom-color:var(--gold-dim);}
.projects-nav-actions{display:flex;align-items:center;gap:10px;}
.account-pill{
  border:1px solid var(--line);
  border-radius:999px;
  padding:7px 12px;
  font-size:12px;
  color:var(--muted);
  max-width:240px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.projects-main{
  min-height:100vh;
  padding:124px 5vw 72px;
  max-width:1240px;
  margin:0 auto;
}
.projects-hero{
  background:linear-gradient(150deg, rgba(130,80,255,0.12), rgba(240,165,0,0.08));
  border:1px solid var(--line);
  border-radius:18px;
  padding:24px;
}
.projects-hero .eyebrow{
  font-size:12px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--gold);
}
.page-projects .projects-hero h1{
  margin-top:6px;
  font-size:clamp(28px, 4vw, 44px);
  max-width:none;
}
.projects-toolbar{
  margin-top:22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.projects-count{font-size:14px;color:var(--muted);}

.btn-project{
  font:inherit;
  border-radius:999px;
  border:1px solid var(--line);
  padding:10px 16px;
  cursor:pointer;
  background:transparent;
  color:var(--text);
}
.btn-project.primary{
  border-color:var(--gold-dim);
  color:var(--gold);
}
.btn-project.ghost:hover,
.btn-project.primary:hover{border-color:var(--gold-dim);}
.btn-project:disabled{opacity:0.55;cursor:not-allowed;}

.auth-gate{
  margin-top:28px;
  border:1px dashed var(--line);
  border-radius:14px;
  padding:24px;
  text-align:center;
  background:rgba(var(--void-rgb),0.42);
}
.auth-gate h2{
  max-width:none;
  font-size:clamp(22px, 2.8vw, 30px);
}
.auth-gate p{margin-top:10px;color:var(--muted);}
.auth-note{font-size:13px;}
.auth-message{
  margin-top:12px;
  color:#ffb3b3;
  font-size:14px;
}

.projects-area{margin-top:24px;}
.projects-grid{
  display:grid;
  gap:14px;
  grid-template-columns:repeat(3, minmax(0, 1fr));
}

.project-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:16px;
  background:linear-gradient(160deg, rgba(var(--void-rgb),0.95), rgba(var(--void-rgb),0.84));
  display:flex;
  flex-direction:column;
  gap:12px;
}
.project-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;}
.project-head h3{
  font-family:'Space Grotesk',sans-serif;
  font-size:20px;
  line-height:1.2;
}
.project-customer{font-size:14px;color:var(--muted);}

.badge{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.06em;
  border:1px solid var(--line);
  padding:5px 8px;
  border-radius:999px;
  white-space:nowrap;
}
.badge-planning{color:#8bb5ff;}
.badge-in-progress{color:#f2c876;}
.badge-at-risk{color:#ffd266;}
.badge-blocked{color:#ff9a9a;}
.badge-complete{color:#9be39b;}

.project-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.project-meta dt{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:0.05em;}
.project-meta dd{font-size:13px;margin-top:2px;}

.progress-label{display:flex;justify-content:space-between;font-size:13px;}
.progress-bar{
  margin-top:6px;
  width:100%;
  height:8px;
  border-radius:999px;
  background:rgba(255,255,255,0.08);
  overflow:hidden;
}
.progress-bar span{display:block;height:100%;}
.progress-bar .is-early{background:#6ba8ff;}
.progress-bar .is-mid{background:#e8b85c;}
.progress-bar .is-strong{background:#9ad387;}
.progress-bar .is-complete{background:#7fd87f;}

.project-notes strong{font-size:12px;letter-spacing:0.04em;text-transform:uppercase;color:var(--muted);}
.project-notes p{margin-top:4px;font-size:14px;line-height:1.5;color:var(--text);}

.project-foot{
  margin-top:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  color:var(--muted);
  font-size:12px;
}
.project-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.edit-project,
.delete-project{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid var(--line);
  color:var(--text);
  background:rgba(255,255,255,0.04);
  border-radius:9999px;
  padding:7px 14px;
  min-width:74px;
  font:inherit;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.02em;
  text-align:center;
  line-height:1;
  cursor:pointer;
  transition:all .2s ease;
}
.edit-project{
  border-color:#e8b85c;
  background:transparent;
  color:#ffd893;
  box-shadow:0 0 0 1px rgba(232,184,92,0.28) inset;
}
.edit-project:hover{
  border-color:#ffd893;
  background:transparent;
  color:#ffe8bf;
  box-shadow:0 0 0 1px rgba(255,216,147,0.5) inset, 0 0 14px rgba(232,184,92,0.26);
  transform:translateY(-1px);
}
[data-theme="light"] .edit-project{
  border-color:#8c5600;
  color:#6f4300;
  box-shadow:0 0 0 1px rgba(140,86,0,0.2) inset;
}
[data-theme="light"] .edit-project:hover{
  border-color:#b87000;
  color:#4f2f00;
  box-shadow:0 0 0 1px rgba(184,112,0,0.28) inset, 0 0 0 2px rgba(184,112,0,0.14);
}
.delete-project{
  border:1px solid var(--line);
  color:#ff9a9a;
  background:transparent;
}
.delete-project:hover{
  border-color:#ff9a9a;
  background:rgba(255,154,154,0.12);
  transform:translateY(-1px);
}

.empty-state{
  text-align:center;
  border:1px dashed var(--line);
  border-radius:14px;
  padding:34px 18px;
  color:var(--muted);
}
.empty-state h3{
  font-family:'Space Grotesk',sans-serif;
  color:var(--heading);
}

.project-panel textarea{min-height:92px;}

@media(max-width:820px){
  .page-main .service-grid{grid-template-columns:1fr;}
  .page-main .about-grid{grid-template-columns:1fr;gap:40px;}
  .projects-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:700px){
  .page-main .nav-links a{display:none;}
  .account-pill{display:none;}
}
@media(max-width:680px){
  .page-comingsoon nav{padding:16px 6vw;}
  .page-comingsoon main{padding:112px 6vw 70px;}
  .page-comingsoon .mark-wrap svg{width:clamp(220px, 72vw, 360px);}
  .projects-main{padding:106px 6vw 56px;}
  .projects-grid{grid-template-columns:1fr;}
  .projects-nav{align-items:flex-start;}
  .contact-form{grid-template-columns:1fr;}
  .modal-panel{padding:18px 16px;}
  .form-actions{justify-content:stretch;}
  .form-actions .btn-modal{flex:1;}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important;}
}