/* Codex-Labo LP — base styles */
:root{
  --neon-blue: oklch(70% 0.22 250);
  --neon-cyan: oklch(82% 0.18 210);
  --neon-violet: oklch(65% 0.25 295);
  --neon-magenta: oklch(70% 0.24 330);
  --ink-bg: #07091a;
  --ink-bg-2: #0d1130;
  --ink-bg-3: #141a3f;
  --ink-fg: #e8eaff;
  --ink-fg-dim: #aab0d6;
  --sepia-bg: #f3ead8;
  --sepia-ink: #2c241a;
  --sepia-line: #b09a72;
  --hue: 250;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: "Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif;
  background: var(--ink-bg);
  color: var(--ink-fg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.brand-serif{ font-family: "Cormorant Garamond","EB Garamond",serif; letter-spacing:.02em; }
.brand-mono{ font-family: "JetBrains Mono","SF Mono",ui-monospace,monospace; }

.brand-mark{
  font-weight: 800;
  color: #1a0f00;
  background: linear-gradient(180deg, transparent 62%, #d9b25a 62%, #d9b25a 100%);
  padding: 0 .12em;
  letter-spacing: .01em;
}

/* Reality card grid — fixed 1.1fr/1fr at md+ */
.reality-card{ display:grid; grid-auto-rows:fr; }
.reality-card > *{ min-width: 0; }
@media (min-width: 768px){
  .reality-card{ grid-template-columns: 1.1fr 1fr; }
}

/* Neon helpers */
.neon-text{
  color: #e8f6ff;
  text-shadow:
    0 0 8px oklch(70% 0.22 var(--hue) / 0.7),
    0 0 24px oklch(70% 0.22 var(--hue) / 0.5),
    0 0 60px oklch(65% 0.25 calc(var(--hue) + 45) / 0.4);
}
.neon-border{
  border:1px solid oklch(70% 0.22 var(--hue) / 0.45);
  box-shadow:
    inset 0 0 12px oklch(70% 0.22 var(--hue) / 0.18),
    0 0 24px oklch(70% 0.22 var(--hue) / 0.18);
}
.glass{
  background: linear-gradient(180deg,
    oklch(70% 0.22 var(--hue) / 0.06),
    oklch(60% 0.18 calc(var(--hue) + 40) / 0.03));
  backdrop-filter: blur(12px) saturate(140%);
  -webkit-backdrop-filter: blur(12px) saturate(140%);
  border:1px solid oklch(80% 0.10 var(--hue) / 0.18);
  border-radius:14px;
}

.grid-bg{
  background-image:
    linear-gradient(oklch(70% 0.22 var(--hue) / 0.07) 1px, transparent 1px),
    linear-gradient(90deg, oklch(70% 0.22 var(--hue) / 0.07) 1px, transparent 1px);
  background-size: 48px 48px, 48px 48px;
}

.scanlines::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background: repeating-linear-gradient(
    0deg,
    rgba(255,255,255,0.02) 0 1px,
    transparent 1px 3px);
  mix-blend-mode: overlay;
}

@keyframes flicker{
  0%,19%,21%,23%,25%,54%,56%,100%{ opacity:1 }
  20%,24%,55%{ opacity:.55 }
}
.flicker{ animation: flicker 6s infinite; }

@keyframes glow-pulse{
  0%,100%{ filter: drop-shadow(0 0 8px oklch(70% 0.22 var(--hue) / .5)) drop-shadow(0 0 24px oklch(65% 0.25 calc(var(--hue) + 40) / .35)) }
  50%   { filter: drop-shadow(0 0 14px oklch(70% 0.22 var(--hue) / .7)) drop-shadow(0 0 40px oklch(65% 0.25 calc(var(--hue) + 40) / .55)) }
}
.glow-pulse{ animation: glow-pulse 4.5s ease-in-out infinite; }

@keyframes float-y{
  0%,100%{ transform: translateY(0) }
  50%   { transform: translateY(-8px) }
}
.float-y{ animation: float-y 6s ease-in-out infinite; }

/* Sepia card */
.sepia-card{
  background: linear-gradient(180deg, #efe5cc, #ddc99e);
  color: var(--sepia-ink);
  border:1px solid var(--sepia-line);
  border-radius:6px;
  position:relative;
  overflow:hidden;
}
.sepia-card::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(255,250,230,.5), transparent 60%),
    radial-gradient(120% 80% at 50% 100%, rgba(60,40,10,.35), transparent 70%);
  mix-blend-mode: multiply;
}

/* Light mode */
body.theme-light{
  background:#f7f5ee;
  color:#1a1d2e;
}
body.theme-light .grid-bg{
  background-image:
    linear-gradient(rgba(20,30,80,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(20,30,80,0.06) 1px, transparent 1px);
}
body.theme-light .glass{
  background: linear-gradient(180deg, rgba(255,255,255,0.7), rgba(245,243,235,0.5));
  border-color: rgba(20,30,80,0.12);
}
body.theme-light .neon-text{
  color: oklch(45% 0.18 var(--hue));
  text-shadow: none;
}
body.theme-light .neon-border{
  border-color: oklch(60% 0.18 var(--hue) / 0.5);
  box-shadow: 0 4px 20px oklch(70% 0.18 var(--hue) / 0.15);
}
body.theme-light .ink-fg-dim{ color:#5a607a }
body.theme-light .section-band{ background:#ece7da }

.section-band{ background: linear-gradient(180deg, #0a0e25, #0d1130); }

/* Smooth scroll + selection */
html{ scroll-behavior:smooth }
::selection{ background: oklch(70% 0.22 var(--hue) / 0.4); color:#fff }

/* Hide horizontal overflow from animated and full-bleed elements */
html,body{ overflow-x:hidden; max-width:100% }

/* Marquee for english tagline strip */
@keyframes marquee{
  from{ transform: translateX(0) }
  to  { transform: translateX(-50%) }
}
.marquee-track{ animation: marquee 40s linear infinite; will-change: transform; }

/* Hover lift */
.lift{ transition: transform .35s ease, box-shadow .35s ease }
.lift:hover{ transform: translateY(-4px) }

/* Contact form */
.contact-form label{
  display:block;
}
.contact-form label > span{
  display:block;
  margin-bottom:8px;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  opacity:.72;
  font-family: "JetBrains Mono", monospace;
}
.contact-form input,
.contact-form select,
.contact-form textarea{
  width:100%;
  min-width:0;
  border:1px solid oklch(80% 0.10 var(--hue) / 0.2);
  border-radius:8px;
  background:rgba(4,8,24,.72);
  color:#eef3ff;
  padding:12px 14px;
  line-height:1.55;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.contact-form textarea{
  resize:vertical;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
  border-color:oklch(75% 0.20 var(--hue) / .72);
  box-shadow:0 0 0 3px oklch(70% 0.22 var(--hue) / .16);
}
.contact-hp{
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden;
}
.contact-submit{
  width:100%;
  border:1px solid oklch(75% 0.20 var(--hue) / .55);
  border-radius:8px;
  background:linear-gradient(135deg,
    oklch(70% 0.22 var(--hue) / .34),
    oklch(62% 0.24 calc(var(--hue) + 42) / .28));
  color:#fff;
  padding:14px 18px;
  font-weight:700;
  letter-spacing:.08em;
}
.contact-submit:disabled{
  cursor:wait;
  opacity:.65;
}
.contact-status{
  border-radius:8px;
  padding:12px 14px;
  font-size:14px;
  line-height:1.7;
}
.contact-status.is-success{
  background:rgba(20,130,80,.18);
  border:1px solid rgba(90,230,150,.24);
}
.contact-status.is-error{
  background:rgba(160,40,60,.18);
  border:1px solid rgba(255,120,140,.24);
}
body.theme-light .contact-form input,
body.theme-light .contact-form select,
body.theme-light .contact-form textarea{
  background:rgba(255,255,255,.82);
  color:#1a1d2e;
}

/* Engineer Your Intelligence — auto-fit slogan */
.engineer-slogan{ font-size: 28px; }
@media (min-width: 480px){ .engineer-slogan{ font-size: 36px; } }
@media (min-width: 768px){ .engineer-slogan{ font-size: 26px; } }
@media (min-width: 1024px){ .engineer-slogan{ font-size: 32px; } }
@media (min-width: 1200px){ .engineer-slogan{ font-size: 42px; } }
@media (min-width: 1400px){ .engineer-slogan{ font-size: 52px; } }
