/* Atlas Celerion — tokens de marca y piezas propias (tema oscuro) */
:root {
  --brand: #19d38a;
  --brand-2: #00e5ff;
  --brand-grad: linear-gradient(115deg, #19d38a 0%, #00e5ff 100%);
  --brand-soft: rgba(0, 229, 255, .1);
  --on-brand: #021612;
  --bg: #060a10;
  --bg-alt: #0a1018;
  --surface: #0e1520;
  --ink: #eef3f7;
  --ink-2: #a3aebb;
  --ink-3: #6c7889;
  --line: rgba(255, 255, 255, .09);
  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 18px 40px -16px rgba(0,0,0,.6);
  --shadow-lg: 0 2px 4px rgba(0,0,0,.3), 0 40px 80px -30px rgba(0,0,0,.8);
  --font-display: "Instrument Serif", Georgia, serif;
  --display-weight: 400;
  --display-tracking: -0.015em;
  --radius: 16px;
}

body { background: var(--bg); color-scheme: dark; }
h1 { font-size: clamp(2.8rem, 7vw, 5.6rem); line-height: 1.02; }
h2 { font-size: clamp(2.2rem, 4.6vw, 3.6rem); line-height: 1.05; }
h1 em, h2 em { font-style: italic; }
.btn--primary { background: #fff; color: #060a10; }
.btn--ghost { border-color: rgba(255,255,255,.18); }
.btn--ghost:hover { border-color: rgba(255,255,255,.4); }
.lang button[aria-pressed="true"] { background: #fff; color: #060a10; }
.nav { background: color-mix(in srgb, var(--bg) 70%, transparent); }
.nav__burger span, .nav__burger span::before, .nav__burger span::after { background: #fff; }
.field input, .field textarea, .field select { background: var(--bg-alt); color: var(--ink); }
.field select option { background: var(--surface); }
.form__status.is-error { background: rgba(212, 71, 59, .15); color: #ffb4ac; }

/* Logotipo */
.ac-logo { display: inline-flex; align-items: center; gap: 12px; }
.ac-logo svg { height: 30px; width: auto; }
.ac-word { font-family: "Outfit", var(--font-body); font-weight: 400; letter-spacing: .3em; font-size: .86rem; color: var(--ink); white-space: nowrap; }
.ac-word b { font-weight: 600; }
@media (max-width: 640px) { .ac-word { letter-spacing: .14em; font-size: .72rem; } .ac-logo { gap: 8px; } .nav .ac-logo img { height: 24px !important; } }

/* Portada */
.hero { padding-top: clamp(64px, 10vw, 140px); }
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  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(ellipse at 70% 40%, #000 10%, transparent 70%); mask-image: radial-gradient(ellipse at 70% 40%, #000 10%, transparent 70%);
}
.hero__glow { background: radial-gradient(closest-side, rgba(0, 229, 255, .16), transparent 70%); inset: -20% -20% auto auto; }
.hero .lead { max-width: 600px; }
.orbit { position: relative; width: min(100%, 540px); aspect-ratio: 1; margin-left: auto; }
.orbit svg.rings { position: absolute; inset: 0; width: 100%; height: 100%; }
.orbit__core { position: absolute; left: 50%; top: 50%; width: 34%; transform: translate(-50%, -50%); filter: drop-shadow(0 0 40px rgba(0, 229, 255, .35)); }
.orbit__node {
  position: absolute; transform: translate(-50%, -50%); display: flex; align-items: center; gap: 10px;
  padding: 10px 14px 10px 10px; border-radius: 999px; background: rgba(14, 21, 32, .85); border: 1px solid var(--line);
  backdrop-filter: blur(8px); font-weight: 600; font-size: .9rem; white-space: nowrap; box-shadow: var(--shadow);
}
.orbit__node i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: .75rem; color: #04110d; }
.orbit__node--ff { left: 16%; top: 24%; }
.orbit__node--ff i { background: linear-gradient(135deg, #22d67c, #00c2cf); }
.orbit__node--fd { left: 88%; top: 44%; }
.orbit__node--fd i { background: linear-gradient(135deg, #00e8fd, #2f86ff); }
.orbit__node--st { left: 30%; top: 86%; }
.orbit__node--st i { background: linear-gradient(135deg, #f4733f, #f0a21c); }
.spin { transform-origin: 50% 50%; animation: spin 80s linear infinite; }
.spin--rev { animation-duration: 120s; animation-direction: reverse; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 960px) { .orbit { margin: 24px auto 0; max-width: 460px; } }
@media (max-width: 520px) { .orbit__node { font-size: .78rem; padding: 7px 10px 7px 7px; } .orbit__node i { width: 20px; height: 20px; } .orbit__node--fd { left: 80%; } }

/* Cifras */
.figures { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.figures > div { padding: 40px 28px; }
.figures > div + div { border-left: 1px solid var(--line); }
.figures b { display: block; font-family: var(--font-display); font-weight: 400; font-size: clamp(3rem, 5vw, 4.4rem); line-height: 1; margin-bottom: 12px; }
.figures span { color: var(--ink-2); font-size: .95rem; }
@media (max-width: 900px) { .figures { grid-template-columns: 1fr 1fr; } .figures > div:nth-child(3) { border-left: 0; } .figures > div:nth-child(n+3) { border-top: 1px solid var(--line); } }
@media (max-width: 480px) { .figures { grid-template-columns: 1fr; } .figures > div + div { border-left: 0; border-top: 1px solid var(--line); } }

/* Compañías */
.company { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(28px, 5vw, 72px); align-items: center; padding: clamp(28px, 4vw, 48px); border-radius: calc(var(--radius) * 1.5); background: var(--surface); border: 1px solid var(--line); position: relative; overflow: hidden; }
.company + .company { margin-top: 20px; }
.company::before { content: ""; position: absolute; width: 520px; height: 520px; border-radius: 50%; right: -200px; top: -240px; background: radial-gradient(closest-side, var(--c-glow), transparent); opacity: .5; pointer-events: none; }
.company--ff { --c1: #22d67c; --c2: #00c2cf; --c-glow: rgba(34, 214, 124, .35); }
.company--fd { --c1: #00e8fd; --c2: #2f86ff; --c-glow: rgba(0, 232, 253, .3); }
.company--st { --c1: #f4733f; --c2: #f0a21c; --c-glow: rgba(244, 115, 63, .3); }
.company__brand { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.company__mark { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: #fff; flex-shrink: 0; }
.company__mark img, .company__mark svg { width: 34px; height: 34px; object-fit: contain; }
.company__brand strong { display: block; font-size: 1.5rem; letter-spacing: -0.02em; }
.company__brand small { color: var(--ink-3); font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; }
.company h3 { font-family: var(--font-display); font-weight: 400; font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.1; margin-bottom: 16px; }
.company p { color: var(--ink-2); }
.company__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 28px; }
.company__tags span { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); font-size: .82rem; color: var(--ink-2); }
.company__link { display: inline-flex; gap: 10px; align-items: center; font-weight: 600; color: var(--ink); }
.company__link .arrow { color: var(--c1); transition: transform .2s var(--ease); }
.company__link:hover .arrow { transform: translateX(4px); }
.company__link--soon { color: var(--ink-3); font-weight: 500; }
.company__visual { position: relative; min-height: 300px; border-radius: var(--radius); border: 1px solid var(--line); background: linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,0)); display: flex; flex-direction: column; gap: 16px; padding: 20px; overflow: hidden; }
.company__visual .big { flex: 1; display: grid; place-items: center; padding: 12px 0; font-family: var(--font-display); font-size: clamp(5rem, 12vw, 9rem); line-height: 1; background: linear-gradient(120deg, var(--c1), var(--c2)); -webkit-background-clip: text; background-clip: text; color: transparent; opacity: .9; }
.company__visual ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.company__visual li { padding: 12px; border-radius: 12px; background: rgba(6, 10, 16, .6); border: 1px solid var(--line); font-size: .78rem; color: var(--ink-2); }
.company__visual li b { display: block; color: var(--ink); font-size: .92rem; margin-bottom: 2px; }
.company .chip { background: linear-gradient(120deg, var(--c1), var(--c2)); color: #1c0b02; margin-left: auto; }
@media (max-width: 900px) { .company { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .company__visual ul { grid-template-columns: 1fr; } }

/* Principios */
.principles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--line); }
.principles > div { padding: 36px 28px 0 0; }
.principles > div + div { padding-left: 28px; border-left: 1px solid var(--line); }
.principles small { display: block; font-size: .8rem; color: var(--ink-3); letter-spacing: .14em; margin-bottom: 40px; }
.principles h3 { font-family: var(--font-display); font-weight: 400; font-size: 1.7rem; margin-bottom: 12px; }
.principles p { color: var(--ink-2); font-size: .96rem; margin: 0; }
@media (max-width: 900px) { .principles { grid-template-columns: 1fr 1fr; row-gap: 40px; } .principles > div:nth-child(3) { padding-left: 0; border-left: 0; } }
@media (max-width: 520px) { .principles { grid-template-columns: 1fr; } .principles > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); } .principles small { margin-bottom: 16px; } }

/* Presencia */
.regions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 40px; }
.regions > div { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.regions b { font-family: var(--font-display); font-weight: 400; font-size: 1.6rem; display: block; margin-bottom: 6px; }
.regions span { color: var(--ink-2); font-size: .92rem; }
@media (max-width: 700px) { .regions { grid-template-columns: 1fr; } }
.clients { display: flex; flex-wrap: wrap; gap: 12px 36px; margin-top: 8px; }
.clients span { font-size: 1.15rem; color: var(--ink-3); font-weight: 500; }

/* Banda final */
.cta-band { background: var(--surface); border: 1px solid var(--line); color: var(--ink); }
.cta-band p { color: var(--ink-2); }
.cta-band .btn--ghost { color: var(--ink); border-color: rgba(255,255,255,.2); }
.cta-band::before { background: radial-gradient(closest-side, rgba(0, 229, 255, .45), transparent); }

.footer .ac-logo svg { height: 26px; }
