/* Mas Caprie — Visual System OS — shared stylesheet */

:root{
  --accent:#F2A81C;
  --bg:#0a0a0b;
  --line:rgba(242,168,28,0.22);
  --line2:rgba(255,255,255,0.08);
  --muted:#8b8b86;
  --text:#F3F2EE;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:#050506;
  color:var(--text);
  font-family:'Archivo',sans-serif;
  overflow-x:hidden;
}
::selection{ background:var(--accent); color:#000; }
a{ color:inherit; }
img{ max-width:100%; display:block; }
input,textarea,select{ font-family:'JetBrains Mono',monospace; }
input::placeholder,textarea::placeholder{ color:#5c5c58; }
button{ font-family:inherit; }
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-thumb{ background:#2a2a26; }

@keyframes pulse{ 0%,100%{ opacity:1 } 50%{ opacity:.35 } }
@keyframes spin3d{ 0%{ transform:rotateY(-16deg) rotateX(5deg) translateY(0) } 50%{ transform:rotateY(-12deg) rotateX(6deg) translateY(-14px) } 100%{ transform:rotateY(-16deg) rotateX(5deg) translateY(0) } }
@keyframes beam{ 0%,100%{ opacity:.4; transform:translateX(-24px) } 50%{ opacity:.85; transform:translateX(24px) } }
@keyframes drift{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-26px) } }
@keyframes glowPulse{ 0%,100%{ opacity:.5 } 50%{ opacity:1 } }
@keyframes eq{ 0%,100%{ transform:scaleY(.35) } 50%{ transform:scaleY(1) } }

/* ---------- page shell ---------- */
.page{
  width:100%;
  max-width:1440px;
  min-width:320px;
  margin:0 auto;
  background:var(--bg);
  color:var(--text);
  font-family:'Archivo',sans-serif;
  position:relative;
  background-image:
    radial-gradient(1200px 600px at 78% 6%, rgba(242,168,28,0.10), transparent 60%),
    radial-gradient(900px 500px at 6% 38%, rgba(242,168,28,0.06), transparent 60%),
    radial-gradient(1000px 550px at 88% 64%, rgba(242,168,28,0.055), transparent 60%),
    radial-gradient(900px 500px at 10% 88%, rgba(242,168,28,0.06), transparent 60%),
    radial-gradient(rgba(255,255,255,0.028) 1px, transparent 1px);
  background-repeat:no-repeat, no-repeat, no-repeat, no-repeat, repeat;
  background-position:0 0, 0 0, 0 0, 0 0, 0 0;
  background-size:auto, auto, auto, auto, 26px 26px;
}

/* ---------- ambient HUD background fx ---------- */
.bg-fx{
  position:fixed; inset:0; z-index:-1;
  overflow:hidden; pointer-events:none;
}
.bg-fx-grid{
  position:absolute; inset:-160px;
  background-image:
    linear-gradient(rgba(242,168,28,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,168,28,0.05) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size:160px 160px, 160px 160px, 32px 32px, 32px 32px;
  animation:bgGridDrift 70s linear infinite;
  will-change:transform;
}
@keyframes bgGridDrift{
  from{ transform:translate3d(0,0,0); }
  to{ transform:translate3d(-160px,-160px,0); }
}
.bg-fx-scan{
  position:absolute; left:0; right:0; top:0; height:220px;
  background:linear-gradient(to bottom, transparent, rgba(242,168,28,0.07), transparent);
  animation:bgScanSweep 9s ease-in-out infinite;
  will-change:transform, opacity;
}
@keyframes bgScanSweep{
  0%{ transform:translateY(-220px); opacity:0; }
  10%{ opacity:1; }
  90%{ opacity:1; }
  100%{ transform:translateY(100vh); opacity:0; }
}
.bg-fx-node{
  position:absolute; left:var(--x); top:var(--y);
  width:4px; height:4px; border-radius:50%;
  background:var(--accent);
  opacity:.25;
  animation:bgNodePulse 4.5s ease-in-out infinite;
  animation-delay:var(--d, 0s);
}
@keyframes bgNodePulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(242,168,28,0.35); opacity:.25; }
  50%{ box-shadow:0 0 14px 4px rgba(242,168,28,0.35); opacity:.8; }
}
.bg-fx-glyph{
  position:absolute; left:var(--x); top:var(--y);
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.08em;
  color:rgba(242,168,28,0.55);
  opacity:0;
  animation:bgGlyphFade 6s ease-in-out infinite;
  animation-delay:var(--d, 0s);
}
@keyframes bgGlyphFade{
  0%,100%{ opacity:0; }
  15%,35%{ opacity:.55; }
  50%{ opacity:0; }
}
@media (max-width:640px){
  .bg-fx{ display:none; }
}
@media (prefers-reduced-motion:reduce){
  .bg-fx-grid{ animation:none; }
  .bg-fx-scan{ display:none; }
  .bg-fx-node, .bg-fx-glyph{ animation:none; opacity:.3; }
}

/* ---------- reveal-on-scroll ---------- */
.reveal{ opacity:0; transform:translateY(46px); transition:opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

/* ---------- announcement bar ---------- */
.ann-bar{
  display:flex; align-items:center; justify-content:space-between;
  padding:9px 40px; background:#060607; border-bottom:1px solid var(--line2);
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em;
  gap:14px; flex-wrap:wrap;
}
.ann-bar .left{ display:flex; align-items:center; gap:14px; color:#c9c9c4; flex-wrap:wrap; }
.ann-bar .badge{ color:var(--accent); font-weight:700; }
.ann-bar .sep{ color:#4a4a48; }
.ann-bar .sub{ color:#9b9b96; }
.ann-bar .cta{ display:flex; align-items:center; gap:8px; color:var(--accent); font-weight:700; text-decoration:none; white-space:nowrap; }

/* ---------- nav ---------- */
.site-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 24px; border-bottom:1px solid var(--line2);
  position:sticky; top:0; z-index:30;
  background:rgba(5,5,6,0.88); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
}
.brand{ display:flex; align-items:center; gap:14px; text-decoration:none; color:inherit; }
.brand-mark{ width:44px; height:44px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; background:#0c0c0e; flex:none; }
.brand-mark img{ width:26px; height:auto; object-fit:contain; }
.site-header .brand-mark{ width:auto; height:52px; border:none; background:none; }
.site-header .brand-mark img{ width:auto; height:100%; object-fit:contain; }
.brand-name{ line-height:1; }
.brand-name .title{ font-family:'Oswald'; font-weight:600; font-size:16px; letter-spacing:.14em; }
.brand-name .subtitle{ font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.24em; color:var(--muted); margin-top:3px; }

.site-nav{ display:flex; align-items:center; gap:28px; font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.12em; }
.site-nav a{ color:#b7b7b2; text-decoration:none; transition:color .15s; }
.site-nav a:hover{ color:#fff; }
.site-nav a.active{ color:var(--accent); }

/* ---- services dropdown ---- */
.nav-dd{ position:relative; }
.nav-dd-btn{ background:none; border:none; padding:0; cursor:pointer; font-family:inherit; font-size:12px; letter-spacing:.12em; color:#b7b7b2; display:flex; align-items:center; gap:6px; transition:color .15s; }
.nav-dd:hover .nav-dd-btn, .nav-dd.open .nav-dd-btn{ color:#fff; }
.nav-dd-btn.active{ color:var(--accent); }
.nav-dd-btn .c{ font-size:9px; transition:transform .22s ease; }
.nav-dd:hover .nav-dd-btn .c, .nav-dd.open .nav-dd-btn .c{ transform:rotate(180deg); }
.nav-dd-menu{ position:absolute; top:100%; left:-20px; padding-top:16px; min-width:265px; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .22s ease, transform .22s ease, visibility .22s; z-index:60; }
.nav-dd:hover .nav-dd-menu, .nav-dd:focus-within .nav-dd-menu, .nav-dd.open .nav-dd-menu{ opacity:1; visibility:visible; transform:none; }
.nav-dd-panel{
  border:1px solid var(--line); border-top:1px solid rgba(242,168,28,.55);
  background:linear-gradient(180deg,rgba(20,20,24,.97),rgba(11,11,13,.97));
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  box-shadow:0 24px 60px rgba(0,0,0,.55); padding:8px;
}
.nav-dd-panel a{ display:flex; flex-direction:column; gap:4px; padding:12px 14px; border-left:2px solid transparent; transition:background .15s, border-color .15s; }
.nav-dd-panel a:hover{ background:rgba(242,168,28,.06); border-left-color:var(--accent); }
.nav-dd-panel a .t{ font-size:11px; letter-spacing:.12em; color:#e6e6e1; transition:color .15s; }
.nav-dd-panel a:hover .t{ color:#fff; }
.nav-dd-panel a.active .t{ color:var(--accent); }
.nav-dd-panel a .s{ font-family:'Archivo',sans-serif; font-size:11.5px; letter-spacing:.02em; color:#8b8b86; }

.lang-toggle{ display:flex; align-items:center; gap:6px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.08em; }
.lang-toggle button{ background:transparent; border:none; cursor:pointer; color:#6f6f69; font-family:'JetBrains Mono',monospace; font-size:11px; padding:0; }
.lang-toggle button.active{ color:var(--accent); }
.lang-toggle .sep{ color:#3a3a38; }

.nav-cta{
  font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.14em; color:var(--text);
  background:transparent; border:1px solid var(--line); padding:12px 22px; cursor:pointer; text-decoration:none;
  transition:background .15s, color .15s, border-color .15s; white-space:nowrap;
}
.nav-cta:hover{ background:var(--accent); color:#000; border-color:var(--accent); }

.hamburger-btn{
  display:none; align-items:center; justify-content:center; width:40px; height:40px;
  background:transparent; border:1px solid var(--line); color:var(--accent); font-size:16px; cursor:pointer;
}

/* mobile menu overlay */
.mobile-menu{
  position:fixed; inset:0; background:#08080a; z-index:40; display:none; flex-direction:column; padding:24px;
}
.mobile-menu.is-open{ display:flex; }
.mobile-menu-top{ display:flex; justify-content:flex-end; }
.mobile-menu-close{ width:40px; height:40px; background:transparent; border:1px solid var(--line); color:var(--accent); font-size:16px; cursor:pointer; }
.mobile-nav{ display:flex; flex-direction:column; gap:6px; margin-top:30px; font-family:'JetBrains Mono',monospace; font-size:18px; letter-spacing:.1em; }
.mobile-nav a{ color:#e6e6e1; text-decoration:none; padding:16px 8px; border-bottom:1px solid var(--line2); }
.mobile-nav a.active{ color:var(--accent); }
.mobile-nav-group{ padding:16px 8px; border-bottom:1px solid var(--line2); display:flex; flex-direction:column; }
.mobile-nav-group .label{ font-size:11px; letter-spacing:.16em; color:#8b8b86; }
.mobile-nav-group a.sub{ border-bottom:none; font-size:15px; padding:14px 0 0 16px; position:relative; }
.mobile-nav-group a.sub::before{ content:'›'; position:absolute; left:2px; color:var(--accent); }
.mobile-lang{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:18px; font-family:'JetBrains Mono',monospace; font-size:13px; letter-spacing:.08em; }
.mobile-lang button{ background:transparent; border:1px solid var(--line2); padding:8px 14px; cursor:pointer; color:#6f6f69; font-family:'JetBrains Mono',monospace; font-size:13px; }
.mobile-lang button.active{ color:var(--accent); border-color:var(--line); }
.mobile-cta{
  display:flex; align-items:center; justify-content:center; gap:10px; font-family:'JetBrains Mono',monospace; font-size:13px;
  letter-spacing:.1em; color:#000; background:var(--accent); border:none; padding:16px 22px; margin-top:26px; cursor:pointer;
  font-weight:700; text-decoration:none;
}

@media (max-width: 860px){
  .site-nav, .nav-cta{ display:none !important; }
  .hamburger-btn{ display:flex !important; }
}

/* ---------- page header (interior pages) ---------- */
.page-header{ padding:64px 40px 40px; border-bottom:1px solid var(--line2); }
.page-header .eyebrow{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.2em; color:var(--accent); }
.page-header h1{ font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:clamp(32px,6vw,56px); line-height:1.02; margin:16px 0 0; }
.page-header p{ font-family:'Archivo'; font-size:16.5px; line-height:1.65; color:#a7a7a2; margin:16px 0 0; max-width:600px; }
.page-header-row{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:20px; }

/* ---------- generic section helpers ---------- */
section{ padding:70px 40px; border-bottom:1px solid var(--line2); position:relative; }
.section-eyebrow{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.2em; color:var(--accent); }
.section-index{ font-family:'JetBrains Mono',monospace; font-size:12px; color:#6f6f69; }
h2.section-title{ font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:46px; line-height:.98; margin:16px 0 0; }
.section-lead{ font-family:'Archivo'; font-size:16px; line-height:1.7; color:#a7a7a2; margin:20px 0 0; max-width:640px; }

.btn{
  display:inline-flex; align-items:center; gap:10px; font-family:'JetBrains Mono',monospace; font-size:12px;
  letter-spacing:.1em; padding:14px 22px; cursor:pointer; text-decoration:none; border:none; font-weight:700;
}
.btn-primary{ color:#000; background:var(--accent); }
.btn-primary:hover{ filter:brightness(1.1); }
.btn-outline{ color:var(--text); background:transparent; border:1px solid var(--line); font-weight:500; }
.btn-outline:hover{ border-color:var(--accent); color:var(--accent); }

.grid-auto{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px; }
.bul{ color:var(--accent); flex:none; }

/* ---------- feature bar ---------- */
.feature-bar{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); border-bottom:1px solid var(--line2); }
.feature-item{ display:flex; align-items:center; gap:14px; padding:22px 26px; border-right:1px solid var(--line2); }
.feature-icon{ width:38px; height:38px; flex:none; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--accent); font-size:16px; }
.feature-text{ font-family:'JetBrains Mono',monospace; }
.feature-title{ font-size:12px; letter-spacing:.1em; color:var(--text); }
.feature-sub{ font-size:10px; letter-spacing:.06em; color:var(--muted); margin-top:4px; }

/* ---------- showreel ---------- */
.showreel-section{ text-align:center; }
.showreel-frame{ border:1px solid var(--line); margin:26px auto 0; position:relative; max-width:860px; padding-top:48.4%; overflow:hidden; }
.showreel-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:none; }
.showreel-placeholder{ border:1px dashed var(--line); margin:26px auto 0; max-width:860px; padding:60px 30px; text-align:center; background:#0b0b0d; }
.showreel-placeholder .flag{ font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--accent); }
.showreel-placeholder p{ font-family:'Archivo'; font-size:13px; color:#a7a7a2; margin:10px auto 0; max-width:460px; }

/* ---------- about / profile ---------- */
.about-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:40px; }
.about-photo-wrap{ position:relative; }
.about-photo{ border:1px solid var(--line); overflow:hidden; height:470px; }
.about-photo img{ width:100%; height:100%; object-fit:cover; object-position:top; filter:grayscale(.1) contrast(1.05); }
.about-photo-tag{ position:absolute; left:-1px; bottom:-1px; background:var(--accent); color:#000; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.12em; padding:10px 16px; font-weight:700; }
.about-facts{ display:grid; grid-template-columns:1fr 1fr; gap:10px 40px; margin-top:26px; font-family:'JetBrains Mono',monospace; font-size:12px; }
.about-fact{ display:flex; justify-content:space-between; border-bottom:1px solid var(--line2); padding-bottom:8px; }
.about-fact .k{ color:var(--muted); }
.about-actions{ display:flex; gap:14px; margin-top:26px; flex-wrap:wrap; }

.stats-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:0; margin-top:44px; border-top:1px solid var(--line2); border-left:1px solid var(--line2); }
.stat-cell{ padding:24px 26px; border-right:1px solid var(--line2); border-bottom:1px solid var(--line2); }
.stat-num{ font-family:'Oswald'; font-weight:700; font-size:44px; color:var(--accent); line-height:1; }
.stat-label{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.12em; color:var(--muted); margin-top:10px; }

/* ---------- clients ---------- */
.clients-eyebrow{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.18em; color:var(--muted); text-align:center; }
.clients-marquee{
  margin-top:24px; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.clients-track{ display:flex; gap:14px; width:max-content; animation-name:clientsScroll; animation-timing-function:linear; animation-iteration-count:infinite; }
.clients-marquee:hover .clients-track{ animation-play-state:paused; }
.client-chip{ flex:none; white-space:nowrap; border:1px solid var(--line2); padding:20px 28px; text-align:center; font-family:'Oswald'; font-weight:600; font-size:17px; letter-spacing:.06em; color:#c9c9c4; transition:border-color .15s, color .15s; }
.client-chip:hover{ border-color:var(--accent); color:var(--accent); }
@keyframes clientsScroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .clients-track{ animation:none; flex-wrap:wrap; width:100%; justify-content:center; }
}

/* ---------- skills ---------- */
.skills-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:40px; align-items:center; }
.skill-row{ display:flex; justify-content:space-between; font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.08em; margin-bottom:9px; }
.skill-row span:last-child{ color:var(--accent); }
.skill-bar-track{ height:6px; background:#161616; border:1px solid var(--line2); overflow:hidden; }
.skill-bar-fill{ height:100%; background:linear-gradient(90deg,var(--accent),#ffcf6a); }
.skills-cols{ display:grid; grid-template-columns:1fr 1fr; gap:22px 40px; }

/* ---------- resume ---------- */
.resume-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:40px; margin-top:34px; }
.resume-label{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.14em; color:var(--accent); margin-bottom:22px; }
.edu-item{ border-left:1px solid var(--line); padding-left:20px; position:relative; }
.edu-item .dot{ position:absolute; left:-5px; top:4px; width:9px; height:9px; background:var(--accent); border-radius:50%; }
.edu-meta{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--accent); letter-spacing:.1em; }
.edu-title{ font-family:'Oswald'; font-weight:600; font-size:19px; text-transform:uppercase; margin-top:8px; }
.edu-desc{ font-family:'Archivo'; font-size:15px; color:#a7a7a2; line-height:1.6; margin-top:8px; }
.resume-card{ border:1px solid var(--line); background:#0b0b0d; padding:20px; margin-top:28px; }
.resume-card .name{ font-family:'Oswald'; font-weight:600; font-size:18px; }
.resume-card .desc{ font-family:'Archivo'; font-size:15px; color:#a7a7a2; line-height:1.6; margin-top:8px; }
.resume-card .meta{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--muted); margin-top:14px; line-height:1.9; }

.exp-item{ border:1px solid var(--line2); background:#0b0b0d; padding:22px; position:relative; transition:border-color .15s; }
.exp-item:hover{ border-color:var(--line); }
.exp-head{ display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:8px; }
.exp-role{ font-family:'Oswald'; font-weight:600; font-size:21px; text-transform:uppercase; }
.exp-period{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.1em; color:var(--accent); border:1px solid var(--line); padding:5px 10px; white-space:nowrap; }
.exp-company{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.08em; color:var(--muted); margin-top:8px; }
.exp-points{ margin:14px 0 0; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:9px; }
.exp-points li{ font-family:'Archivo'; font-size:13px; color:#a7a7a2; line-height:1.55; display:flex; gap:10px; }
.exp-points li .bul{ color:var(--accent); flex:none; }

/* ---------- philosophy ---------- */
.philo-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; margin-top:36px; }
.philo-card{ border:1px solid var(--line2); background:#0b0b0d; padding:26px; }
.philo-tag{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em; color:var(--accent); }
.philo-title{ font-family:'Oswald'; font-weight:600; font-size:20px; text-transform:uppercase; margin-top:14px; }
.philo-desc{ font-family:'Archivo'; font-size:15px; color:#a7a7a2; line-height:1.6; margin-top:10px; }

/* ---------- portfolio ---------- */
.filters{ display:flex; gap:10px; flex-wrap:wrap; margin-top:30px; }
.filter-btn{
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; padding:9px 16px;
  border:1px solid var(--line2); background:transparent; color:#b7b7b2; cursor:pointer; font-weight:500;
}
.filter-btn:hover{ border-color:var(--accent); }
.filter-btn.active{ border-color:var(--accent); background:var(--accent); color:#000; font-weight:700; }

.work-card{ border:1px solid var(--line2); background:#0b0b0d; overflow:hidden; transition:border-color .15s; text-decoration:none; color:inherit; display:block; }
.work-card:hover{ border-color:var(--accent); }
.work-thumb{ height:210px; overflow:hidden; position:relative; }
.work-thumb-img{ position:absolute; inset:0; background-size:cover; background-position:center; filter:contrast(1.05) saturate(1.05); }
.work-tag-cat{ position:absolute; top:12px; left:12px; font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.1em; color:#fff; background:rgba(0,0,0,.6); border:1px solid var(--line); padding:5px 9px; }
.work-tag-docs{ position:absolute; top:12px; right:12px; font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--accent); background:rgba(0,0,0,.6); border:1px solid var(--line); padding:5px 8px; }
.work-body{ padding:18px 18px 20px; }
.work-title{ font-family:'Oswald'; font-weight:600; font-size:19px; letter-spacing:.03em; text-transform:uppercase; line-height:1.05; }
.work-desc{ font-family:'Archivo'; font-size:14.5px; color:#a7a7a2; line-height:1.6; margin-top:10px; }
.work-tags{ display:flex; gap:6px; flex-wrap:wrap; margin-top:14px; }
.work-tags span{ font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.06em; color:var(--muted); border:1px solid var(--line2); padding:4px 8px; }
.work-cta{ display:inline-flex; align-items:center; gap:8px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.08em; color:var(--accent); margin-top:16px; text-decoration:none; transition:gap .15s; }
.work-card:hover .work-cta{ gap:12px; }

/* ---------- highlights ---------- */
.highlight-card{ border:1px solid var(--line2); background:#0b0b0d; padding:26px; }
.highlight-tag{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em; color:var(--accent); }
.highlight-title{ font-family:'Oswald'; font-weight:600; font-size:22px; text-transform:uppercase; margin-top:14px; }
.highlight-desc{ font-family:'Archivo'; font-size:15px; color:#a7a7a2; line-height:1.6; margin-top:10px; }

/* ---------- services ---------- */
.service-card{ border:1px solid var(--line); background:#0b0b0d; padding:22px; display:flex; flex-direction:column; transition:border-color .15s; }
.service-card:hover{ border-color:var(--accent); }
.service-top{ display:flex; align-items:center; justify-content:space-between; }
.service-icon{ font-size:24px; }
.service-num{ font-family:'Oswald'; font-weight:700; font-size:20px; color:#22221f; }
.service-title{ font-family:'Oswald'; font-weight:600; font-size:19px; text-transform:uppercase; margin-top:18px; }
.service-desc{ font-family:'Archivo'; font-size:14.5px; color:#a7a7a2; line-height:1.6; margin-top:10px; }

.service-detail-card{ border:1px solid var(--line); background:#0b0b0d; padding:26px; display:flex; flex-direction:column; transition:border-color .15s; }
.service-detail-card:hover{ border-color:var(--accent); }
.service-detail-icon{ width:44px; height:44px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:20px; }
.service-detail-num{ font-family:'Oswald'; font-weight:700; font-size:26px; color:#22221f; }
.service-detail-title{ font-family:'Oswald'; font-weight:600; font-size:21px; text-transform:uppercase; margin-top:16px; }
.service-detail-long{ font-family:'Archivo'; font-size:15px; line-height:1.65; color:#a7a7a2; margin:12px 0 0; }
.service-deliverables{ border-top:1px solid var(--line2); margin-top:18px; padding-top:16px; flex:1; }
.service-deliverables-label{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.14em; color:var(--accent); }
.service-deliverables ul{ margin:12px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.service-deliverables li{ font-family:'Archivo'; font-size:12.5px; color:#c9c9c4; line-height:1.5; display:flex; gap:8px; }
.service-deliverables li .bul{ color:var(--accent); flex:none; }

/* ---------- packages ---------- */
.package-card{ border:1px solid var(--line); background:linear-gradient(180deg,rgba(20,20,24,.68),rgba(11,11,13,.68)); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); box-shadow:0 20px 60px rgba(0,0,0,.5); padding:24px; display:flex; flex-direction:column; transition:border-color .15s; }
.package-card:hover{ border-color:var(--accent); }
.package-num{ font-family:'Oswald'; font-weight:700; font-size:34px; color:var(--accent); }
.package-title{ font-family:'Oswald'; font-weight:600; font-size:20px; text-transform:uppercase; line-height:1.05; margin-top:12px; }
.package-tagline{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.06em; color:var(--accent); margin-top:8px; }
.package-desc{ font-family:'Archivo'; font-size:14.5px; color:#a7a7a2; line-height:1.6; margin-top:12px; }
.package-items{ margin:16px 0 20px; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; flex:1; }
.package-items li{ font-family:'JetBrains Mono',monospace; font-size:11px; color:#c9c9c4; display:flex; gap:9px; }
.package-items li .bul{ color:var(--accent); }
.package-cta{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.08em; color:var(--text); border:1px solid var(--line); padding:12px; text-align:center; text-decoration:none; transition:background .15s,color .15s,border-color .15s; }
.package-cta:hover{ background:var(--accent); color:#000; border-color:var(--accent); }

/* ---------- how we work ---------- */
.step-card{ border:1px solid var(--line2); background:#0b0b0d; padding:22px; }
.step-tag{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--accent); }
.step-title{ font-family:'Oswald'; font-weight:600; font-size:17px; text-transform:uppercase; margin-top:10px; }
.step-desc{ font-family:'Archivo'; font-size:14.5px; color:#a7a7a2; line-height:1.6; margin-top:8px; }

/* ---------- testimonials ---------- */
.testi-card{ border:1px solid var(--line2); background:#0b0b0d; padding:26px; display:flex; flex-direction:column; }
.testi-quote-mark{ font-family:'Oswald'; font-weight:700; font-size:44px; color:var(--accent); line-height:.6; }
.testi-quote{ font-family:'Archivo'; font-size:16px; color:#d6d6d1; line-height:1.65; margin-top:8px; flex:1; }
.testi-foot{ margin-top:20px; padding-top:16px; border-top:1px solid var(--line2); }
.testi-name{ font-family:'Oswald'; font-weight:600; font-size:15px; letter-spacing:.04em; }
.testi-role{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.1em; color:var(--muted); margin-top:5px; }

/* ---------- CTA band ---------- */
.cta-band{ text-align:center; background:radial-gradient(700px 300px at 50% 0%, rgba(242,168,28,0.12), transparent 70%); }
.cta-band .eyebrow{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.2em; color:var(--accent); }
.cta-band h2{ font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:42px; line-height:1.02; margin:16px auto 0; max-width:760px; }
.cta-band .actions{ display:flex; gap:14px; justify-content:center; margin-top:26px; flex-wrap:wrap; }

/* ---------- contact ---------- */
.contact-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:36px; }
.contact-chips{ display:flex; gap:12px; margin-top:30px; flex-wrap:wrap; }
.contact-chip{ flex:1; min-width:140px; border:1px solid var(--line); background:#0b0b0d; padding:14px; text-decoration:none; display:block; transition:border-color .15s; }
.contact-chip:hover{ border-color:var(--accent); }
.contact-chip-icon{ width:30px; height:30px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--accent); font-size:14px; }
.contact-chip-value{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--text); margin-top:12px; }
.contact-chip-label{ font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.1em; color:var(--muted); margin-top:5px; }

.contact-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:36px; }
.contact-side{ display:flex; flex-direction:column; gap:12px; }
.contact-panel{ border:1px solid var(--line); background:#0b0b0d; padding:30px; }
.contact-panel-label{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.14em; color:var(--accent); }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:16px; }
.form-row:first-of-type{ margin-top:22px; }
.form-label{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.12em; color:var(--muted); display:block; }
.form-input, .form-select, .form-textarea{
  display:block; width:100%; margin-top:8px; background:#0e0e11; border:1px solid var(--line2); color:var(--text);
  padding:12px; font-size:12px; outline:none;
}
.form-select{ color:#8b8b86; }
.form-textarea{ resize:none; height:100px; }
.form-input:focus, .form-select:focus, .form-textarea:focus{ border-color:var(--accent); }
.form-actions{ display:flex; gap:12px; margin-top:20px; flex-wrap:wrap; }
.btn-plain{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.1em; cursor:pointer; }

.contact-side-block{ border:1px solid var(--line2); background:#0b0b0d; padding:20px; margin-top:14px; }
.contact-side-block:first-child{ margin-top:0; }
.contact-side-label{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.12em; color:var(--accent); }
.contact-side-text{ font-family:'Archivo'; font-size:15px; color:#a7a7a2; line-height:1.8; margin-top:12px; }
.social-row{ display:flex; gap:10px; margin-top:14px; }

.connect-visual{ flex:1; border:1px solid var(--line2); background:radial-gradient(circle,#0f0f12,#0a0a0c); position:relative; min-height:150px; display:flex; align-items:center; justify-content:center; }
.connect-ring{ border:1px solid var(--line2); border-radius:50%; position:absolute; }
.connect-dot{ width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 12px var(--accent); }
.connect-panel{ border:1px solid var(--line); background:#0b0b0d; padding:20px; display:flex; flex-direction:column; }

.faq-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin-top:30px; }
.faq-card{ border:1px solid var(--line2); background:#0b0b0d; padding:22px; }
.faq-q{ font-family:'Oswald'; font-weight:600; font-size:16px; }
.faq-a{ font-family:'Archivo'; font-size:15px; color:#a7a7a2; line-height:1.6; margin-top:10px; }

/* ---------- gallery placeholders ---------- */
.gallery-hero{ height:520px; border:1px solid var(--line); overflow:hidden; }
.gallery-hero-img{ width:100%; height:100%; background-size:cover; background-position:center; filter:contrast(1.05) saturate(1.05); }
.gallery-strip{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:14px; margin-top:14px; }
.gallery-thumb{ width:100%; height:150px; border:1px solid var(--line2); background-size:cover; background-position:center; }
.gallery-placeholder{
  width:100%; height:150px; border:1px dashed var(--line2); display:flex; align-items:center; justify-content:center;
  text-align:center; padding:10px; background:#0b0b0d;
}
.gallery-placeholder span{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.06em; color:var(--muted); }

/* ---------- footer ---------- */
.site-footer{ display:flex; align-items:center; justify-content:space-between; padding:26px 40px; gap:20px; flex-wrap:wrap; }
.footer-copy{ text-align:center; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.1em; color:#6a6a64; line-height:1.7; }
.footer-social{ display:flex; gap:10px; }
.social-btn{
  width:36px; height:36px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  color:#b7b7b2; font-size:13px; cursor:pointer; text-decoration:none; transition:color .15s, border-color .15s;
}
.social-btn:hover{ color:var(--accent); border-color:var(--accent); }
.social-btn.li{ font-family:'Oswald'; font-weight:700; }
.social-btn.admin{ border-color:var(--line2); color:#4a4a48; }

/* ---- project estimator ---- */
.est-section{ text-align:center; }
.est-box{ max-width:760px; margin:30px auto 0; border:1px solid var(--line); background:linear-gradient(180deg,rgba(20,20,24,.7),rgba(11,11,13,.85)); padding:26px 28px 28px; text-align:left; }
.est-steps{ display:flex; gap:8px; flex-wrap:wrap; border-bottom:1px solid var(--line2); padding-bottom:18px; }
.est-chip{ font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.12em; color:#55554f; border:1px solid var(--line2); padding:6px 10px; display:flex; gap:6px; align-items:center; }
.est-chip b{ font-weight:400; }
.est-chip.active{ color:var(--accent); border-color:var(--accent); }
.est-chip.done{ color:#5fd08a; border-color:rgba(95,208,138,.4); }
.est-step{ display:none; }
.est-step.active{ display:block; }
.est-q{ font-family:'Oswald',sans-serif; font-weight:600; font-size:20px; text-transform:uppercase; margin:22px 0 16px; }
.est-opts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; }
.est-opts button{ background:rgba(11,11,13,.6); border:1px solid var(--line); border-left:2px solid transparent; padding:16px; text-align:left; cursor:pointer; display:flex; flex-direction:column; gap:6px; transition:border-color .15s, background .15s; }
.est-opts button b{ font-family:'JetBrains Mono',monospace; font-weight:500; font-size:11px; letter-spacing:.1em; color:#e6e6e1; }
.est-opts button span{ font-family:'Archivo',sans-serif; font-size:12px; line-height:1.5; color:#8b8b86; }
.est-opts button:hover{ border-color:#6a6a64; }
.est-opts button.active{ border-color:var(--accent); border-left-color:var(--accent); background:rgba(242,168,28,.06); }
.est-opts button.active b{ color:var(--accent); }
.est-result-label{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.16em; color:#8b8b86; margin-top:24px; }
.est-range{ font-family:'Oswald',sans-serif; font-weight:700; font-size:clamp(34px,6vw,52px); color:var(--accent); line-height:1.05; margin-top:8px; text-shadow:0 0 30px rgba(242,168,28,.35); }
.est-summary{ display:flex; gap:8px; flex-wrap:wrap; margin-top:16px; }
.est-summary span{ font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.08em; color:#c9c9c4; border:1px solid var(--line2); padding:6px 10px; }
.est-disclaimer{ font-family:'Archivo',sans-serif; font-size:12px; color:#6f6f69; line-height:1.6; margin-top:16px; max-width:520px; }
.est-actions{ display:flex; gap:12px; margin-top:22px; flex-wrap:wrap; }
.est-nav{ margin-top:20px; }
.est-nav button{ background:none; border:none; color:#8b8b86; cursor:pointer; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.12em; padding:0; display:flex; gap:8px; align-items:center; transition:color .15s; }
.est-nav button:hover{ color:var(--accent); }

/* ---- command palette (Ctrl+K) ---- */
.cmdk-overlay{ position:fixed; inset:0; background:rgba(4,4,6,.72); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); z-index:200; display:none; }
.cmdk-overlay.open{ display:flex; align-items:flex-start; justify-content:center; padding:12vh 20px 20px; }
.cmdk{ width:100%; max-width:560px; border:1px solid var(--line); border-top:2px solid var(--accent); background:linear-gradient(180deg,rgba(20,20,24,.98),rgba(11,11,13,.98)); box-shadow:0 40px 120px rgba(0,0,0,.7); }
.cmdk-head{ display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--line2); }
.cmdk-prompt{ font-family:'JetBrains Mono',monospace; color:var(--accent); font-size:14px; }
.cmdk-input{ flex:1; background:none; border:none; outline:none; color:#e6e6e1; font-family:'JetBrains Mono',monospace; font-size:13px; letter-spacing:.04em; }
.cmdk-input::placeholder{ color:#55554f; }
.cmdk-esc{ font-family:'JetBrains Mono',monospace; font-size:9px; color:#6f6f69; border:1px solid var(--line2); padding:3px 6px; }
.cmdk-list{ max-height:320px; overflow-y:auto; padding:6px; }
.cmdk-item{ display:grid; grid-template-columns:26px 1fr auto; align-items:center; gap:10px; width:100%; text-align:left; background:none; border:none; border-left:2px solid transparent; padding:11px 12px; cursor:pointer; }
.cmdk-item .ic{ color:var(--accent); font-size:13px; }
.cmdk-item .lb{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; color:#d6d6d1; }
.cmdk-item .ht{ font-family:'Archivo',sans-serif; font-size:11px; color:#6f6f69; }
.cmdk-item.active{ background:rgba(242,168,28,.07); border-left-color:var(--accent); }
.cmdk-item.active .lb{ color:#fff; }
.cmdk-empty{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; color:#6f6f69; padding:22px; text-align:center; }
.cmdk-foot{ display:flex; gap:16px; justify-content:flex-end; padding:10px 16px; border-top:1px solid var(--line2); font-family:'JetBrains Mono',monospace; font-size:8.5px; letter-spacing:.12em; color:#55554f; }
.nav-cmdk{ display:flex; align-items:center; gap:5px; background:none; border:1px solid var(--line); color:#8b8b86; cursor:pointer; font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.08em; padding:6px 9px; transition:color .15s, border-color .15s; }
.nav-cmdk:hover{ color:var(--accent); border-color:var(--accent); }
@media (max-width: 1100px){ .nav-cmdk{ display:none; } }

/* ---- interactive lighting console ---- */
.console-section{ text-align:center; }
.console-wrap{ display:grid; grid-template-columns:1.7fr 1fr; gap:18px; margin-top:30px; text-align:left; }
.console-stage-frame{ border:1px solid var(--line); background:#07070a; display:flex; flex-direction:column; }
.console-stage-top{ display:flex; justify-content:space-between; align-items:center; padding:10px 14px; border-bottom:1px solid var(--line2); font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.14em; }
.console-stage-top .lbl{ color:#8b8b86; }
.console-stage-top .live{ color:#5fd08a; display:flex; align-items:center; gap:6px; }
.console-stage-top .live .d{ width:6px; height:6px; border-radius:50%; background:#5fd08a; animation:pulse 1.8s infinite; }
#consoleStage{ width:100%; height:430px; display:block; touch-action:pan-y; }
.console-panel{ border:1px solid var(--line); background:linear-gradient(180deg,rgba(20,20,24,.85),rgba(11,11,13,.9)); padding:18px 20px; display:flex; flex-direction:column; gap:18px; }
.console-panel-label{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.16em; color:var(--accent); }
.console-faders{ display:flex; flex-direction:column; gap:14px; }
.console-fader{ display:flex; flex-direction:column; gap:8px; }
.console-fader .fname, .console-presets .fname{ font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.14em; color:#8b8b86; }
.console-fader input[type="range"]{ -webkit-appearance:none; appearance:none; width:100%; height:4px; background:#26261f; outline:none; }
.console-fader input[type="range"]::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:14px; height:26px; background:linear-gradient(180deg,#3a3a40,#1b1b20); border:1px solid var(--accent); cursor:pointer; box-shadow:0 0 10px rgba(242,168,28,.35); }
.console-fader input[type="range"]::-moz-range-thumb{ width:14px; height:26px; background:#1b1b20; border:1px solid var(--accent); cursor:pointer; border-radius:0; }
.console-fader input.hue{ background:linear-gradient(90deg,#f33,#ff0,#3f3,#3ff,#33f,#f3f,#f33); }
.console-presets .console-preset-btns{ display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.console-preset-btns button, .console-actions button{
  background:none; border:1px solid var(--line); color:#b7b7b2; cursor:pointer;
  font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.12em; padding:9px 13px;
  transition:color .15s, border-color .15s, background .15s;
}
.console-preset-btns button:hover, .console-actions button:hover{ color:#fff; border-color:#6a6a64; }
.console-preset-btns button.active{ color:var(--accent); border-color:var(--accent); background:rgba(242,168,28,.07); }
.console-actions{ display:flex; gap:8px; }
.console-actions button{ flex:1; }
.console-actions .hint{ color:#55554f; font-size:8.5px; }
#cStrobe.active{ color:#fff; border-color:#fff; background:rgba(255,255,255,.1); }
#cBlackout.active{ color:#e05a50; border-color:#e05a50; background:rgba(224,90,80,.08); }
.console-note{ font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.06em; color:#6f6f69; border-top:1px solid var(--line2); padding-top:14px; line-height:1.6; }
@media (max-width: 860px){
  .console-wrap{ grid-template-columns:1fr; }
  #consoleStage{ height:260px; }
}

/* ---- portfolio case-study result band ---- */
.result-band{
  border:1px solid var(--line); border-left:3px solid var(--accent);
  background:linear-gradient(120deg,rgba(242,168,28,.05),rgba(11,11,13,.4));
  padding:34px 34px 8px; display:grid; grid-template-columns:1.1fr 1fr; gap:34px; align-items:start;
}
.result-head{ padding-bottom:26px; }
.result-text{ font-family:'Archivo',sans-serif; font-size:17px; line-height:1.8; color:#d6d6d1; margin:16px 0 0; max-width:520px; }
.result-metrics{ display:grid; grid-template-columns:1fr 1fr; gap:22px; padding-bottom:26px; }
.metric{ border-top:1px solid var(--line2); padding-top:14px; }
.metric-value{ font-family:'Oswald',sans-serif; font-weight:700; font-size:38px; line-height:1; color:var(--accent); }
.metric-label{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.1em; color:#9b9b96; margin-top:8px; line-height:1.4; }
@media (max-width: 720px){
  .result-band{ grid-template-columns:1fr; gap:20px; padding:26px 22px 6px; }
}

/* ---- legal / privacy page ---- */
.legal-body{ max-width:760px; }
.legal-body h2{ font-family:'Oswald',sans-serif; font-weight:600; font-size:20px; text-transform:uppercase; letter-spacing:.02em; color:#e6e6e1; margin:38px 0 0; }
.legal-body h2:first-child{ margin-top:0; }
.legal-body p{ font-family:'Archivo',sans-serif; font-size:15px; line-height:1.8; color:#a7a7a2; margin:14px 0 0; }
.legal-body strong{ color:#d6d6d1; font-weight:600; }
.legal-body a{ color:var(--accent); text-decoration:none; border-bottom:1px solid rgba(242,168,28,.35); }
.legal-body a:hover{ border-bottom-color:var(--accent); }

/* ---- big footer ---- */
.site-footer-big{ border-top:1px solid var(--line2); background:linear-gradient(180deg,rgba(13,13,16,.6),rgba(5,5,6,.9)); }
.footer-grid{ display:grid; grid-template-columns:1.5fr 1fr 1.2fr 1.3fr; gap:44px; padding:52px 40px 40px; }
.footer-col{ display:flex; flex-direction:column; align-items:flex-start; gap:13px; }
.footer-h{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.18em; color:var(--accent); margin-bottom:6px; }
.footer-col a, .footer-line{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.08em; color:#9b9b96; text-decoration:none; display:flex; align-items:center; gap:8px; transition:color .15s; }
.footer-col a:hover{ color:#fff; }
.footer-col .m{ color:var(--accent); }
.footer-brand-col{ gap:18px; }
.footer-desc{ font-family:'Archivo',sans-serif; font-size:13.5px; line-height:1.7; color:#8b8b86; max-width:300px; margin:0; }
.footer-status{ color:#5fd08a; }
.footer-status .d{ width:7px; height:7px; border-radius:50%; background:#5fd08a; animation:pulse 1.8s infinite; }
.footer-bottom{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:18px 40px; border-top:1px solid var(--line2); font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.1em; color:#6a6a64; }
.footer-bottom a{ color:#9b9b96; text-decoration:none; transition:color .15s; }
.footer-bottom a:hover{ color:var(--accent); }
.footer-bottom-right{ display:flex; align-items:center; gap:10px; }
.footer-bottom .sep{ color:#3a3a36; }

@media (max-width: 900px){
  .footer-grid{ grid-template-columns:1fr 1fr; gap:36px; padding:44px 24px 32px; }
}
@media (max-width: 560px){
  .footer-grid{ grid-template-columns:1fr; }
  .footer-bottom{ flex-direction:column; text-align:center; padding:18px 24px; }
}

@media (max-width: 760px){
  .site-footer{ flex-direction:column; text-align:center; }
}

/* ================= HOME PAGE ================= */
.hero-desktop{
  position:relative; height:724px; border-bottom:1px solid var(--line2); overflow:hidden; perspective:1600px;
  background-image:radial-gradient(700px 420px at 74% 12%,rgba(242,168,28,0.16),transparent 62%),radial-gradient(560px 360px at 30% 78%,rgba(200,107,224,0.12),transparent 65%);
}
.hero-beam-1{ position:absolute; top:-120px; right:220px; width:420px; height:760px; background:radial-gradient(closest-side,rgba(242,168,28,.22),transparent 70%); filter:blur(26px); animation:beam 9s ease-in-out infinite; pointer-events:none; }
.hero-beam-2{ position:absolute; top:120px; left:300px; width:380px; height:560px; background:radial-gradient(closest-side,rgba(200,107,224,.16),transparent 70%); filter:blur(30px); animation:beam 12s ease-in-out infinite reverse; pointer-events:none; }
.hero-spark{ position:absolute; border-radius:50%; pointer-events:none; }
.hero-spark-1{ top:150px; left:560px; width:6px; height:6px; background:var(--accent); box-shadow:0 0 12px var(--accent); animation:drift 7s ease-in-out infinite; }
.hero-spark-2{ top:430px; left:980px; width:5px; height:5px; background:#c86be0; box-shadow:0 0 12px #c86be0; animation:drift 9s ease-in-out infinite; }
.hero-spark-3{ top:90px; left:900px; width:4px; height:4px; background:#5fb0d0; box-shadow:0 0 10px #5fb0d0; animation:drift 11s ease-in-out infinite; }

.hero-rail{ position:absolute; left:28px; top:30px; width:74px; font-family:'JetBrains Mono',monospace; z-index:4; }
.hero-rail-idx{ font-size:11px; color:var(--muted); letter-spacing:.1em; }
.hero-rail-list{ margin-top:34px; display:flex; flex-direction:column; gap:26px; }
.hero-rail-active{ display:flex; align-items:center; gap:9px; }
.hero-rail-active .d{ width:9px; height:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 10px var(--accent); }
.hero-rail-active span:last-child{ font-size:10px; letter-spacing:.12em; color:var(--accent); }
.hero-rail-item{ display:flex; flex-direction:column; gap:3px; }
.hero-rail-item .n{ font-size:10px; color:#55554f; }
.hero-rail-item .l{ font-size:10px; letter-spacing:.12em; color:#6f6f69; }
.hero-rail-scroll{ margin-top:40px; display:flex; flex-direction:column; align-items:center; gap:8px; }
.hero-rail-scroll span:first-child{ font-size:9px; letter-spacing:.14em; color:var(--muted); }
.hero-rail-scroll span:last-child{ width:1px; height:46px; background:linear-gradient(var(--accent),transparent); }

.hero-stage{ position:absolute; left:520px; top:104px; width:500px; height:452px; perspective:1500px; z-index:2; }
.hero-stage-inner{ position:relative; width:100%; height:100%; transform-style:preserve-3d; animation:spin3d 10s ease-in-out infinite; }
.hero-glow-plane{ position:absolute; inset:-40px; transform:translateZ(-150px); background:radial-gradient(closest-side,rgba(242,168,28,.35),transparent 70%); filter:blur(34px); }
.hero-ghost{ position:absolute; inset:0; transform:translateZ(-90px) translate(66px,46px) rotate(1.5deg); border:1px solid var(--line2); overflow:hidden; opacity:.5; box-shadow:0 30px 80px rgba(0,0,0,.6); }
.hero-ghost img{ width:100%; height:100%; object-fit:cover; filter:saturate(1.3); }
.hero-ghost-tint{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(120,20,160,.35),rgba(20,0,40,.55)); }
.hero-card{ position:absolute; inset:0; border:1px solid rgba(242,168,28,.55); overflow:hidden; box-shadow:0 50px 130px rgba(0,0,0,.8),0 0 90px rgba(242,168,28,.28),inset 0 0 50px rgba(0,0,0,.45); }
.hero-card img{ width:100%; height:100%; object-fit:cover; filter:contrast(1.08) saturate(1.12); }
.hero-card-tint{ position:absolute; inset:0; background:linear-gradient(125deg,rgba(255,255,255,.16),transparent 38%),linear-gradient(0deg,rgba(6,6,8,.72),transparent 46%); }
.hero-card-plus{ position:absolute; color:var(--accent); font-size:12px; }
.hero-card-plus.tl{ top:10px; left:10px; }
.hero-card-plus.tr{ top:10px; right:10px; }
.hero-card-plus.br{ bottom:10px; right:10px; }
.hero-card-caption{ position:absolute; left:16px; bottom:16px; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.14em; color:#fff; }

.hero-chip-live{
  position:absolute; right:-26px; bottom:-34px; transform:translateZ(130px); width:190px; border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(20,20,24,.82),rgba(11,11,13,.82)); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  padding:14px 16px; box-shadow:0 30px 70px rgba(0,0,0,.6);
}
.hero-chip-live-top{ display:flex; align-items:center; justify-content:space-between; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.12em; }
.hero-chip-live-top .live{ color:var(--accent); }
.hero-chip-live-top .rec{ color:#5fd08a; display:flex; align-items:center; gap:5px; }
.hero-chip-live-top .rec .d{ width:6px; height:6px; border-radius:50%; background:#5fd08a; animation:glowPulse 1.4s infinite; }
.eq-bars{ display:flex; align-items:flex-end; gap:3px; height:30px; margin-top:12px; }
.eq-bars span{ width:4px; height:100%; background:linear-gradient(var(--accent),#ffcf6a); transform-origin:bottom; animation:eq 1s ease-in-out infinite; }

.hero-chip-output{
  position:absolute; right:-46px; top:-24px; transform:translateZ(95px); border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(20,20,24,.85),rgba(11,11,13,.85)); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  padding:10px 14px; font-family:'JetBrains Mono',monospace; box-shadow:0 20px 50px rgba(0,0,0,.6);
}
.hero-chip-output .label{ font-size:9px; letter-spacing:.14em; color:var(--muted); }
.hero-chip-output .value{ font-size:13px; color:var(--accent); margin-top:3px; }

.hero-text{ position:absolute; left:118px; top:96px; width:410px; z-index:3; }
.hero-eyebrow{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.2em; color:var(--accent); }
.hero-title{ font-family:'Oswald'; font-weight:700; text-transform:uppercase; line-height:.92; letter-spacing:.005em; font-size:78px; margin:16px 0 0; }
.hero-title .accent{ color:var(--accent); text-shadow:0 0 30px rgba(242,168,28,.55); }
.hero-p{ font-family:'Archivo'; font-size:16px; line-height:1.65; color:#a7a7a2; max-width:350px; margin:22px 0 0; }
.hero-actions{ display:flex; gap:14px; margin-top:26px; flex-wrap:wrap; }
.hero-badges{ display:flex; gap:26px; margin-top:26px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; color:#9b9b96; flex-wrap:wrap; }
.hero-badges span{ display:flex; align-items:center; gap:8px; }
.hero-badges .m{ color:var(--accent); }

/* ---- hero scene slider ---- */
.hero-slides{ display:grid; }
.hero-slide{ grid-area:1/1; opacity:0; transform:translateY(14px); transition:opacity .65s ease, transform .65s ease; pointer-events:none; }
.hero-slide.active{ opacity:1; transform:none; pointer-events:auto; }
.hero-scene-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .8s ease; }
.hero-scene-img.active{ opacity:1; }
.chip-scene{ display:none; }
.chip-scene.active{ display:block; }
.hero-scenes{ display:flex; align-items:center; gap:14px; margin-top:22px; font-family:'JetBrains Mono',monospace; }
.hero-scene-tab{ background:none; border:none; padding:0; cursor:pointer; display:flex; align-items:center; gap:7px; font-family:inherit; font-size:10px; letter-spacing:.14em; color:#6f6f69; transition:color .3s ease; }
.hero-scene-tab .n{ font-size:9px; color:#55554f; transition:color .3s ease; }
.hero-scene-tab:hover{ color:#b9b9b3; }
.hero-scene-tab.active, .hero-scene-tab.active .n{ color:var(--accent); }
.hero-scenes-bar{ flex:1; max-width:110px; height:2px; background:#26261f; position:relative; overflow:hidden; }
.hero-scenes-bar .fill{ position:absolute; left:0; top:0; bottom:0; width:0; background:var(--accent); }
.hero-scenes-bar .fill.run{ width:100%; transition:width 8s linear; }

.hero-panels{
  position:absolute; left:1046px; top:108px; width:308px; display:flex; flex-direction:column; gap:14px; z-index:3;
  transform:perspective(1300px) rotateY(-11deg); transform-style:preserve-3d; animation:drift 12s ease-in-out infinite;
}
.hero-panel{
  border:1px solid var(--line); background:linear-gradient(180deg,rgba(20,20,24,.68),rgba(11,11,13,.68));
  backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); box-shadow:0 20px 60px rgba(0,0,0,.5); padding:16px 18px;
}
.hero-panel-top{ display:flex; align-items:center; justify-content:space-between; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em; }
.hero-panel-top .status{ color:var(--accent); }
.hero-panel-top .live{ display:flex; align-items:center; gap:6px; color:#5fd08a; }
.hero-panel-top .live .d{ width:7px; height:7px; border-radius:50%; background:#5fd08a; animation:pulse 1.8s infinite; }
.hero-panel-rows{ margin-top:14px; display:flex; flex-direction:column; gap:9px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.06em; }
.hero-panel-rows .row{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; color:#8b8b86; }
.hero-panel-rows .row span:first-child{ flex:none; white-space:nowrap; }
.hero-panel-rows .row span:last-child{ color:#e6e6e1; text-align:right; }
.hero-panel-label{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em; color:var(--accent); }
.hero-panel-caps{ margin-top:12px; display:flex; flex-direction:column; gap:7px; font-family:'JetBrains Mono',monospace; font-size:11px; color:#b7b7b2; }
.hero-panel-caps span{ display:flex; gap:9px; }
.hero-panel-caps .m{ color:var(--accent); }
.hero-panel-foot{ display:flex; justify-content:space-between; margin-top:14px; padding-top:12px; border-top:1px solid var(--line2); font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; color:#8b8b86; }
.hero-panel-foot .ok{ color:#5fd08a; }
.hero-quote-panel{ display:flex; align-items:flex-end; justify-content:space-between; }
.hero-quote{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.08em; color:var(--accent); }
.hero-quote-bars{ display:flex; align-items:flex-end; gap:2px; height:26px; }
.hero-quote-bars span{ width:3px; background:var(--accent); }

/* mobile hero */
.hero-mobile{
  position:relative; padding:36px 22px 40px; border-bottom:1px solid var(--line2); overflow:hidden;
  background-image:radial-gradient(500px 300px at 80% 0%,rgba(242,168,28,0.16),transparent 62%);
  display:none;
}
.hero-mobile h1{ font-family:'Oswald'; font-weight:700; text-transform:uppercase; line-height:1; font-size:clamp(34px,11vw,56px); margin:14px 0 0; }
.hero-mobile .eyebrow{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.16em; color:var(--accent); }
.hero-mobile .lead{ font-family:'Archivo'; font-size:16px; line-height:1.65; color:#a7a7a2; margin:16px 0 0; }
.hero-mobile-photo{ border:1px solid var(--line); overflow:hidden; margin-top:22px; height:220px; position:relative; }
.hero-mobile-photo img{ width:100%; height:100%; object-fit:cover; }
.hero-mslides{ display:grid; }
.hero-mslide{ grid-area:1/1; opacity:0; transform:translateY(12px); transition:opacity .65s ease, transform .65s ease; pointer-events:none; }
.hero-mslide.active{ opacity:1; transform:none; pointer-events:auto; }
.hero-scenes-mobile{ margin-top:16px; }
.hero-mobile-actions{ display:flex; flex-direction:column; gap:12px; margin-top:20px; }
.hero-mobile-actions .btn{ justify-content:center; }
.hero-mobile-badges{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:22px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.06em; color:#9b9b96; }
.hero-mobile-badges span{ display:flex; align-items:center; gap:6px; }
.hero-mobile-badges .m{ color:var(--accent); }
.hero-mobile-status{ border:1px solid var(--line); background:#0c0c0e; padding:16px; margin-top:22px; }
.hero-mobile-status-top{ display:flex; align-items:center; justify-content:space-between; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.1em; }
.hero-mobile-status-top .status{ color:var(--accent); }
.hero-mobile-status-top .live{ display:flex; align-items:center; gap:6px; color:#5fd08a; }
.hero-mobile-status-top .live .d{ width:7px; height:7px; border-radius:50%; background:#5fd08a; }
.hero-mobile-status-rows{ margin-top:12px; display:flex; flex-direction:column; gap:8px; font-family:'JetBrains Mono',monospace; font-size:11px; }
.hero-mobile-status-rows .row{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; color:#8b8b86; }
.hero-mobile-status-rows .row span:first-child{ flex:none; white-space:nowrap; }
.hero-mobile-status-rows .row span{ color:#e6e6e1; text-align:right; }

@media (max-width: 860px){
  .hero-desktop{ display:none; }
  .hero-mobile{ display:block; }
}

/* ================= ADMIN PANEL ================= */
.admin-page{ width:1440px; margin:0 auto; background:var(--bg); color:var(--text); font-family:'Archivo',sans-serif; position:relative; }

.login-screen{ min-height:100vh; display:flex; align-items:center; justify-content:center; background-image:radial-gradient(900px 500px at 50% 20%, rgba(242,168,28,0.10), transparent 60%); }
.login-card{ width:400px; border:1px solid var(--line); background:#0b0b0d; padding:40px; }
.login-brand{ display:flex; align-items:center; gap:14px; margin-bottom:30px; }
.login-eyebrow{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.16em; color:var(--accent); }
.login-card h1{ font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:26px; line-height:1.1; margin:12px 0 0; }
.login-error{ font-family:'JetBrains Mono',monospace; font-size:11px; color:#e0607a; margin-top:10px; }
.login-note{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--muted); margin-top:18px; line-height:1.6; }
.login-back{ display:inline-flex; align-items:center; gap:8px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; color:var(--muted); margin-top:18px; text-decoration:none; }
.login-back:hover{ color:var(--accent); }

.admin-shell{ display:flex; min-height:100vh; position:relative; }
.admin-sidebar{ width:240px; flex:none; border-right:1px solid var(--line2); display:flex; flex-direction:column; padding:22px 0; background:#08080a; }
.admin-brand{ display:flex; align-items:center; gap:12px; padding:0 22px 22px; border-bottom:1px solid var(--line2); margin-bottom:18px; }
.admin-nav{ display:flex; flex-direction:column; gap:2px; padding:0 12px; }
.admin-nav-btn{
  display:flex; align-items:center; justify-content:space-between; gap:12px; text-align:left;
  font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.06em; padding:12px 12px;
  border:none; border-left:2px solid transparent; background:transparent; color:#b7b7b2; cursor:pointer; width:100%;
  text-decoration:none; box-sizing:border-box;
}
.admin-nav-btn.active{ background:rgba(242,168,28,0.08); color:var(--accent); border-left-color:var(--accent); }
.admin-nav-btn .unread-badge{ background:var(--accent); color:#000; font-size:9px; font-weight:700; padding:2px 6px; }
.admin-sidebar-foot{ padding:0 12px; display:flex; flex-direction:column; gap:2px; border-top:1px solid var(--line2); padding-top:14px; margin-top:14px; }
.admin-sidebar-foot a{ display:flex; align-items:center; gap:12px; font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.06em; padding:12px 12px; color:#b7b7b2; text-decoration:none; }
.admin-sidebar-foot a:hover{ color:#fff; }
.admin-sidebar-foot form{ margin:0; }
.admin-logout-btn{ display:flex; align-items:center; gap:12px; text-align:left; font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.06em; padding:12px 12px; border:none; background:transparent; color:#e0607a; cursor:pointer; }

.admin-main{ flex:1; min-width:0; }
.admin-topbar{ display:flex; align-items:center; justify-content:space-between; padding:20px 32px; border-bottom:1px solid var(--line2); }
.admin-topbar-eyebrow{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.16em; color:var(--accent); }
.admin-topbar-title{ font-family:'Oswald'; font-weight:600; font-size:24px; text-transform:uppercase; margin-top:4px; }
.admin-toast{ font-family:'JetBrains Mono',monospace; font-size:11px; color:#5fd08a; border:1px solid rgba(95,208,138,.4); padding:8px 14px; background:rgba(95,208,138,.08); }
.admin-profile-chip{ display:flex; align-items:center; gap:10px; border:1px solid var(--line2); padding:8px 14px; }
.admin-avatar{ width:26px; height:26px; border-radius:50%; background:var(--accent); color:#000; font-family:'Oswald'; font-weight:700; font-size:12px; display:flex; align-items:center; justify-content:center; }
.admin-tab-content{ padding:28px 32px; }

.admin-stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.admin-stat-card{ border:1px solid var(--line2); background:#0b0b0d; padding:20px; }
.admin-stat-card.highlight{ border-color:var(--line); }
.admin-stat-label{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.12em; color:var(--muted); }
.admin-stat-num{ font-family:'Oswald'; font-weight:700; font-size:36px; margin-top:10px; }

.admin-panel-row{ display:grid; grid-template-columns:1.3fr 1fr; gap:20px; margin-top:24px; }
.admin-panel{ border:1px solid var(--line2); background:#0b0b0d; padding:24px; }
.admin-panel-head{ display:flex; justify-content:space-between; align-items:center; }
.admin-panel-label{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em; color:var(--accent); }
.admin-link-btn{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.08em; color:var(--muted); background:none; border:none; cursor:pointer; }
.admin-link-btn:hover{ color:var(--accent); }
.admin-msg-row{ display:flex; justify-content:space-between; align-items:center; padding:14px 0; border-bottom:1px solid var(--line2); }
.admin-quick-btn{
  display:flex; align-items:center; justify-content:space-between; font-family:'JetBrains Mono',monospace; font-size:12px;
  letter-spacing:.06em; color:var(--text); background:#0e0e11; border:1px solid var(--line2); padding:12px 14px; cursor:pointer; width:100%;
  text-decoration:none; box-sizing:border-box;
}
.admin-quick-btn:hover{ border-color:var(--accent); }
.admin-hint{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--muted); line-height:1.6; margin-top:20px; border-top:1px solid var(--line2); padding-top:14px; }

.admin-list-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; }
.admin-count{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--muted); }
.admin-add-btn{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.08em; color:#000; background:var(--accent); border:none; padding:11px 18px; cursor:pointer; font-weight:700; }
.admin-add-btn:hover{ filter:brightness(1.1); }

.admin-table{ border:1px solid var(--line2); }
.admin-table-head{ display:grid; grid-template-columns:64px 1.6fr 1fr 90px 90px 140px; gap:12px; padding:12px 16px; background:#0b0b0d; border-bottom:1px solid var(--line2); font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.1em; color:var(--muted); }
.admin-table-row{ display:grid; grid-template-columns:64px 1.6fr 1fr 90px 90px 140px; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line2); align-items:center; }
.admin-thumb{ width:44px; height:44px; background-size:cover; background-position:center; border:1px solid var(--line2); }
.admin-row-actions{ display:flex; gap:8px; justify-content:flex-end; }
.admin-row-actions form{ margin:0; display:contents; }
.admin-btn-edit, .admin-btn-delete{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.06em; background:none; border:1px solid var(--line2); padding:7px 10px; cursor:pointer; }
.admin-btn-edit{ color:var(--text); }
.admin-btn-edit:hover{ border-color:var(--accent); color:var(--accent); }
.admin-btn-delete{ color:#e0607a; }
.admin-btn-delete:hover{ border-color:#e0607a; }

.admin-service-row{ display:grid; grid-template-columns:44px 1fr 140px; gap:18px; align-items:center; border:1px solid var(--line2); background:#0b0b0d; padding:16px 18px; }
.admin-service-icon{ width:38px; height:38px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:17px; }

.admin-testi-card{ border:1px solid var(--line2); background:#0b0b0d; padding:20px; }
.admin-testi-foot{ display:flex; justify-content:space-between; align-items:flex-end; margin-top:16px; padding-top:12px; border-top:1px solid var(--line2); }

.admin-msg-list{ border:1px solid var(--line2); }
.admin-msg-item{ padding:18px 20px; border-bottom:1px solid var(--line2); cursor:pointer; }
.admin-msg-item.expanded-bg{ background:rgba(242,168,28,0.05); }
.admin-msg-top{ display:flex; justify-content:space-between; align-items:center; }
.admin-msg-left{ display:flex; align-items:center; gap:12px; }
.admin-msg-dot{ width:8px; height:8px; border-radius:50%; flex:none; }
.admin-msg-name{ font-family:'Oswald'; font-weight:600; font-size:15px; }
.admin-msg-project{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--accent); border:1px solid var(--line); padding:4px 9px; }
.admin-msg-right{ display:flex; align-items:center; gap:14px; }
.admin-msg-date{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--muted); }
.admin-msg-body{ font-family:'Archivo'; font-size:13px; color:#c9c9c4; line-height:1.6; margin-top:14px; padding-top:14px; border-top:1px solid var(--line2); max-width:800px; }
.admin-msg-meta{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--muted); margin-top:10px; }

.settings-block{ border:1px solid var(--line2); background:#0b0b0d; padding:26px; margin-top:16px; }
.settings-block:first-child{ margin-top:0; }
.settings-hint{ font-family:'Archivo'; font-size:12px; color:var(--muted); margin-top:6px; }
.accent-swatch{ width:42px; height:42px; border-radius:50%; border:2px solid rgba(255,255,255,.15); cursor:pointer; position:relative; }
.accent-swatch input{ position:absolute; inset:0; opacity:0; cursor:pointer; margin:0; }
.accent-swatch.active{ border-color:#fff; }
.settings-checkbox-row{ display:flex; align-items:center; gap:12px; margin-top:22px; font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.06em; color:#c9c9c4; cursor:pointer; }
.settings-checkbox-row input{ width:16px; height:16px; accent-color:var(--accent); }
.danger-label{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em; color:#e0607a; }
.danger-btn{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.08em; color:#e0607a; background:none; border:1px solid rgba(224,96,122,.4); padding:11px 18px; margin-top:14px; cursor:pointer; }
.danger-btn:hover{ background:#e0607a; color:#000; }

.modal-overlay{ position:absolute; inset:0; background:rgba(0,0,0,.65); display:none; align-items:flex-start; justify-content:center; padding:60px 20px; z-index:20; }
.modal-overlay.is-open{ display:flex; }
.modal-box{ width:560px; border:1px solid var(--line); background:#0b0b0d; padding:28px; max-height:80vh; overflow:auto; }
.modal-box.narrow{ width:480px; }
.modal-head{ display:flex; justify-content:space-between; align-items:center; }
.modal-close{ background:none; border:none; color:var(--muted); font-size:16px; cursor:pointer; }
.modal-fields{ display:flex; flex-direction:column; gap:14px; margin-top:18px; }
.modal-field-row{ display:grid; gap:12px; }
.upload-btn{
  flex:none; display:flex; align-items:center; gap:8px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.06em;
  color:var(--text); background:#0e0e11; border:1px solid var(--line2); padding:10px 14px; cursor:pointer;
}
.upload-btn:hover{ border-color:var(--accent); color:var(--accent); }
.upload-preview{ width:56px; height:56px; flex:none; border:1px solid var(--line2); background-size:cover; background-position:center; }
.gallery-admin-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px; }
.gallery-admin-thumb{ position:relative; height:70px; border:1px solid var(--line2); background-size:cover; background-position:center; }
.gallery-admin-remove{ position:absolute; top:3px; right:3px; width:18px; height:18px; border:none; background:rgba(0,0,0,.7); color:#e0607a; font-size:11px; cursor:pointer; line-height:1; }
.modal-actions{ display:flex; gap:12px; margin-top:22px; }
.modal-btn-save{ flex:1; font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.08em; color:#000; background:var(--accent); border:none; padding:13px; cursor:pointer; font-weight:700; }
.modal-btn-cancel{ flex:none; font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.08em; color:var(--text); background:none; border:1px solid var(--line2); padding:13px 20px; cursor:pointer; }

@media (max-width: 1024px){
  .admin-page{ width:100%; }
}
