/* ═══════════════════════════════════════════════
   Aevilostudio — main.css
   Design tokens → Layout → Components → Sections
═══════════════════════════════════════════════ */

/* ── Tokens ─────────────────────────────────── */
:root {
    --bg:       #0B0F19;
    --bg-card:  #111724;
    --bg-card2: #161d2e;
    --purple:   #7C6FF0;
    --purple-d: #5a4fd4;
    --purple-l: #a99ff7;
    --cyan:     #00baff;
    --white:    #FFFFFF;
    --muted:    #8892a4;
    --muted-l:  #AAB2C8;
    --border:   rgba(255,255,255,0.06);
    --border-p: rgba(124,111,240,0.25);
    --border-c: rgba(0,212,255,0.2);
    --fh:       'Space Grotesk', sans-serif;
    --fb:       'Inter', sans-serif;
    --ease:     cubic-bezier(0.16,1,0.3,1);
}

/* ── Reset ───────────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
    background:var(--bg);
    color:var(--white);
    font-family:var(--fb);
    font-size:16px;
    line-height:1.6;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}

/* ── Grid overlay ────────────────────────────── */
body::before {
    content:'';
    position:fixed;
    inset:0;
    background-image:
            linear-gradient(rgba(124,111,240,0.03) 1px, transparent 1px),
            linear-gradient(90deg, rgba(124,111,240,0.03) 1px, transparent 1px);
    background-size:72px 72px;
    pointer-events:none;
    z-index:0;
}

/* ── Orbs ────────────────────────────────────── */
.orb {
    position:fixed;
    border-radius:50%;
    filter:blur(130px);
    pointer-events:none;
    z-index:0;
    will-change:transform;
    transform:translateZ(0);
}
.orb-1 { width:800px; height:800px; background:radial-gradient(circle,rgba(124,111,240,0.1),transparent 65%); top:-300px; left:-250px; }
.orb-2 { width:600px; height:600px; background:radial-gradient(circle,rgba(0,212,255,0.07),transparent 65%); top:25vh; right:-180px; }
.orb-3 { width:500px; height:500px; background:radial-gradient(circle,rgba(124,111,240,0.07),transparent 65%); bottom:5vh; left:25%; }

/* ── Typography ──────────────────────────────── */
h1, h2, h3, h4, h5 { font-family:var(--fh); letter-spacing:-0.02em; }
h1 { font-size:clamp(38px,5.5vw,72px); font-weight:700; line-height:1.08; }
h2 { font-size:clamp(28px,3.5vw,48px); font-weight:700; line-height:1.12; }
h3 { font-size:clamp(18px,2vw,22px);   font-weight:600; line-height:1.3; }
h4 { font-size:17px; font-weight:600; }
.label { display:inline-block; font-size:10px; font-weight:600; letter-spacing:2.5px; text-transform:uppercase; color:var(--cyan); margin-bottom:18px; }
.t-muted  { color:var(--muted-l); font-size:15px; line-height:1.8; }
.t-purple { color:var(--purple-l); }
.t-cyan   { color:var(--cyan); }

/* ── Layout ──────────────────────────────────── */
.container     { max-width:1380px; margin:0 auto; padding:0 48px; position:relative; z-index:1; }
.section-pad   { padding:120px 0; }
.section-center{ text-align:center; max-width:560px; margin:0 auto 72px; }
.grad-line     { height:1px; background:linear-gradient(90deg,transparent,rgba(124,111,240,0.25),transparent); position:relative; z-index:1; }

/* ── Scroll reveal ───────────────────────────── */
.reveal { opacity:0; transform:translateY(26px); transition:opacity 0.7s var(--ease), transform 0.7s var(--ease); }
.reveal.in { opacity:1; transform:none; }
.d1 { transition-delay:0.08s; }
.d2 { transition-delay:0.16s; }
.d3 { transition-delay:0.24s; }
.d4 { transition-delay:0.32s; }

/* ── Gradient text ───────────────────────────── */
.grad {
    background:linear-gradient(100deg, var(--purple-l) 0%, var(--cyan) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
}

/* ════════════════════════════════════════════
   ANNOUNCEMENT BAR
════════════════════════════════════════════ */
.announce-bar {
    position:fixed;
    top:0; left:0; right:0;
    z-index:200;
    background:linear-gradient(90deg,rgba(124,111,240,0.15),rgba(0,186,255,0.1),rgba(124,111,240,0.15));
    border-bottom:1px solid var(--border-p);
    padding:9px 48px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:500;
    color:var(--muted-l);
    gap:12px;
    backdrop-filter:blur(12px);
    transition:transform 0.4s var(--ease);
}
.announce-bar.hidden { transform:translateY(-100%); }
.announce-bar a { color:var(--cyan); text-decoration:none; font-weight:600; }
.announce-bar a:hover { text-decoration:underline; }
.announce-bar i { color:var(--purple-l); }
.announce-close {
    position:absolute; right:20px;
    background:transparent; border:none; cursor:pointer;
    color:var(--muted); font-size:16px; padding:4px; line-height:1;
    transition:color 0.2s;
}
.announce-close:hover { color:var(--white); }

/* ════════════════════════════════════════════
   NAV
════════════════════════════════════════════ */
nav {
    position:fixed; top:36px; left:0; right:0; z-index:100;
    padding:20px 0;
    transition:all 0.4s var(--ease);
}
nav.scrolled {
    top:0;
    background:rgba(11,15,25,0.9);
    backdrop-filter:blur(24px);
    -webkit-backdrop-filter:blur(24px);
    border-bottom:1px solid var(--border);
    padding:14px 0;
}
.announce-bar.hidden ~ nav { top:0; }
.nav-inner { display:flex; align-items:center; justify-content:space-between; }

.nav-logo {
    font-family:var(--fh);
    font-size:40px;
    font-weight:700;
    color:var(--white);
    text-decoration:none;
    letter-spacing:-0.04em;
    display:flex;
    align-items:center;
    line-height:1;
}
.nav-logo em { font-style:normal; color:var(--cyan); }
.nav-logo em::after { display:none; }
.nav-logo-text { display:flex; flex-direction:column; line-height:1; }
.nav-logo-tagline { font-size:12px; margin-left: 4px; font-weight:bolder; letter-spacing:8px; color:var(--muted); margin-top:2px; text-transform:uppercase; }
.nav-logo-img {
    height:70px;
    width:auto;
    display:block;
    mix-blend-mode:lighten;
}
.nav-links { display:flex; align-items:center; gap:4px; }
.nav-link  { font-size:14px; font-weight:500; color:var(--muted); text-decoration:none; padding:7px 14px; border-radius:8px; transition:all 0.2s; }
.nav-link:hover { color:var(--white); background:rgba(255,255,255,0.05); }
.btn-book  {
    background:rgba(124,111,240,0.12); border:1px solid var(--border-p);
    color:var(--purple-l); font-family:var(--fb); font-size:13px; font-weight:600;
    padding:9px 20px; border-radius:9px; text-decoration:none;
    transition:all 0.2s; display:inline-flex; align-items:center; gap:7px;
}
.btn-book:hover { background:rgba(124,111,240,0.22); border-color:var(--purple); color:var(--white); }
.hamburger { display:none; flex-direction:column; gap:5px; background:transparent; border:1px solid var(--border); border-radius:8px; padding:9px 11px; cursor:pointer; }
.hamburger span { display:block; width:18px; height:1.5px; background:var(--muted-l); border-radius:2px; }
.mob-nav {
    display:none; position:fixed; top:60px; left:0; right:0; z-index:99;
    background:rgba(11,15,25,0.97); backdrop-filter:blur(24px);
    border-bottom:1px solid var(--border); padding:16px 24px 24px;
}
.mob-nav a { display:block; font-size:15px; color:var(--muted-l); text-decoration:none; padding:13px 0; border-bottom:1px solid var(--border); }
.mob-nav-cta {
    margin-top:16px !important; border-bottom:none !important;
    display:inline-flex !important; align-items:center; gap:8px;
    background:var(--purple) !important; color:var(--white) !important;
    border-radius:9px; padding:12px 20px !important; font-weight:600 !important;
    font-size:14px !important;
}

/* ════════════════════════════════════════════
   BUTTONS
════════════════════════════════════════════ */
.btn-primary {
    display:inline-flex; align-items:center; gap:8px;
    background:var(--purple); color:var(--white);
    font-family:var(--fb); font-size:14px; font-weight:600;
    padding:13px 28px; border-radius:10px;
    text-decoration:none; border:none; cursor:pointer;
    transition:all 0.25s var(--ease);
}
.btn-primary:hover { background:var(--purple-d); transform:translateY(-1px); box-shadow:0 8px 32px rgba(124,111,240,0.35); }
.btn-lg { padding:15px 34px; font-size:15px; }
.btn-ghost {
    display:inline-flex; align-items:center; gap:8px;
    background:transparent; color:var(--muted-l);
    font-family:var(--fb); font-size:14px; font-weight:500;
    padding:13px 28px; border-radius:10px;
    text-decoration:none; border:1px solid var(--border);
    transition:all 0.25s;
}
.btn-ghost:hover { border-color:rgba(255,255,255,0.14); color:var(--white); background:rgba(255,255,255,0.04); }

/* ════════════════════════════════════════════
   HERO
════════════════════════════════════════════ */
.hero { min-height:100vh; display:flex; align-items:center; padding:160px 0 110px; position:relative; z-index:1; }
.hero-inner { display:grid; grid-template-columns:1fr 460px; gap:72px; align-items:center; }
.hero-tag {
    display:inline-flex; align-items:center; gap:10px;
    background:rgba(11,15,25,0.7); border:1px solid var(--border-p);
    border-radius:100px; padding:7px 16px 7px 10px; margin-bottom:32px;
    font-size:12px; font-weight:500; color:var(--muted-l);
}
.pulse { width:7px; height:7px; border-radius:50%; background:var(--cyan); animation:pulse-anim 2.4s ease-in-out infinite; flex-shrink:0; }
@keyframes pulse-anim { 0%,100% { box-shadow:0 0 0 0 rgba(0,212,255,0.4); } 50% { box-shadow:0 0 0 6px rgba(0,212,255,0); } }

.hero-title { margin-bottom:24px; }
.hero-sub { font-size:17px; color:var(--muted-l); line-height:1.8; max-width:500px; margin-bottom:40px; }

/* Hero CTA row */
.hero-cta-row { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:52px; }

/* Hero trust row */
.hero-trust-row {
    display:flex; align-items:center; gap:0;
    border:1px solid var(--border); border-radius:14px;
    background:rgba(255,255,255,0.02);
    overflow:hidden;
    max-width:fit-content;
}
.ht-item { padding:16px 28px; text-align:center; }
.ht-num { display:block; font-family:var(--fh); font-size:18px; font-weight:700; color:var(--white); letter-spacing:-0.03em; line-height:1; margin-bottom:4px; }
.ht-lbl { display:block; font-size:11px; color:var(--muted); font-weight:500; white-space:nowrap; }
.ht-div { width:1px; background:var(--border); align-self:stretch; }

/* ── Terminal card ───────────────────────────── */
.terminal { background:var(--bg-card); border:1px solid var(--border); border-radius:18px; overflow:hidden; animation:float 7s ease-in-out infinite; box-shadow:0 40px 100px rgba(0,0,0,0.5); will-change:transform; }
@keyframes float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-12px); } }
.term-bar { display:flex; align-items:center; gap:7px; padding:14px 18px; background:rgba(255,255,255,0.02); border-bottom:1px solid var(--border); }
.t-dot { width:10px; height:10px; border-radius:50%; }
.term-body { padding:24px; font-family:'Courier New',monospace; font-size:13px; line-height:2; }
.tc { color:#3d4a5c; } .tk { color:var(--purple-l); } .ts { color:var(--cyan); } .tv { color:#68d391; } .tb { color:var(--muted); }
.cursor { display:inline-block; width:8px; height:14px; background:var(--cyan); border-radius:1px; margin-left:2px; animation:blink 1.1s step-end infinite; vertical-align:middle; }
@keyframes blink { 0%,100% { opacity:1; } 50% { opacity:0; } }
.metrics-row { display:flex; gap:14px; margin-top:16px; }
.metric-card { flex:1; background:var(--bg-card); border:1px solid var(--border); border-radius:14px; padding:18px; animation:float 7s ease-in-out infinite; will-change:transform; }
.metric-card:nth-child(2) { animation-delay:-3.5s; }
.mc-badge { font-size:10px; font-weight:600; padding:3px 9px; border-radius:100px; display:inline-block; margin-bottom:8px; }
.mc-live   { background:rgba(0,200,100,0.08); color:#3ecf8e; border:1px solid rgba(0,200,100,0.15); }
.mc-purple { background:rgba(124,111,240,0.08); color:var(--purple-l); border:1px solid var(--border-p); }
.mc-num { font-family:var(--fh); font-size:26px; font-weight:700; letter-spacing:-0.03em; margin-bottom:2px; }
.mc-lbl { font-size:11px; color:var(--muted); font-weight:500; }

/* ════════════════════════════════════════════
   MARQUEE
════════════════════════════════════════════ */
.marquee-wrap { padding:36px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); overflow:hidden; position:relative; z-index:1; }
.marquee-lbl  { text-align:center; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--muted); margin-bottom:22px; }
.marquee-track { display:flex; gap:56px; width:max-content; animation:marquee 22s linear infinite; }
@keyframes marquee { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }
.mq-item { font-family:var(--fh); font-size:14px; font-weight:600; color:rgba(170,178,200,0.22); white-space:nowrap; letter-spacing:0.3px; }
.mq-sep  { color:rgba(170,178,200,0.1); font-family:var(--fh); font-size:14px; font-weight:600; white-space:nowrap; }

/* ════════════════════════════════════════════
   WHY US SECTION
════════════════════════════════════════════ */
.why-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:48px;
}
.why-card {
    background:var(--bg-card);
    border:1px solid var(--border);
    border-radius:18px;
    padding:36px 28px;
    transition:border-color 0.3s, transform 0.3s, background 0.3s;
    position:relative;
    overflow:hidden;
}
.why-card::after {
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,rgba(124,111,240,0.04),transparent 60%);
    opacity:0;
    transition:opacity 0.3s;
    pointer-events:none;
}
.why-card:hover { border-color:var(--border-p); transform:translateY(-4px); }
.why-card:hover::after { opacity:1; }
.why-icon {
    width:48px; height:48px; border-radius:14px;
    display:flex; align-items:center; justify-content:center;
    font-size:20px; margin-bottom:22px; border:1px solid;
}
.why-card h3 { margin-bottom:12px; font-size:17px; }
.why-card p  { font-size:13.5px; color:var(--muted-l); line-height:1.75; margin:0; }

/* ── Mid-page inline CTA ── */
.mid-cta {
    display:flex; align-items:center; justify-content:space-between; gap:24px;
    background:linear-gradient(135deg,rgba(124,111,240,0.08),rgba(0,186,255,0.05));
    border:1px solid var(--border-p);
    border-radius:16px;
    padding:28px 36px;
    flex-wrap:wrap;
}
.mid-cta-text { display:flex; flex-direction:column; gap:4px; }
.mid-cta-text strong { font-size:16px; font-weight:600; color:var(--white); }
.mid-cta-text span   { font-size:13.5px; color:var(--muted-l); }

/* ════════════════════════════════════════════
   CAPABILITIES
════════════════════════════════════════════ */
.cap-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border-radius:18px; overflow:hidden; }
.cap-card { background:var(--bg); padding:48px 36px; transition:background 0.3s; position:relative; overflow:hidden; }
.cap-card::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,var(--purple),transparent); opacity:0; transition:opacity 0.3s; }
.cap-card:hover { background:var(--bg-card); }
.cap-card:hover::before { opacity:1; }
.cap-num  { font-size:11px; font-weight:600; letter-spacing:2px; color:var(--muted); margin-bottom:32px; display:block; }
.cap-icon { width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:18px; margin-bottom:22px; border:1px solid var(--border); }
.cap-card h3 { margin-bottom:14px; font-size:20px; }
.cap-card p  { font-size:14px; color:var(--muted-l); line-height:1.75; margin:0; }

/* ════════════════════════════════════════════
   PROCESS
════════════════════════════════════════════ */
.process-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.proc-card { background:var(--bg-card); border:1px solid var(--border); border-radius:16px; padding:36px 32px; transition:border-color 0.3s,transform 0.3s; }
.proc-card:hover { border-color:var(--border-p); transform:translateY(-3px); }
.step-n { font-size:10px; font-weight:700; letter-spacing:2px; color:var(--purple-l); margin-bottom:16px; display:block; }
.proc-card h4 { margin-bottom:12px; font-size:17px; }
.proc-card p  { font-size:14px; color:var(--muted-l); line-height:1.75; margin:0; }

/* ════════════════════════════════════════════
   WORK
════════════════════════════════════════════ */
.work-main { background:var(--bg-card); border:1px solid var(--border); border-radius:20px; padding:48px; position:relative; overflow:hidden; transition:border-color 0.3s; margin-bottom:20px; }
.work-main:hover { border-color:var(--border-c); }
.work-glow { position:absolute; width:400px; height:400px; border-radius:50%; filter:blur(90px); pointer-events:none; top:-150px; right:-100px; background:radial-gradient(circle,rgba(0,212,255,0.05),transparent 65%); }
.work-row  { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
.w-badge   { display:inline-flex; align-items:center; gap:7px; font-size:10px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; padding:5px 12px; border-radius:100px; margin-bottom:20px; }
.wb-live   { background:rgba(0,200,100,0.08); color:#3ecf8e; border:1px solid rgba(0,200,100,0.15); }
.wb-nda    { background:rgba(170,178,200,0.05); color:var(--muted); border:1px solid var(--border); }
.wb-dev    { background:rgba(124,111,240,0.08); color:var(--purple-l); border:1px solid var(--border-p); }
.work-industry { font-size:12px; color:var(--muted); margin-bottom:20px; letter-spacing:0.3px; }
.work-desc { font-size:15px; color:var(--muted-l); line-height:1.8; margin-bottom:28px; }
.tag { display:inline-block; font-size:11px; font-weight:500; color:var(--muted); background:rgba(255,255,255,0.04); border:1px solid var(--border); padding:4px 11px; border-radius:100px; margin:3px; }
.outcome-row { display:flex; gap:0; margin-top:32px; padding-top:28px; border-top:1px solid var(--border); }
.o-stat { flex:1; padding:0 24px; border-right:1px solid var(--border); }
.o-stat:first-child { padding-left:0; }
.o-stat:last-child  { border-right:none; }
.o-num { font-family:var(--fh); font-size:24px; font-weight:700; color:var(--cyan); letter-spacing:-0.03em; }
.o-lbl { font-size:11px; color:var(--muted); margin-top:2px; }
.work-mini-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.work-mini { background:var(--bg-card); border:1px solid var(--border); border-radius:16px; padding:32px 28px; transition:border-color 0.3s,transform 0.3s; }
.work-mini:hover { border-color:var(--border-p); transform:translateY(-3px); }
.work-mini h4 { margin:12px 0 10px; font-size:16px; }
.work-mini p  { font-size:13px; color:var(--muted-l); line-height:1.7; margin:0; }
.live-panel   { background:var(--bg); border:1px solid var(--border); border-radius:14px; padding:28px; height:100%; }
.lp-title { font-size:10px; color:var(--muted); letter-spacing:1px; text-transform:uppercase; margin-bottom:20px; }
.lp-row   { display:flex; justify-content:space-between; align-items:center; padding:12px 0; border-bottom:1px solid var(--border); }
.lp-row:last-of-type { border-bottom:none; }
.lp-label { font-size:13px; color:var(--muted-l); }
.lp-val   { font-family:var(--fh); font-weight:700; font-size:15px; }
.lp-bar   { height:4px; border-radius:100px; background:rgba(255,255,255,0.06); margin-top:20px; }
.lp-fill  { height:100%; border-radius:100px; background:linear-gradient(90deg,var(--purple),var(--cyan)); width:99%; }
.lp-note  { font-size:10px; color:var(--muted); margin-top:6px; }

/* ════════════════════════════════════════════
   STACK
════════════════════════════════════════════ */
.stack-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(100px,1fr)); gap:12px; }
.stack-item { background:var(--bg-card); border:1px solid var(--border); border-radius:12px; padding:18px 12px; text-align:center; font-size:13px; font-weight:600; color:var(--muted); transition:all 0.2s; }
.stack-item:hover { border-color:var(--border-p); color:var(--white); background:var(--bg-card2); }
.stack-item i { display:block; font-size:20px; margin-bottom:8px; color:var(--muted); transition:color 0.2s; }
.stack-item:hover i { color:var(--purple-l); }

/* ════════════════════════════════════════════
   TESTIMONIAL
════════════════════════════════════════════ */
.testi-card { background:var(--bg-card); border:1px solid var(--border); border-radius:20px; padding:56px 64px; position:relative; overflow:hidden; max-width:780px; margin:0 auto; text-align:center; }
.testi-card::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,var(--purple),var(--cyan),transparent); }
.quote-mark { font-family:var(--fh); font-size:72px; font-weight:700; color:rgba(124,111,240,0.18); line-height:1; margin-bottom:20px; display:block; }
.quote-text { font-size:18px; color:var(--muted-l); line-height:1.85; font-style:italic; margin-bottom:36px; }
.quote-author { display:flex; align-items:center; justify-content:center; gap:14px; }
.q-avatar { width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--purple),var(--cyan)); display:flex; align-items:center; justify-content:center; font-family:var(--fh); font-size:14px; font-weight:700; color:var(--white); }
.q-name { font-size:14px; font-weight:600; color:var(--white); }
.q-role { font-size:12px; color:var(--muted); margin-top:2px; }

/* ════════════════════════════════════════════
   CTA / CONTACT
════════════════════════════════════════════ */
.cta-wrap { padding:120px 0; position:relative; z-index:1; text-align:center; }
.cta-box  { background:var(--bg-card); border:1px solid var(--border); border-radius:24px; padding:80px 48px; position:relative; overflow:hidden; max-width:820px; margin:0 auto; }
.cta-box::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,var(--purple),var(--cyan),transparent); }
.cta-orb { position:absolute; width:500px; height:500px; border-radius:50%; filter:blur(120px); pointer-events:none; background:radial-gradient(circle,rgba(124,111,240,0.08),transparent 65%); top:50%; left:50%; transform:translate(-50%,-50%); }
.cta-box h2 { margin-bottom:20px; position:relative; z-index:1; }
.cta-box > p { font-size:16px; color:var(--muted-l); line-height:1.75; max-width:460px; margin:0 auto 32px; position:relative; z-index:1; }

/* CTA guarantee row */
.cta-guarantee-row {
    display:flex; align-items:center; justify-content:center; gap:24px;
    flex-wrap:wrap; margin-bottom:40px; position:relative; z-index:1;
}
.cta-g-item { display:flex; align-items:center; gap:7px; font-size:13px; color:var(--muted-l); }
.cta-g-item i { font-size:14px; }

.cta-actions { display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap; position:relative; z-index:1; }
.cta-note { font-size:12px; color:var(--muted); margin-top:22px; position:relative; z-index:1; }
.cta-note a { color:var(--cyan); text-decoration:none; }
.cta-note a:hover { text-decoration:underline; }

/* ── Contact form ─────────────────────────── */
.contact-form-wrap { max-width:640px; margin:48px auto 0; text-align:left; position:relative; z-index:1; }
.form-divider-text { text-align:center; font-size:12px; color:var(--muted); margin-bottom:28px; letter-spacing:0.5px; }
.form-row   { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group { margin-bottom:18px; }
.form-label { display:block; font-size:13px; font-weight:500; color:var(--muted-l); margin-bottom:8px; }
.form-ctrl  { width:100%; background:rgba(255,255,255,0.04); border:1px solid var(--border); border-radius:10px; color:var(--white); font-family:var(--fb); font-size:14px; padding:13px 16px; outline:none; transition:border-color 0.2s,background 0.2s; }
.form-ctrl:focus { border-color:var(--border-p); background:rgba(124,111,240,0.04); }
.form-ctrl::placeholder { color:rgba(170,178,200,0.35); }
textarea.form-ctrl { resize:vertical; min-height:120px; }
.field-error { display:block; font-size:12px; color:#f87171; margin-top:6px; min-height:18px; }
.btn-submit  { width:100%; justify-content:center; margin-top:8px; }
.form-success { display:flex; align-items:center; gap:10px; margin-top:18px; padding:14px 18px; background:rgba(0,200,100,0.08); border:1px solid rgba(0,200,100,0.15); border-radius:10px; font-size:14px; color:#3ecf8e; }
.form-error-banner { display:flex; align-items:center; gap:10px; margin-top:18px; padding:14px 18px; background:rgba(248,113,113,0.08); border:1px solid rgba(248,113,113,0.2); border-radius:10px; font-size:14px; color:#f87171; }

/* ════════════════════════════════════════════
   FOOTER CTA STRIP
════════════════════════════════════════════ */
.foot-cta-strip {
    background:linear-gradient(135deg,rgba(124,111,240,0.1),rgba(0,186,255,0.06));
    border-top:1px solid var(--border-p);
    border-bottom:1px solid var(--border);
    padding:40px 0;
    position:relative; z-index:1;
}
.foot-cta-inner {
    display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.foot-cta-hl  { font-family:var(--fh); font-size:20px; font-weight:700; color:var(--white); margin-bottom:4px; }
.foot-cta-sub { font-size:13px; color:var(--muted-l); }

/* ════════════════════════════════════════════
   FOOTER MAIN
════════════════════════════════════════════ */
.foot-main { padding:56px 0 36px; position:relative; z-index:1; }
.foot-grid  { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; }
.foot-brand {
    font-family:var(--fh); font-size:20px; font-weight:700;
    color:var(--white); margin-bottom:10px; letter-spacing:-0.04em; line-height:1;
}
.foot-brand em { font-style:normal; color:var(--cyan); }
.foot-desc  { font-size:13px; color:var(--muted); line-height:1.7; max-width:240px; margin-bottom:16px; }
.foot-badges { display:flex; flex-wrap:wrap; gap:8px; }
.foot-badge {
    display:inline-flex; align-items:center; gap:5px;
    font-size:11px; font-weight:500; color:var(--muted);
    background:rgba(255,255,255,0.03); border:1px solid var(--border);
    border-radius:100px; padding:4px 12px;
}
.foot-badge i { font-size:11px; color:var(--cyan); }
.foot-h     { font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--muted); margin-bottom:18px; }
.foot-a     { display:block; font-size:13px; color:var(--muted); text-decoration:none; margin-bottom:11px; transition:color 0.2s; }
.foot-a:hover { color:var(--white); }
.foot-a i   { margin-right:6px; font-size:12px; }
.foot-bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-top:48px; padding-top:28px; border-top:1px solid var(--border); }
.foot-copy   { font-size:12px; color:var(--muted); }
.social-row  { display:flex; gap:10px; }
.soc { width:34px; height:34px; border-radius:8px; display:flex; align-items:center; justify-content:center; border:1px solid var(--border); color:var(--muted); font-size:15px; text-decoration:none; transition:all 0.2s; }
.soc:hover { border-color:var(--border-p); color:var(--purple-l); background:rgba(124,111,240,0.08); }

/* ── AI Badge ── */
.ai-badge {
    font-family:var(--fb); font-size:10px; font-weight:600; letter-spacing:0.5px;
    color:var(--muted); background:rgba(124,111,240,0.12); border:1px solid var(--border-p);
    border-radius:100px; padding:3px 8px; vertical-align:super; margin-left:8px;
    white-space:nowrap; text-transform:none; line-height:1;
}

/* ── Gradient text ── */
.grad {
    background:linear-gradient(100deg, var(--purple-l) 0%, var(--cyan) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
}

/* ════════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════════ */
@media (max-width:1100px) {
    .why-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:960px) {
    .hero-inner       { grid-template-columns:1fr; }
    .hero-right       { display:none; }
    .cap-grid         { grid-template-columns:1fr; }
    .work-row         { grid-template-columns:1fr; }
    .work-mini-grid   { grid-template-columns:1fr; }
    .process-grid     { grid-template-columns:1fr; }
    .foot-grid        { grid-template-columns:1fr 1fr; }
    .testi-card       { padding:40px 28px; }
    .cta-box          { padding:56px 28px; }
    .form-row         { grid-template-columns:1fr; }
    .mid-cta          { flex-direction:column; text-align:center; align-items:center; }
    .foot-cta-inner   { flex-direction:column; text-align:center; align-items:center; }
}
@media (max-width:680px) {
    .nav-links, .btn-book { display:none !important; }
    .hamburger            { display:flex; }
    .section-pad          { padding:80px 0; }
    .container            { padding:0 20px; }
    h1 { font-size:34px; }
    h2 { font-size:26px; }
    .hero-trust-row       { flex-wrap:wrap; border-radius:12px; }
    .ht-item              { flex:1 1 calc(50% - 1px); min-width:100px; }
    .ht-div               { display:none; }
    .why-grid             { grid-template-columns:1fr; }
    .outcome-row          { flex-direction:column; gap:0; }
    .o-stat               { border-right:none; padding:16px 0; border-bottom:1px solid var(--border); }
    .o-stat:last-child    { border-bottom:none; }
    .stack-grid           { grid-template-columns:repeat(3,1fr); }
    .foot-grid            { grid-template-columns:1fr; }
    .cta-guarantee-row    { flex-direction:column; gap:12px; }
    .announce-bar         { padding:9px 40px 9px 16px; font-size:11px; }
}

/* ── iOS / Mobile performance ─────────────────
   Disable heavy GPU effects that block first paint on iPhone
──────────────────────────────────────────────── */
@media (max-width:960px) {
    /* Hide blurred orbs — biggest paint blocker on iOS Safari */
    .orb { display:none; }

    /* Disable fixed grid overlay — costly fixed-position repaint */
    body::before { display:none; }

    /* Reduce backdrop blur — expensive on mobile GPUs */
    nav.scrolled           { backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
    .mob-nav               { backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
    .announce-bar          { backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }

    /* Stop float animation on mobile — saves battery & reduces jank */
    .terminal, .metric-card { animation:none; will-change:auto; }
}