:root{
  --bg:#020712;
  --bg-2:#031420;
  --ink:#f7fbff;
  --text:#dbe7f3;
  --muted:#91a8bd;
  --line:rgba(225,244,255,.16);
  --line-strong:rgba(225,244,255,.28);
  --panel:rgba(5,18,31,.68);
  --panel-solid:#061726;
  --cyan:#00e5ff;
  --cyan-2:#5ff6ff;
  --blue:#0877ff;
  --violet:#ed051c;
  --magenta:#df0a0e;
  --green:#35ffb6;
  --danger:#ffb4b4;
  --container:1840px;
  --narrow:1080px;
  --radius:26px;
  --shadow:0 42px 120px rgba(0,0,0,.38);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;
  min-height:100vh;
  overflow-x:hidden;
  color:var(--text);
  font:400 18px/1.58 Inter, "Segoe UI Variable", "Segoe UI", Roboto, Arial, sans-serif;
  letter-spacing:-.015em;
  background:
    radial-gradient(900px 520px at 12% -8%, rgba(0,229,255,.34), transparent 62%),
    radial-gradient(1050px 620px at 95% 0%, rgba(144,92,255,.28), transparent 64%),
    radial-gradient(860px 620px at 50% 110%, rgba(0,119,255,.18), transparent 70%),
    linear-gradient(180deg, #020712 0%, #041827 45%, #020712 100%);
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.048) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.038) 1px, transparent 1px),
    radial-gradient(circle at 50% 0%, rgba(0,229,255,.16), transparent 45%);
  background-size:112px 112px,112px 112px,100% 100%;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.92), rgba(0,0,0,.42) 62%, transparent 96%);
}
body::after{
  content:"";
  position:fixed;
  inset:auto 0 0;
  height:42vh;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(0deg, rgba(0,229,255,.08), transparent 70%);
}

img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
summary{list-style:none}
summary::-webkit-details-marker{display:none}
::selection{background:rgba(0,229,255,.28);color:#fff}
:focus-visible{outline:3px solid var(--cyan);outline-offset:6px}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;top:-60px;left:24px;z-index:300;padding:13px 18px;background:#fff;color:#00111f;border-radius:14px;font-weight:800}
.skip-link:focus{top:22px}
.container{width:min(calc(100% - 96px),var(--container));margin-inline:auto}
main{position:relative;z-index:1}

.site-header{
  position:sticky;
  top:0;
  z-index:90;
  border-bottom:1px solid rgba(225,244,255,.11);
  background:rgba(2,7,18,.78);
  backdrop-filter:blur(22px) saturate(1.18);
}
.site-header::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg, transparent, rgba(0,229,255,.85), rgba(253, 6, 76, 0.55), transparent);
}
.header-inner{
  min-height:118px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:46px;
}
.brand{display:inline-flex;align-items:center;gap:16px;min-height:62px}
.brand-mark{
  width:32px;height:32px;border-radius:8px;
  background:linear-gradient(135deg,var(--cyan),var(--blue) 55%,var(--violet));
  box-shadow:0 0 42px rgba(0,229,255,.55), 0 0 72px rgba(144,92,255,.28);
  transform:rotate(45deg) skew(-6deg,-6deg);
}
.brand-text{color:#fff;font-size:1.42rem;font-weight:820;letter-spacing:-.045em}
.main-nav{justify-self:center}
.main-nav ul{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin:0;padding:9px;list-style:none;
  border:1px solid rgba(225,244,255,.14);
  border-radius:999px;
  background:rgba(255,255,255,.04);
  box-shadow:0 18px 55px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.08);
}
.main-nav li{position:relative}
.main-nav a,.nav-dropdown summary{
  display:flex;align-items:center;gap:10px;
  min-height:57px;padding:0 24px;border-radius:999px;
  color:#c3d3e6;
  font-size:1.08rem;font-weight:720;letter-spacing:-.02em;
  cursor:pointer;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.main-nav a:hover,.nav-dropdown summary:hover,.main-nav a[aria-current="page"],.nav-dropdown summary[aria-current="page"]{
  color:#fff;background:rgba(255,255,255,.09);
}
.nav-dropdown summary::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.8}
.nav-dropdown[open] summary::after{transform:rotate(225deg)}
.dropdown-panel{
  position:absolute;left:50%;top:calc(100% + 18px);transform:translateX(-50%) translateY(6px);
  min-width:420px;padding:12px;display:grid;gap:6px;
  border:1px solid rgba(225,244,255,.18);border-radius:24px;
  background:linear-gradient(180deg, rgba(6,22,38,.98), rgba(3,11,22,.98));
  box-shadow:0 30px 90px rgba(0,0,0,.42);
  opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;
}
.nav-dropdown[open] .dropdown-panel{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.dropdown-panel a{border-radius:16px;padding:16px 18px;color:#c3d3e6;background:transparent;border:1px solid transparent}
.dropdown-panel a:hover,.dropdown-panel a[aria-current="page"]{color:#fff;background:rgba(255,255,255,.075);border-color:rgba(0,229,255,.15)}
.nav-toggle{display:none;min-height:58px;padding:0 22px;border:1px solid rgba(225,244,255,.18);border-radius:999px;color:#fff;background:rgba(255,255,255,.05);font-weight:800}

.header-cta,.button,button[type="submit"]{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:68px;padding:0 34px;border-radius:999px;border:1px solid transparent;
  font-weight:820;letter-spacing:-.025em;line-height:1;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;
}
.header-cta,.button-primary,button[type="submit"]{
  color:#00111c;
  background:linear-gradient(100deg,#fff 0%,var(--cyan-2) 35%,var(--cyan) 70%,#b8fff2 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.28) inset, 0 20px 60px rgba(0,229,255,.24);
}
.button-secondary{color:#fff;border-color:rgba(225,244,255,.22);background:rgba(255,255,255,.055)}
.header-cta:hover,.button:hover,button[type="submit"]:hover{transform:translateY(-2px);box-shadow:0 24px 80px rgba(0,229,255,.34)}
.button-secondary:hover{background:rgba(255,255,255,.10);border-color:rgba(0,229,255,.44)}

.hero{
  min-height:calc(100vh - 118px);
  padding:102px 0 110px;
  display:grid;align-items:center;
}
.hero-frame{position:relative;text-align:center}
.hero-frame::before{
  content:"";position:absolute;left:50%;top:44%;width:min(1050px,72vw);height:min(1050px,72vw);
  transform:translate(-50%,-50%);z-index:-1;border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(0,229,255,.30), transparent 48%),
    radial-gradient(circle at 22% 38%, rgba(243, 5, 5, 0.2), transparent 14%),
    radial-gradient(circle at 78% 62%, rgba(8,119,255,.22), transparent 10%);
}
.hero-grid{display:grid;grid-template-columns:1fr;justify-items:center;align-items:center;gap:0}
.hero-copy{max-width:1420px;margin-inline:auto;text-align:center}
.hero-copy h1,.page-hero h1,.narrow-hero h1,.prose h1{
  margin:0;color:var(--ink);font-weight:880;line-height:.88;letter-spacing:-.075em;text-wrap:balance;
}
.hero-copy h1{font-size:clamp(3.5rem,6.5vw,8rem);max-width:13.4ch;margin-inline:auto}
.hero-copy p,.page-hero p,.narrow-hero p,.prose p,.section-intro p{
  margin:0;color:#bfd0e3;font-size:clamp(1.12rem,1.45vw,1.45rem);line-height:1.55;max-width:74ch;
}
.hero-copy p{margin:38px auto 0}
.action-row{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-top:44px}
.hero-meta{display:none}
.hero-stage,.stage-line,.stage-line-2,.stage-line-3,.stage-column,.stage-column-2,.stage-orb,.stage-orb-2,.stage-orb-3{display:none!important}

.page-hero,.narrow-hero{padding:138px 0 82px}
.page-hero-grid,.contact-grid,.feature-grid,.split-grid,.footer-columns,.field-grid{display:grid;gap:48px}
.page-hero-grid,.contact-grid,.feature-grid,.split-grid{grid-template-columns:minmax(0,1fr) minmax(360px,.55fr);align-items:start}
.page-hero h1{font-size:clamp(3.6rem,6.5vw,8rem);max-width:14ch}
.page-hero p{margin-top:26px}
.narrow-hero h1,.prose h1{font-size:clamp(3rem,5vw,5.4rem)}
.section{padding:118px 0}
.section-tight{padding-top:34px;padding-bottom:104px}
.section-last{padding-top:34px;padding-bottom:150px}
.section-intro{display:flex;align-items:end;justify-content:space-between;gap:34px;margin-bottom:58px}
.section-intro h2,.cta-band h2,.form-shell h2,.prose h2,.feature-copy h2,.note-column h2{
  margin:0 0 16px;color:#fff;font-size:clamp(2.6rem,4.3vw,5.5rem);line-height:.9;letter-spacing:-.07em;font-weight:860;text-wrap:balance;
}
.section-intro p{max-width:60ch}

.service-index{position:relative;border-top:1px solid rgba(225,244,255,.16)}
.service-index:last-child{border-bottom:1px solid rgba(225,244,255,.16)}
.service-index::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:linear-gradient(90deg,var(--cyan),var(--magenta),transparent);opacity:0;transition:opacity .18s ease}
.service-index:hover::before{opacity:1}
.service-row{
  display:grid;grid-template-columns:130px minmax(0,1fr) 54px;gap:36px;align-items:center;
  min-height:178px;padding:48px 0;transition:transform .18s ease;
}
.service-row:hover{transform:translateX(12px)}
.service-number{color:#7d97b0;font-size:1rem;font-weight:850;letter-spacing:.14em}
.service-row h3{margin:0 0 12px;color:#fff;font-size:clamp(2.4rem,3.55vw,5rem);line-height:.9;letter-spacing:-.065em;font-weight:850}
.service-row p{margin:0;color:#aebfd4;font-size:clamp(1.05rem,1.24vw,1.24rem);max-width:70ch}
.service-arrow{width:31px;height:31px;border-top:3px solid rgba(255,255,255,.92);border-right:3px solid rgba(255,255,255,.92);transform:rotate(45deg);opacity:.58;transition:transform .18s ease,opacity .18s ease}
.service-row:hover .service-arrow{transform:translateX(8px) rotate(45deg);opacity:1}

.feature-panel,.contact-shell,.form-shell,.cta-band{
  position:relative;overflow:hidden;border:1px solid rgba(225,244,255,.16);border-radius:34px;
  background:
    linear-gradient(120deg, rgba(0,229,255,.10), transparent 38%),
    linear-gradient(180deg, rgba(8,28,48,.78), rgba(3,12,23,.84));
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.08);
}
.feature-panel::after,.form-shell::after,.cta-band::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(90deg, transparent, rgba(0,229,255,.11), transparent);
  opacity:.35;
}
.feature-panel{padding:70px 76px}
.feature-copy p{margin:0;color:#bbcade;max-width:68ch;font-size:1.18rem}
.metric-list,.plain-list,.case-summary,.value-list{display:grid;gap:0;margin:0;padding:0;list-style:none}
.metric-list li,.case-summary li,.value-list li,.plain-list li{position:relative;padding:22px 0 22px 28px;border-top:1px solid rgba(225,244,255,.13);color:#c0cede;font-size:1.08rem}
.metric-list li:first-child,.case-summary li:first-child,.value-list li:first-child,.plain-list li:first-child{border-top:0}
.metric-list li::before,.case-summary li::before,.value-list li::before,.plain-list li::before{content:"";position:absolute;left:0;top:32px;width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 22px rgba(0,229,255,.7)}

.note-column,.page-note,.contact-details{padding-left:36px;border-left:1px solid rgba(225,244,255,.20)}
.note-column p,.page-note p,.contact-details p{margin:0;color:#b3c4d8;font-size:1.08rem}
.process-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid rgba(225,244,255,.16);border-bottom:1px solid rgba(225,244,255,.16)}
.method-item,.value-item{position:relative;padding:38px 34px 42px 0;border-right:1px solid rgba(225,244,255,.13)}
.method-item:last-child{border-right:0}
.method-item::before,.value-item::before{content:"";display:block;width:52px;height:3px;margin-bottom:28px;background:linear-gradient(90deg,var(--cyan),transparent)}
.method-number{display:inline-block;margin-bottom:18px;color:#7b96ae;font-size:.98rem;font-weight:850;letter-spacing:.14em}
.method-item h3,.value-item h3,.case-entry h3,.form-note h3,.note-column h3,.contact-details h3{margin:0 0 14px;color:#fff;font-size:clamp(1.35rem,1.65vw,1.75rem);line-height:1.05;letter-spacing:-.045em;font-weight:820}
.method-item p,.value-item p,.case-entry p,.form-note p,.contact-details p{margin:0;color:#aabcd1}
.value-grid,.case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px}
.value-item{padding-top:30px;border-top:1px solid rgba(225,244,255,.16);border-right:0}

.case-entry{position:relative;padding:42px 0;border-top:1px solid rgba(225,244,255,.16)}
.case-entry:last-child{border-bottom:1px solid rgba(225,244,255,.16)}
.case-entry::after{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:linear-gradient(90deg,var(--cyan),var(--magenta),transparent);opacity:0;transition:opacity .18s ease}
.case-entry:hover::after{opacity:1}
.case-meta{display:inline-block;margin-bottom:14px;color:#88a3ba;font-size:.96rem;font-weight:760;letter-spacing:.04em}
.text-link{display:inline-flex;align-items:center;gap:12px;margin-top:28px;color:#fff;font-weight:850;text-decoration:none}
.text-link::after{content:"";width:17px;height:17px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);transition:transform .18s ease}
.text-link:hover::after{transform:translateX(6px) rotate(45deg)}
p a,
.field label a,
.contact-details a,
.footer-links a[href^="mailto:"],
.prose a{
  text-decoration:underline;
  text-decoration-color:rgba(0,229,255,.55);
  text-underline-offset:5px;
}

.cta-band{display:flex;align-items:center;justify-content:space-between;gap:42px;padding:66px 76px}
.cta-band p{margin:0;color:#c0cede;max-width:68ch;font-size:1.16rem}
.form-shell{padding:62px 64px}
.form-note{margin-bottom:32px}
.alert{padding:17px 19px;margin-bottom:22px;border:1px solid rgba(225,244,255,.20);border-radius:18px;background:rgba(255,255,255,.045)}
.alert-success{background:rgba(53,255,182,.10);color:#eafff8;border-color:rgba(53,255,182,.30)}
.alert-error{background:rgba(255,180,180,.10);color:#ffe5e5;border-color:rgba(255,180,180,.28)}
.field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.field{display:grid;gap:9px;margin-bottom:22px}
.field label{font-size:1rem;color:#e3eef8;font-weight:760}
.field input,.field select,.field textarea{width:100%;min-height:62px;padding:17px 18px;color:#fff;background:rgba(0,0,0,.18);border:1px solid rgba(225,244,255,.20);border-radius:18px;transition:border-color .18s ease,background .18s ease,box-shadow .18s ease}
.field textarea{min-height:188px;resize:vertical}.field input::placeholder,.field textarea::placeholder{color:#748ba3}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:rgba(0,229,255,.66);box-shadow:0 0 0 5px rgba(0,229,255,.11);background:rgba(0,0,0,.24)}
.field-error{margin:0;color:var(--danger);font-size:.94rem}.check-field{display:flex;align-items:flex-start;gap:12px;margin-bottom:24px;color:#b8c8da}.check-field input{margin-top:5px}.hp-field{position:absolute;left:-9999px}

.narrow,.prose{max-width:var(--narrow)}.prose h2{margin-top:48px}.prose h3{margin:34px 0 12px;color:#fff;font-size:1.34rem;letter-spacing:-.035em}.prose ul{padding-left:20px;color:#b7c6d8}.prose li{margin:10px 0}

.site-footer{position:relative;padding:66px 0 34px;border-top:1px solid rgba(225,244,255,.10);background:linear-gradient(180deg,rgba(2,7,18,.50),rgba(0,5,13,.94))}
.site-footer::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),rgba(255,79,216,.55),transparent)}
.footer-top{display:grid;grid-template-columns:1fr 1.45fr;gap:66px;padding-bottom:40px}.footer-columns{grid-template-columns:repeat(3,minmax(0,1fr));gap:38px}.footer-brand{margin:0 0 14px;color:#fff;font-size:1.38rem;font-weight:860;letter-spacing:-.05em}.footer-copy,.footer-bottom p{margin:0;color:#94aabd;max-width:46ch}.footer-title{margin:0 0 16px;color:#fff;font-weight:850}.footer-links{display:grid;gap:11px}.footer-links a{color:#9eb1c5;transition:color .18s ease,transform .18s ease}.footer-links a:hover{color:#fff;transform:translateX(3px)}.footer-bottom{padding-top:24px;border-top:1px solid rgba(225,244,255,.09)}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .52s ease,transform .52s ease}.reveal.is-visible{opacity:1;transform:translateY(0)}

/* Compatibilidad con la página legacy /desarrollo-web-php */
.eyebrow{color:var(--cyan);font-weight:850;letter-spacing:.12em;text-transform:uppercase}.lead{font-size:1.18rem;color:#c2d1e2}.frame,.page-panel,.cta-panel{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);padding:42px;box-shadow:var(--shadow)}.clean-list,.bullet-columns{color:#b8c8da}.panel-title{color:#fff;font-weight:850}.hero-page,.section-compact{padding:90px 0}.hero-copy-wide{max-width:1200px}.split-content{display:grid;gap:40px;grid-template-columns:1fr 1fr}

@media (max-width:1320px){
  .hero-copy h1{font-size:clamp(4.5rem,10.5vw,8.6rem)}
  .page-hero-grid,.contact-grid,.feature-grid,.split-grid{grid-template-columns:1fr}
  .process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.method-item:nth-child(2n){border-right:0}.method-item:nth-child(n+3){border-top:1px solid rgba(225,244,255,.13)}
}
@media (max-width:980px){
  .container{width:min(calc(100% - 44px),var(--container))}.nav-toggle{display:inline-flex}.header-inner{grid-template-columns:auto auto auto;gap:18px;min-height:90px}.main-nav{position:absolute;top:calc(100% + 1px);left:22px;right:22px;display:none;justify-self:stretch}.main-nav.is-open{display:block}.main-nav ul{display:grid;justify-content:stretch;align-items:stretch;gap:8px;border-radius:24px;padding:14px;background:rgba(4,12,22,.98);box-shadow:var(--shadow)}.main-nav a,.nav-dropdown summary{border-radius:16px;justify-content:space-between}.dropdown-panel{position:static;transform:none;min-width:0;margin-top:8px;opacity:1;pointer-events:auto;box-shadow:none;background:rgba(255,255,255,.035)}.nav-dropdown[open] .dropdown-panel{transform:none}.header-cta{display:none}.footer-top,.footer-columns,.field-grid,.case-grid,.value-grid,.split-content{grid-template-columns:1fr}.hero,.page-hero,.narrow-hero,.section{padding:88px 0}.section-tight{padding-top:22px;padding-bottom:82px}.section-last{padding-bottom:118px}.feature-panel,.form-shell,.cta-band{padding:42px}.cta-band{flex-direction:column;align-items:flex-start}.service-row{grid-template-columns:1fr;gap:14px;padding:36px 0}.service-arrow{display:none}.note-column,.page-note,.contact-details{padding-left:22px}.footer-top{gap:38px}
}
@media (max-width:660px){
  body{font-size:16px}.container{width:min(calc(100% - 30px),var(--container))}.brand-text{font-size:1.08rem}.brand-mark{width:26px;height:26px}.nav-toggle{min-height:50px}.hero-copy h1,.page-hero h1{font-size:clamp(3.2rem,16vw,5.3rem);letter-spacing:-.065em}.hero-copy p,.page-hero p,.section-intro p,.narrow-hero p,.prose p{font-size:1rem}.action-row{display:grid}.button,.header-cta,button[type="submit"]{width:100%;min-height:60px}.button-secondary{width:100%}.section-intro{display:block}.section-intro .text-link{margin-top:18px}.section-intro h2,.cta-band h2,.form-shell h2,.prose h2,.feature-copy h2{font-size:clamp(2.3rem,12vw,3.8rem)}.service-row h3{font-size:clamp(2.2rem,12vw,3.4rem)}.feature-panel,.form-shell,.cta-band{padding:28px;border-radius:24px}.process-grid{grid-template-columns:1fr}.method-item{border-right:0;border-top:1px solid rgba(225,244,255,.13);padding-right:0}.method-item:first-child{border-top:0}.page-note{margin-top:12px}.field-grid{gap:0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.reveal{opacity:1!important;transform:none!important}
}

/* Real brand assets */
.brand{gap:0;min-height:72px;flex-shrink:0}
.brand-logo{width:clamp(230px,15vw,310px);height:auto;max-height:58px;object-fit:contain;filter:drop-shadow(0 0 26px rgba(0,229,255,.26))}
.footer-logo{width:min(250px,72vw);height:auto;margin:0 0 18px;filter:drop-shadow(0 0 18px rgba(0,229,255,.16))}
@media (max-width:980px){.brand-logo{width:210px;max-height:48px}.brand{min-height:58px}}
@media (max-width:560px){.brand-logo{width:176px;max-height:42px}.brand{min-height:50px}}