/* =========================================================
   CONTACT CTA — Premium control room
   ========================================================= */

.cta{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:100svh;
  display:flex;
  align-items:center;
  padding:240px 6vw;
  background:#050506;
}

/* ---------- Atmosphere ---------- */
.cta-bg{
  position:absolute; inset:-4%;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  transition:transform .4s ease-out;
}
.cta-bg::before{
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 50% 32%, rgba(125,255,179,.08), transparent 46%),
    linear-gradient(180deg, #06070a 0%, #030304 55%, #050506 100%);
}

.cta-grid{
  position:absolute; inset:0;
  opacity:.16;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(circle at 50% 42%, #000 0%, transparent 68%);
  -webkit-mask-image:radial-gradient(circle at 50% 42%, #000 0%, transparent 68%);
  animation:ctaGridDrift 34s linear infinite, ctaGridPulse 9s ease-in-out infinite;
  transition:opacity 1s ease;
}
@keyframes ctaGridDrift{
  0%{ background-position:0 0; }
  100%{ background-position:46px 46px; }
}
@keyframes ctaGridPulse{
  0%,100%{ opacity:.13; }
  50%{ opacity:.2; }
}

.cta-orb{
  position:absolute; border-radius:50%;
  filter:blur(110px); opacity:.14;
  transition:opacity 1s ease;
}
.cta-orb-a{
  width:44vw; aspect-ratio:1; left:-14vw; top:-8vw;
  background:#40ffab;
  animation:ctaFloatA 16s ease-in-out infinite;
}
.cta-orb-b{
  width:38vw; aspect-ratio:1; right:-12vw; bottom:-16vw;
  background:#5c8bff; opacity:.09;
  animation:ctaFloatB 20s ease-in-out infinite;
}
@keyframes ctaFloatA{ 0%,100%{ transform:translate(0,0); } 50%{ transform:translate(3vw,4vw); } }
@keyframes ctaFloatB{ 0%,100%{ transform:translate(0,0); } 50%{ transform:translate(-3vw,-3vw); } }

.cta-spotlight{
  position:absolute; inset:0;
  background:radial-gradient(circle at 50% 30%, rgba(125,255,179,.22), transparent 55%);
  opacity:0;
  transition:opacity 1.1s ease;
}

.cta-particles{
  position:absolute; inset:0;
  width:100%; height:100%;
  opacity:.5;
  transition:opacity .8s ease;
}

/* Focus reactivity — "the whole section becomes brighter" */
.cta.is-active .cta-spotlight{ opacity:1; }
.cta.is-active .cta-grid{ opacity:.26; }
.cta.is-active .cta-orb-a{ opacity:.22; }
.cta.is-active .cta-orb-b{ opacity:.15; }
.cta.is-active .cta-particles{ opacity:.8; }

/* ---------- Content ---------- */
.cta-inner{
  position:relative; z-index:2;
  width:100%; min-width:0;
  max-width:860px; margin:0 auto;
  text-align:center;
}

.cta .section-tag{ display:block; }

.cta-headline{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(38px,6.8vw,106px);
  line-height:.98;
  letter-spacing:-.03em;
  margin-top:22px;
  color:var(--fg);
  overflow-wrap:break-word;
}
.cta-headline em{
  font-style:normal;
  background:linear-gradient(100deg,#f2fff8,#7dffb3 55%,#4fd696);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:0 0 60px rgba(125,255,179,.25);
}

.cta-subtitle{
  margin:42px auto 0;
  max-width:600px;
  font-family:var(--font-body);
  font-size:clamp(15px,1.6vw,19px);
  line-height:1.75;
  color:var(--fg-dim);
}

/* =========================================================
   PROJECT TERMINAL
   ========================================================= */
.term-wrap{
  position:relative;
  margin:100px auto 0;
  width:min(560px,100%);
}

/* ---------- Floating micro interface cards (desktop only) ---------- */
.term-orbit{ display:none; }
@media (min-width:1180px){
  .term-orbit{
    display:block;
    position:absolute; inset:0;
    pointer-events:none;
    z-index:1;
  }
  .term-card{
    position:absolute;
    display:inline-flex; align-items:center; gap:8px;
    max-width:210px;
    padding:11px 18px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.09);
    background:rgba(20,24,22,.5);
    backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
    box-shadow:0 20px 44px rgba(0,0,0,.35);
    font-family:var(--font-body); font-size:12.5px; color:var(--fg-dim);
    white-space:nowrap;
    animation:termCardFloat 7s ease-in-out infinite;
  }
  .term-card i{
    font-style:normal; color:var(--accent);
    text-shadow:0 0 10px rgba(125,255,179,.7);
  }
  .tc-1{ right:100%; margin-right:28px; top:0; animation-duration:7.5s; }
  .tc-2{ left:100%; margin-left:28px; top:8%; animation-duration:8.5s; animation-delay:.6s; }
  .tc-3{ left:100%; margin-left:28px; top:62%; animation-duration:6.8s; animation-delay:1.2s; }
  .tc-4{ right:100%; margin-right:28px; top:70%; animation-duration:8s; animation-delay:.3s; }
  .tc-5{ left:50%; transform:translateX(-50%); bottom:-58px; animation-duration:7.2s; animation-delay:1.6s; }
}
@media (min-width:1180px) and (max-width:1420px){
  .term-card{ font-size:11.5px; padding:9px 14px; max-width:170px; }
  .tc-1, .tc-4{ margin-right:18px; }
  .tc-2, .tc-3{ margin-left:18px; }
}
@keyframes termCardFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-12px); }
}

/* ---------- Panel ---------- */
.terminal{
  position:relative;
  z-index:2;
  padding:36px 34px 30px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
  backdrop-filter:blur(28px); -webkit-backdrop-filter:blur(28px);
  box-shadow:0 40px 100px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
  perspective:1200px;
  transform-style:preserve-3d;
  --tilt-x:0deg; --tilt-y:0deg;
  transform:rotateX(var(--tilt-y)) rotateY(var(--tilt-x));
  transition:border-color .5s ease, box-shadow .5s ease, transform .3s ease-out;
}
.terminal.is-active{
  border-color:rgba(125,255,179,.34);
  box-shadow:0 40px 110px rgba(0,0,0,.55), 0 0 70px rgba(125,255,179,.14), inset 0 1px 0 rgba(255,255,255,.08);
}

.terminal-scan{
  position:absolute; inset:0;
  background:linear-gradient(100deg, transparent 40%, rgba(125,255,179,.06) 50%, transparent 60%);
  background-size:220% 220%;
  background-position:-60% -60%;
  opacity:.5;
  pointer-events:none;
  animation:termScanIdle 11s ease-in-out infinite;
}
.terminal.is-active .terminal-scan{
  opacity:1;
  animation:termScanActive 4.5s ease-in-out infinite;
}
.terminal.is-processing .terminal-scan{
  opacity:1;
  animation-duration:1.1s;
}
.terminal.is-processing .term-live-dot,
.terminal.is-processing .term-ok i{
  animation-duration:.55s;
}
@keyframes termScanIdle{
  0%{ background-position:-60% -60%; }
  100%{ background-position:160% 160%; }
}
@keyframes termScanActive{
  0%{ background-position:-60% -60%; }
  100%{ background-position:160% 160%; }
}

/* ---------- Header ---------- */
.terminal-header{
  position:relative; z-index:2;
  display:flex; align-items:center; gap:9px;
  padding-bottom:20px;
  margin-bottom:22px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.term-icon{ font-size:15px; filter:grayscale(.15) drop-shadow(0 0 6px rgba(125,255,179,.5)); }
.term-title{
  font-family:var(--font-code); font-size:11px; font-weight:500;
  letter-spacing:.2em; color:var(--fg-dim);
}
.term-live{
  margin-left:auto;
  display:flex; align-items:center; gap:6px;
  font-family:var(--font-code); font-size:10px; letter-spacing:.14em;
  color:rgba(125,255,179,.75);
}
.term-live-dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 8px 2px rgba(125,255,179,.75);
  animation:termLivePulse 2.2s ease-in-out infinite;
}
@keyframes termLivePulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }

/* ---------- Form / success stack (no layout shift) ---------- */
.terminal-interface{
  position:relative; z-index:2;
  display:grid;
}
.term-form, .terminal-success{ grid-area:1/1; }

/* ---------- Phone field: glass console readout ---------- */
.term-field{
  position:relative;
  display:flex; align-items:center; gap:12px;
  padding:16px 18px;
  border-radius:16px;
  background:rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.07);
  box-shadow:inset 0 2px 10px rgba(0,0,0,.35);
  transition:border-color .4s ease, box-shadow .4s ease, background .4s ease;
}
.terminal.is-active .term-field{
  border-color:rgba(125,255,179,.4);
  background:rgba(0,0,0,.32);
  box-shadow:inset 0 2px 14px rgba(0,0,0,.4), 0 0 26px rgba(125,255,179,.12);
}
.terminal.is-valid .term-field{
  border-color:rgba(125,255,179,.6);
  box-shadow:inset 0 2px 14px rgba(0,0,0,.4), 0 0 34px rgba(125,255,179,.2);
}
.terminal.is-valid .term-btn{
  border-color:rgba(125,255,179,.55);
  box-shadow:0 18px 55px rgba(125,255,179,.16), 0 0 46px rgba(125,255,179,.16);
}
.term-field.is-error{
  border-color:rgba(255,138,122,.6) !important;
  box-shadow:inset 0 2px 14px rgba(0,0,0,.4), 0 0 26px rgba(255,138,122,.18) !important;
}

.term-prefix{
  flex-shrink:0;
  font-family:var(--font-code); font-size:15px;
  color:var(--fg-dim);
  letter-spacing:.01em;
}

.term-cells{
  display:flex; align-items:center; gap:5px;
  flex:1;
}
.term-cell{
  position:relative;
  width:26px; height:34px;
  display:flex; align-items:center; justify-content:center;
  border-radius:8px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.09);
  font-family:var(--font-code); font-size:16px; font-weight:500;
  color:var(--fg);
  transition:border-color .3s ease, background .3s ease, box-shadow .3s ease;
}
.term-cell-gap{ width:7px; flex-shrink:0; }
.term-cell.is-filled{
  border-color:rgba(125,255,179,.45);
  background:rgba(125,255,179,.07);
  box-shadow:0 0 12px rgba(125,255,179,.15);
}
.term-cell.is-caret::after{
  content:'';
  position:absolute; left:50%; top:50%;
  width:2px; height:56%;
  transform:translate(-50%,-50%);
  background:var(--accent);
  box-shadow:0 0 6px rgba(125,255,179,.8);
  animation:termCaretBlink 1s steps(1,end) infinite;
}
@keyframes termCaretBlink{ 0%,49%{ opacity:1; } 50%,100%{ opacity:0; } }

.term-input{
  position:absolute; inset:0;
  width:100%; height:100%;
  border:0; outline:0; padding:0;
  background:transparent; color:transparent; caret-color:transparent;
  -webkit-text-fill-color:transparent;
}

/* ---------- System status rows ---------- */
.term-rows{
  list-style:none;
  margin:22px 0 24px;
  display:flex; flex-direction:column; gap:10px;
}
.term-rows li{
  display:flex; align-items:center; justify-content:space-between;
  font-family:var(--font-code); font-size:11.5px; letter-spacing:.04em;
  color:var(--fg-dim);
  opacity:.5;
  transition:opacity .5s ease;
}
.terminal.is-active .term-rows li{ opacity:1; }
.terminal.is-active .term-rows li:nth-child(1){ transition-delay:.05s; }
.terminal.is-active .term-rows li:nth-child(2){ transition-delay:.16s; }
.terminal.is-active .term-rows li:nth-child(3){ transition-delay:.27s; }

.term-ok{
  display:inline-flex; align-items:center; gap:6px;
  color:rgba(125,255,179,.85);
  font-weight:500; letter-spacing:.08em;
}
.term-ok i{
  width:6px; height:6px; border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 8px 2px rgba(125,255,179,.7);
  animation:termLivePulse 2.4s ease-in-out infinite;
}

/* ---------- Submit: system command, not a button ---------- */
.term-btn{
  position:relative;
  width:100%;
  display:flex; align-items:center; justify-content:center; gap:10px;
  min-height:58px;
  padding:0 24px;
  border-radius:14px;
  border:1px solid rgba(125,255,179,.32);
  background:linear-gradient(135deg, rgba(125,255,179,.1), rgba(125,255,179,.02));
  cursor:pointer;
  overflow:hidden;
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .45s cubic-bezier(.16,1,.3,1), border-color .4s ease, box-shadow .4s ease;
}
.term-btn::before{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.12) 48%, transparent 66%);
  background-size:220% 220%;
  background-position:-40% -40%;
  opacity:0;
  transition:opacity .4s ease;
  pointer-events:none;
}
.term-btn:hover::before{ opacity:1; animation:termBtnSheen 1.4s ease forwards; }
@keyframes termBtnSheen{ to{ background-position:140% 140%; } }

.term-btn:hover{
  border-color:rgba(125,255,179,.6);
  box-shadow:0 18px 55px rgba(125,255,179,.18), 0 0 50px rgba(125,255,179,.15);
}
.term-btn:active{ transform:translateY(-1px) scale(.985) !important; }

.term-btn-bracket{
  font-family:var(--font-code); font-weight:600; font-size:17px;
  color:var(--accent);
  transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.term-btn:hover .term-btn-bracket:first-child{ transform:translateX(-5px); }
.term-btn:hover .term-btn-bracket:last-child{ transform:translateX(5px); }
.term-btn-label{
  font-family:var(--font-body); font-weight:600; font-size:15.5px; letter-spacing:.01em;
  color:var(--fg);
}

.term-form.shake{ animation:ctaShake .4s ease; }
@keyframes ctaShake{
  0%,100%{ transform:translateX(0); }
  25%{ transform:translateX(-6px); }
  75%{ transform:translateX(6px); }
}
.terminal.is-success .term-form{
  opacity:0; transform:translateY(-8px) scale(.98); pointer-events:none;
  transition:opacity .5s ease, transform .5s ease;
}

/* ---------- Success state ---------- */
.terminal-success{
  align-self:center; justify-self:center;
  width:100%;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  padding:40px 10px;
  text-align:center;
  opacity:0; transform:translateY(10px) scale(.98);
  pointer-events:none;
  transition:opacity .6s ease .1s, transform .6s ease .1s;
}
.terminal.is-success .terminal-success{
  opacity:1; transform:translateY(0) scale(1);
  pointer-events:auto;
}
.terminal-success strong{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(21px,2.6vw,28px);
  background:linear-gradient(100deg,#f2fff8,#7dffb3 55%,#4fd696);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.terminal-success p{
  font-family:var(--font-body); font-size:14.5px; color:var(--fg-dim);
  max-width:340px;
}
.term-success-ring{
  position:absolute; left:50%; top:38%;
  width:110px; height:110px; border-radius:50%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(125,255,179,.5);
  opacity:0;
  pointer-events:none;
}
.terminal.is-success .term-success-ring{
  animation:termConfirmRing 1.1s cubic-bezier(.16,1,.3,1);
}
@keyframes termConfirmRing{
  0%{ opacity:.9; transform:translate(-50%,-50%) scale(.3); }
  100%{ opacity:0; transform:translate(-50%,-50%) scale(2.6); }
}

/* ---------- Trust indicators ---------- */
.cta-trust{
  margin:76px auto 0;
  display:flex; flex-wrap:wrap; justify-content:center; gap:14px 36px;
  list-style:none;
}
.cta-trust li{
  display:flex; align-items:center; gap:9px;
  font-family:var(--font-body); font-size:14px; color:var(--fg-dim);
}
.cta-check{
  display:inline-flex; align-items:center; justify-content:center;
  width:18px; height:18px; border-radius:50%;
  background:rgba(125,255,179,.12); color:var(--accent);
  font-size:10px; line-height:1;
}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .cta{ padding:200px 6vw; }
}
@media (max-width:760px){
  .cta{ padding:130px 6vw 110px; min-height:auto; }
  .cta-headline{ font-size:clamp(24px,8vw,44px); margin-top:18px; }
  .cta-subtitle{ margin-top:30px; }

  .term-wrap{ margin-top:60px; }
  .terminal{ padding:26px 18px 22px; border-radius:22px; }
  .terminal-header{ padding-bottom:16px; margin-bottom:18px; }

  .term-field{ padding:13px 12px; gap:8px; }
  .term-prefix{ font-size:13px; }
  .term-cell{ width:20px; height:30px; font-size:13.5px; border-radius:7px; }
  .term-cell-gap{ width:5px; }

  .term-rows{ margin:18px 0 20px; gap:8px; }
  .term-rows li{ font-size:10.5px; }

  .term-btn{ min-height:54px; }
  .term-btn-label{ font-size:14px; }

  .terminal-success{ padding:26px 4px; }

  .cta-trust{
    margin-top:56px;
    flex-direction:column; align-items:flex-start; gap:16px;
    width:max-content; margin-left:auto; margin-right:auto;
  }
}

@media (prefers-reduced-motion: reduce){
  .cta-grid, .cta-orb-a, .cta-orb-b, .cta-particles,
  .terminal-scan, .term-live-dot, .term-ok i, .term-card,
  .term-cell.is-caret::after{ animation:none !important; }
  .terminal{ transform:none !important; }
}