/* ============================================================
   AURORA TECH · layer condiviso EMC Digital Solutions (2026)
   Caricare DOPO gli stili di pagina (ultimo <link> nell'head).
   Gli sfondi ambientali (aurora/griglia/grana/barra scroll)
   vengono iniettati da js/aurora.js.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap');

:root{
  --bg-primary:#070a13;
  --bg-secondary:#0b0f1c;
  --bg-card:#0e1424;
  --accent:#6b9ef7;
  --accent-2:#8b6cf0;
  --accent-light:#a9c4ff;
  --accent-vivid:#f5c542;
  --accent-vivid-hover:#ffd873;
  --text-primary:#eef1f8;
  --text-secondary:#9aa4bd;
  --border:rgba(255,255,255,0.08);
  --glass:rgba(255,255,255,0.035);
  --glass-strong:rgba(255,255,255,0.06);
  --glow-blue:rgba(107,158,247,0.35);
  --glow-violet:rgba(139,108,240,0.32);
  --glow-gold:rgba(245,197,66,0.30);
  --grad-brand:linear-gradient(120deg,#6b9ef7 0%,#8b6cf0 42%,#f5c542 100%);
  --font-display:'Space Grotesk','Inter',-apple-system,sans-serif;
}

body{ background:var(--bg-primary); }

/* keep native cursor; add spotlight follower on precise pointers */
@media (hover:hover) and (pointer:fine){
  body{ cursor:auto; }
}

/* ---------- LIVING AURORA BACKGROUND ---------- */
.aurora-bg{ position:fixed; inset:0; z-index:-3; overflow:hidden; pointer-events:none; }
.aurora-bg::after{ /* subtle vignette to keep text legible */
  content:''; position:absolute; inset:0;
  background:radial-gradient(120% 90% at 50% 0%,transparent 40%,rgba(7,10,19,.55) 100%);
}
.aurora-blob{ position:absolute; border-radius:50%; filter:blur(90px); opacity:.55;
  will-change:transform; mix-blend-mode:screen; }
.aurora-blob.b1{ width:52vw; height:52vw; top:-14vw; left:-10vw;
  background:radial-gradient(circle at 30% 30%,#3f6fd6,transparent 68%);
  animation:auroraA 34s ease-in-out infinite; }
.aurora-blob.b2{ width:46vw; height:46vw; top:18vh; right:-12vw;
  background:radial-gradient(circle at 60% 40%,#7d5cf0,transparent 66%);
  animation:auroraB 42s ease-in-out infinite; }
.aurora-blob.b3{ width:40vw; height:40vw; bottom:-14vw; left:22vw;
  background:radial-gradient(circle at 50% 50%,#d9a53a,transparent 64%);
  opacity:.38; animation:auroraC 38s ease-in-out infinite; }
@keyframes auroraA{ 0%,100%{transform:translate(0,0) scale(1);}
  50%{transform:translate(8vw,6vh) scale(1.18);} }
@keyframes auroraB{ 0%,100%{transform:translate(0,0) scale(1.05);}
  50%{transform:translate(-7vw,9vh) scale(.9);} }
@keyframes auroraC{ 0%,100%{transform:translate(0,0) scale(1);}
  50%{transform:translate(-6vw,-7vh) scale(1.22);} }

/* faint tech grid, fades toward edges */
.grid-overlay{ position:fixed; inset:0; z-index:-2; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(120% 80% at 50% 30%,#000 0%,transparent 78%);
          mask-image:radial-gradient(120% 80% at 50% 30%,#000 0%,transparent 78%); }

/* film grain */
.noise-overlay{ position:fixed; inset:0; z-index:60; pointer-events:none; opacity:.045;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* scroll progress bar */
.scroll-progress{ position:fixed; top:0; left:0; height:3px; width:0; z-index:2000;
  background:var(--grad-brand); box-shadow:0 0 14px var(--glow-violet); transition:width .1s linear; }

/* ---------- TYPOGRAPHY ---------- */
.section-title,.hero h1,.hero-stat .number,.term-title,
.value-card h4,.service-card h3,.portfolio-card h3{
  font-family:var(--font-display); letter-spacing:-.02em; }
.section-title{ font-size:clamp(2rem,4vw,2.9rem); }
.section-label{ background:var(--grad-brand); -webkit-background-clip:text;
  background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
  font-weight:700; }

/* ---------- HERO ---------- */
.hero{ background:transparent; }
.hero::before,.hero::after{ display:none; }
.hero-particles{ display:none; }
.hero-net{ position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }
.hero .container{ z-index:1; }
.hero-inner{ display:grid; grid-template-columns:1.08fr .92fr; gap:54px; align-items:center; }
.hero-content{ max-width:640px; }
.hero-label{ background:var(--glass-strong); border:1px solid var(--border);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  color:var(--accent-light); letter-spacing:.4px; }
.hero-label::before{ box-shadow:0 0 10px var(--glow-gold); }
.hero h1{ font-size:clamp(2.6rem,5.4vw,4.1rem); line-height:1.05; }
.hero h1 .accent{ background:var(--grad-brand); background-size:220% auto;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  -webkit-text-fill-color:transparent; animation:gradShift 7s ease infinite; }
@keyframes gradShift{ 0%,100%{background-position:0% 50%;} 50%{background-position:100% 50%;} }
.typing-cursor{ color:var(--accent-vivid); -webkit-text-fill-color:var(--accent-vivid); }
.hero-stat .number{ background:var(--grad-brand); -webkit-background-clip:text;
  background-clip:text; color:transparent; -webkit-text-fill-color:transparent; }

/* glass code terminal */
.hero-visual{ position:relative; z-index:1; }
.term{ position:relative; border-radius:16px; overflow:hidden;
  background:linear-gradient(160deg,rgba(20,27,46,.82),rgba(10,14,26,.82));
  border:1px solid var(--border); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.85),0 0 60px -18px var(--glow-blue),
             inset 0 1px 0 rgba(255,255,255,.05);
  animation:termFloat 7s ease-in-out infinite; }
@keyframes termFloat{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-12px);} }
.term-bar{ display:flex; align-items:center; gap:8px; padding:13px 16px;
  border-bottom:1px solid var(--border); background:rgba(255,255,255,.02); }
.term-dot{ width:12px; height:12px; border-radius:50%; }
.term-dot.r{ background:#ff5f57; } .term-dot.y{ background:#febc2e; } .term-dot.g{ background:#28c840; }
.term-title{ margin-left:8px; font-size:12px; font-weight:600; color:var(--text-secondary); letter-spacing:.5px; }
.term-body{ padding:22px 22px 26px; font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:13.5px; line-height:1.95; min-height:230px; white-space:pre-wrap; }
.term-body .ln{ white-space:pre-wrap; }
.term .pr{ color:var(--accent-vivid); } .term .cm{ color:#5c6a86; }
.term .fn{ color:#7fb0ff; } .term .ok{ color:#43d17f; } .term .st{ color:#c9d4ee; }
.term .cur{ display:inline-block; width:8px; height:15px; margin-left:2px;
  background:var(--accent-vivid); vertical-align:-2px; animation:typingCursor 1s step-end infinite; }
.term-glow{ position:absolute; inset:-1px; border-radius:16px; z-index:-1;
  background:var(--grad-brand); filter:blur(26px); opacity:.28; }

.hero-scroll{ position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:7px; z-index:1;
  color:var(--text-secondary); font-size:11px; letter-spacing:2px; text-transform:uppercase; }
.hero-scroll svg{ width:20px; height:20px; animation:bob 1.8s ease-in-out infinite; }
@keyframes bob{ 0%,100%{transform:translateY(0);opacity:.5;} 50%{transform:translateY(6px);opacity:1;} }

/* ---------- SECTION BACKGROUNDS (let aurora breathe) ---------- */
section{ background:transparent!important; position:relative; }
.services,.social-visibility,.app-development,.emcfaq-sec{
  background:linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,0))!important; }
.ecom-highlight{ background:transparent!important; }

/* ---------- GLASS CARDS ---------- */
.service-card,.value-card,.portfolio-card,.contact-form,.contact-info,
.tech-badge,.social-card,.app-feature{
  background:var(--glass)!important; border:1px solid var(--border)!important;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.service-card{ border-radius:18px; transition:transform .45s cubic-bezier(.25,.46,.45,.94),
  border-color .3s,box-shadow .4s; }
.service-card:hover{ transform:translateY(-8px);
  border-color:rgba(139,108,240,.45)!important;
  box-shadow:0 30px 60px -26px rgba(0,0,0,.7),0 0 46px -14px var(--glow-blue); }
.value-card{ border-radius:16px; transition:transform .3s,border-color .3s,box-shadow .4s; }
.value-card:hover{ transform:translateY(-4px); border-color:rgba(245,197,66,.4)!important;
  box-shadow:0 16px 40px -18px rgba(0,0,0,.6),0 0 30px -12px var(--glow-gold)!important; }
.portfolio-card{ border-radius:18px; transition:transform .4s,border-color .3s,box-shadow .4s; }
.portfolio-card:hover{ transform:translateY(-8px); border-color:rgba(107,158,247,.4)!important;
  box-shadow:0 30px 60px -26px rgba(0,0,0,.7),0 0 40px -16px var(--glow-blue); }
.contact-info{ padding:36px; border-radius:18px; }
@media (max-width:640px){ .contact-info{ padding:24px; } }
.tech-badge{ border-radius:12px; transition:all .25s; }
.tech-badge:hover{ transform:translateY(-3px); border-color:rgba(139,108,240,.5)!important;
  background:var(--glass-strong)!important; color:var(--accent-light)!important;
  box-shadow:0 0 24px -6px var(--glow-violet)!important; }

/* ---------- NAVBAR ---------- */
.navbar.scrolled{ background:rgba(9,12,22,.72)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.3); backdrop-filter:blur(22px) saturate(1.3);
  border-bottom:1px solid var(--border); box-shadow:0 8px 30px -12px rgba(0,0,0,.6); }
.nav-links a::after{ background:var(--grad-brand); height:2px; border-radius:2px; }

/* ---------- BUTTONS ---------- */
.btn-primary{ background:var(--grad-brand); background-size:180% auto; color:#0a0e18;
  font-weight:700; border-radius:12px; box-shadow:0 10px 34px -8px var(--glow-violet);
  transition:background-position .5s ease,transform .25s ease,box-shadow .3s ease; }
.btn-primary:hover{ background-position:right center; transform:translateY(-3px);
  box-shadow:0 16px 44px -8px var(--glow-gold); }
.btn-outline{ border:1px solid var(--border); border-radius:12px;
  background:var(--glass); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  transition:all .25s; }
.btn-outline:hover{ border-color:transparent; color:var(--text-primary);
  background:var(--glass-strong); transform:translateY(-3px);
  box-shadow:0 0 0 1px rgba(139,108,240,.4),0 12px 30px -12px var(--glow-blue); }

/* magnetic ease */
[data-magnetic]{ transition:transform .2s cubic-bezier(.2,.8,.3,1); }

/* divider gradient */
.section-divider::after{ background:var(--grad-brand); max-width:140px; }
.section-divider.visible::after{ width:140px; }

/* reveal easing */
.fade-in,.fade-in-left,.fade-in-right{ transition:opacity .7s cubic-bezier(.2,.7,.2,1),
  transform .7s cubic-bezier(.2,.7,.2,1); }

/* ---------- RESPONSIVE ---------- */
@media (max-width:920px){
  .hero-inner{ grid-template-columns:1fr; gap:36px; }
  .hero-visual{ display:none; }
  .hero-scroll{ display:none; }
}

/* ---------- REDUCED MOTION ---------- */
@media (prefers-reduced-motion:reduce){
  .aurora-blob,.term,.hero h1 .accent,.hero-scroll svg{ animation:none!important; }
}
/* ============================================================
   ESTENSIONI PAGINE INTERNE (servizi / pricing / news / legali)
   ============================================================ */

/* Hero interni trasparenti: l'aurora respira dietro */
.page-hero, .cs-hero { background: transparent !important; position: relative; }
.page-hero::before, .page-hero::after,
.cs-hero::before, .cs-hero::after { display: none; }
.page-hero h1, .cs-hero h1 {
  font-family: var(--font-display); letter-spacing: -.02em; }
.page-hero h1 .accent, .cs-hero h1 .accent {
  background: var(--grad-brand); background-size: 220% auto;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-text-fill-color: transparent; animation: gradShift 7s ease infinite; }

/* Card interne in vetro */
.feature-card, .include-card, .compare-card, .article-card {
  background: var(--glass) !important; border: 1px solid var(--border) !important;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-radius: 16px;
  transition: transform .35s cubic-bezier(.25,.46,.45,.94), border-color .3s, box-shadow .4s; }
.feature-card:hover, .include-card:hover, .article-card:hover {
  transform: translateY(-6px); border-color: rgba(139,108,240,.45) !important;
  box-shadow: 0 24px 50px -24px rgba(0,0,0,.7), 0 0 40px -14px var(--glow-blue); }
.compare-card:hover {
  transform: translateY(-4px); border-color: rgba(245,197,66,.4) !important;
  box-shadow: 0 18px 44px -20px rgba(0,0,0,.65), 0 0 32px -12px var(--glow-gold); }
.compare-card.current { border-color: rgba(245,197,66,.5) !important; }

/* CTA interni allineati ai bottoni Aurora */
.cta-btn {
  background: var(--grad-brand) !important; background-size: 180% auto !important;
  color: #0a0e18 !important; font-weight: 700;
  border-radius: 12px; border: none;
  box-shadow: 0 10px 34px -8px var(--glow-violet);
  transition: background-position .5s ease, transform .25s ease, box-shadow .3s ease; }
.cta-btn:hover {
  background-position: right center !important; transform: translateY(-3px);
  box-shadow: 0 16px 44px -8px var(--glow-gold); }
.cta-ghost {
  border: 1px solid var(--border) !important; border-radius: 12px;
  background: var(--glass) !important;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  transition: all .25s; }
.cta-ghost:hover {
  color: var(--text-primary) !important; transform: translateY(-3px);
  box-shadow: 0 0 0 1px rgba(139,108,240,.4), 0 12px 30px -12px var(--glow-blue); }
.cta-section { background: transparent !important; }

/* Prezzi con gradiente brand */
.price-amount, .compare-price strong {
  background: var(--grad-brand); -webkit-background-clip: text;
  background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }