/* R26 · Cinco servicios, cinco composiciones. La decoración nunca oculta contenido. */
.service-hero-band {position:relative;isolation:isolate;border-bottom:1px solid var(--section-line);}
.service-atmosphere {position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;color:var(--section-ink);}
.service-atmosphere>svg {position:absolute;inset:-6%;width:112%;height:112%;stroke:currentColor;stroke-width:1;opacity:.12;transform:translate(var(--service-drift-x,0px),var(--service-drift-y,0px));}
.service-wash {position:absolute;inset:-8%;background:radial-gradient(ellipse at 75% 48%,color-mix(in srgb,var(--section-accent) 65%,transparent),transparent 66%);transform:translate(var(--service-drift-x,0px),var(--service-drift-y,0px));}
.service-page .service-hero {position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);grid-template-areas:"copy art";gap:clamp(40px,5vw,80px);align-items:center;padding-block:clamp(68px,7vw,112px);min-height:min(810px,calc(100svh - 90px));}
.service-hero .service-hero-copy {grid-area:copy;position:relative;z-index:1;min-width:0;}
.service-page .service-hero h1 {font-size:clamp(3.2rem,4.8vw,5.1rem);line-height:1.12;letter-spacing:-.05em;margin:0 0 30px;overflow:visible;text-wrap:balance;}
.service-title-line {display:block;}
.service-title-line em {font-style:normal;}
.service-page .service-description {font-size:clamp(1rem,1.25vw,1.125rem);line-height:1.85;margin:0;max-width:37rem;text-wrap:pretty;}
.service-page .service-hero .service-button {margin-top:32px;min-height:58px;font-size:1rem;gap:32px;padding:17px 24px;}
.service-button>span {display:inline-block;transition:translate var(--motion-control,380ms) var(--motion-ease,ease);}
.service-button:hover>span {translate:3px -3px;}
.service-hero .service-visual {grid-area:art;min-width:0;width:100%;max-width:none;margin:0;}
.service-hero .service-photo {position:relative;isolation:isolate;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;aspect-ratio:auto;min-height:0;height:auto;overflow:visible;transform:none;}
.service-hero .service-photo>img {display:block;position:static;width:100%;height:auto;aspect-ratio:auto;min-height:0;max-height:650px;object-fit:contain;object-position:center;transform:none;border:0;border-radius:0;}
.service-hero .service-photo::before,.service-hero .service-photo::after {content:none;}

/* Web: retícula de diseño y composición precisa, sin girar el navegador. */
.service-hero-web .atmo-plane {fill:currentColor;fill-opacity:.14;stroke:none;}
.service-hero-web .atmo-guide {stroke-dasharray:3 9;}
.tone-web .service-title-line {line-height:1.2;}
.tone-web .service-title-line+.service-title-line {margin-top:.12em;}
.tone-web .service-title-line em {display:inline-block;vertical-align:baseline;line-height:1.14;background:var(--section-accent);padding:.02em .08em .06em;}
.web-hero-scene {position:relative;padding:24px 20px;}
.web-draft {position:absolute;inset:0;width:100%;height:100%;stroke:var(--section-ink);stroke-opacity:.3;stroke-width:1;pointer-events:none;}
.web-draft .motion-trace {stroke:#203a91;stroke-width:3;stroke-opacity:1;}
.service-hero-web .browser-art {position:relative;transform:none;box-shadow:0 24px 70px rgb(32 58 145 / .09);margin:0;border-radius:8px;overflow:visible;}
.service-hero-web .browser-top {border-radius:8px 8px 0 0;}
.service-hero-web .browser-title {font-size:clamp(2.3rem,3.6vw,3.9rem);line-height:1.1;}
.service-hero-web .browser-body {padding:30px;border-radius:0 0 8px 8px;}
.service-hero-web .browser-orbit {opacity:.7;}

/* Marketing: una fotografía íntegra a la izquierda y luz de estudio en dos capas. */
.service-hero-marketing .service-hero {grid-template-areas:"art copy";grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);}
.service-hero-marketing .service-wash {background:radial-gradient(ellipse at 27% 48%,#ffe7ec 0,transparent 66%);opacity:.7;}
.service-hero-marketing .service-atmosphere>svg {opacity:.15;stroke-width:1.2;}
.service-hero-marketing .atmo-contour {stroke-dasharray:1 12;stroke-linecap:round;}
.service-hero-marketing .marketing-photo {max-width:420px;margin-inline:auto;}
.service-hero-marketing .marketing-photo>img {max-height:560px;}
.tone-marketing .service-hero h1 {font-size:clamp(3rem,4.55vw,4.9rem);line-height:1.13;}
.tone-marketing .service-title-line em {color:#982837;}
/* La ventana recorta solo la luz en movimiento, nunca la fotografía. */
.marketing-light-viewport {position:absolute;inset:0;display:block;overflow:hidden;pointer-events:none;z-index:1;mix-blend-mode:soft-light;}
.service-hero-marketing .marketing-light-viewport .motion-light-trail {mix-blend-mode:normal;}

/* Publicidad: una línea recorre mensaje, relevancia y contacto. */
.service-hero-ads .service-wash {background:radial-gradient(ellipse at 85% 45%,#f3c4a8,transparent 65%);opacity:.7;}
.service-hero-ads .service-atmosphere>svg {opacity:.13;stroke-width:1.5;}
.tone-ads .service-title-line em {text-decoration:underline;text-decoration-color:#e5a180;text-decoration-thickness:.075em;text-underline-offset:.12em;}
.ads-route {position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:24px;aspect-ratio:auto;width:100%;max-width:580px;margin-inline:auto;padding-block:8px;}
.ads-route>svg {position:absolute;inset:0 auto 0 0;width:64px;height:100%;overflow:visible;stroke:#aa6d50;stroke-width:1.4;}
.ads-route>svg circle {fill:var(--section-bg);}
.ads-route .motion-trace {stroke:#743e2e;stroke-width:4;}
.route-node {position:relative;grid-column:2;min-width:0;width:auto;padding:24px 0 28px;border-top:1px solid #ac7a62;background:transparent;}
.route-node>span {display:block;font-size:.64rem;font-weight:600;letter-spacing:.12em;margin-bottom:12px;}
.route-node>strong {display:block;font-family:var(--section-font);font-weight:500;letter-spacing:-.04em;font-size:clamp(1.6rem,2.5vw,2.6rem);line-height:1.13;}

/* Redes: cabecera de revista, imagen y argumento en la segunda fila. */
.service-hero-social .service-hero {grid-template-areas:"title title" "art description" "art action";grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:start;gap:26px 70px;}
.service-hero-social .service-hero-copy {display:contents;}
.service-hero-social h1 {grid-area:title;}
.service-hero-social .service-description {grid-area:description;align-self:end;padding-top:35px;}
.service-hero-social .service-button {grid-area:action;justify-self:start;align-self:start;}
.tone-social .service-hero h1 {font-size:clamp(3.6rem,6.5vw,7rem);line-height:1.14;margin-bottom:24px;}
.service-hero-social .service-title-line {display:inline-block;}
.tone-social .service-title-line em {font-style:italic;font-weight:500;}
.service-hero-social .service-wash {background:radial-gradient(ellipse at 25% 66%,#f2c9af,transparent 65%);opacity:.5;}
.service-hero-social .service-atmosphere>svg {opacity:.15;stroke-width:1.6;}
.service-hero-social .atmo-contour {opacity:.5;}
.service-hero-social .social-photo {max-width:600px;}
.service-hero-social .service-visual {align-self:center;}
.showcase-social[data-scroll-story] .story-progress>i {background:linear-gradient(90deg,#fff 0 var(--story-fill,100%),rgb(255 255 255 / .25) var(--story-fill,100%) 100%);}

/* Software y TI: retícula de luz, nodos inmóviles y señales de integración. */
.service-hero-tech .service-wash {background:radial-gradient(ellipse at 80% 50%,#154552 0,transparent 65%);opacity:.65;}
.service-hero-tech .service-atmosphere>svg {color:#7de0ef;opacity:.11;}
.service-hero-tech .service-grid-light {position:absolute;inset:0;opacity:.28;background-image:linear-gradient(rgb(125 224 239 / .22) 1px,transparent 1px),linear-gradient(90deg,rgb(125 224 239 / .22) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse 35% 65% at var(--grid-x,75%) var(--grid-y,50%),#000,transparent);}
.tone-tech .service-title-line em {color:#7de0ef;}
.tone-tech .service-hero h1 {font-size:clamp(3.1rem,4.4vw,4.7rem);line-height:1.14;font-weight:500;}
.service-hero-tech .system-diagram {position:relative;padding:32px;background:rgb(9 15 25 / .65);border-color:#34485e;box-shadow:0 20px 70px rgb(0 0 0 / .15);}
.service-hero-tech .system-connector>span:first-child {position:relative;overflow:visible;}
.connector-signal {position:absolute;left:50%;top:0;width:5px;height:9px;border-radius:4px;background:#dbfbff;box-shadow:0 0 10px #7de0ef;transform:translateX(-50%);opacity:0;pointer-events:none;}

/* Secciones abiertas: el contenido respira y la navegación conserva su posición. */
.service-page-content {padding-bottom:40px;color:var(--section-ink);}
.service-page .web-pricing,.service-page .social-pricing {padding-top:clamp(80px,8vw,128px);}
.service-page .entry-offer {margin-block:clamp(80px,8vw,128px) 0;padding:clamp(28px,4vw,50px);gap:64px;border-radius:4px;}
.service-page .entry-offer h2 {line-height:1.2;}
.service-page .service-capabilities {display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.3fr);gap:64px;margin-block:clamp(100px,10vw,160px);align-items:start;}
.service-capabilities .section-intro {min-width:0;padding-top:0;}
.service-capabilities .section-intro h2 {font-family:var(--section-font);font-size:clamp(2.3rem,3.1vw,3.4rem);font-weight:600;line-height:1.17;letter-spacing:-.045em;margin:22px 0 26px;overflow:visible;}
.service-capabilities .section-intro>p:last-child {max-width:34rem;font-size:1rem;line-height:1.85;}
.service-page .capability-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 36px;margin:0;}
.service-page .capability-grid>article,.service-page .capability-grid>article:nth-child(3n+2) {border:0;border-top:1px solid var(--section-line);border-radius:0;padding:24px 0 12px;background:transparent;}
.service-page .capability-grid>article::after {content:none;}
.service-page .capability-grid .service-number {display:block;width:auto;height:auto;border:0;border-radius:0;font-size:.7rem;letter-spacing:.1em;color:var(--section-ink);opacity:.8;}
.service-page .capability-grid h3 {font-size:clamp(1.35rem,1.7vw,1.7rem);line-height:1.25;margin:18px 0 15px;}
.service-page .capability-grid p {margin:0;line-height:1.85;}
.service-page .capabilities-tech .tech-services {margin:0;grid-template-columns:minmax(0,1fr);}
.service-page .capabilities-tech {margin-bottom:64px;}
.capabilities-tech .service-detail>.service-body {color:#d0dce8;}
.tech-delivery {display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,5vw,64px);align-items:start;margin-block:0 100px;padding:clamp(28px,4vw,48px);background:#0e1824;border:1px solid var(--section-line);border-left:3px solid var(--section-accent);}
.tech-delivery>div {min-width:0;}
.tech-delivery .eyebrow {color:var(--section-accent);line-height:1.6;margin:0 0 22px;}
.tech-delivery h2 {font-family:var(--section-font);font-size:clamp(2rem,3vw,3rem);font-weight:500;letter-spacing:-.045em;line-height:1.18;margin:0;color:var(--section-ink);}
.tech-delivery-copy {color:#d0dce8;font-size:1rem;line-height:1.85;}
.tech-delivery-copy p {margin:0;}
.tech-delivery-copy p+p {margin-top:20px;}
.service-page .service-showcase {margin-block:clamp(90px,9vw,144px);padding:clamp(30px,4vw,54px);border-radius:4px;gap:64px;}
.service-page .showcase-copy h2 {line-height:1.17;overflow:visible;}
.service-page .faq-section {margin-block:clamp(90px,9vw,144px) 44px;gap:64px;align-items:start;}
.service-page .faq-section h2 {line-height:1.15;}
body[data-page]:not([data-page="home"]) .contact-zone:not(.tone-general) {padding-block:clamp(80px,8vw,128px);}
body[data-page]:not([data-page="home"]) .contact-zone:not(.tone-general) #contacto.contact-with-form {margin-top:0;padding-top:40px;}
.service-page :is(h1,h2,h3) {scroll-margin-top:calc(var(--header-height,90px) + 30px);}
@media(min-width:1100px) and (min-height:760px) {
 .service-capabilities .section-intro,.service-page .faq-section>div:first-child {position:sticky;top:calc(var(--header-height,90px) + 32px);}
}
@media(max-width:1100px) {
 .service-page .service-hero {gap:38px;}
 .service-page .service-hero h1 {font-size:clamp(2.65rem,4.7vw,4rem);}
 .tone-social .service-hero h1 {font-size:clamp(3.5rem,6.5vw,6rem);}
 .service-page .service-capabilities {grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr);gap:36px;}
 .service-page .capability-grid {gap:25px;}
 .service-page .service-showcase,.service-page .faq-section {gap:36px;}
 .service-hero-web .browser-body {padding:24px;}
 .service-hero-tech .system-diagram {padding:22px;}
}
@media(max-width:900px) {
 .service-page .service-hero,.service-hero-marketing .service-hero {grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "art";padding-block:52px 68px;gap:48px;min-height:0;}
 .service-page .service-hero h1 {font-size:clamp(2.8rem,7.4vw,4.6rem);max-width:48rem;}
 .service-hero .service-visual {max-width:650px;margin-inline:auto;}
 .service-hero-marketing .marketing-photo {max-width:400px;}
 .service-hero-social .service-hero-copy {display:block;}
 .service-hero-social h1,.service-hero-social .service-description,.service-hero-social .service-button {grid-area:auto;}
 .service-hero-social .service-description {padding-top:0;}
 .service-hero-social .service-title-line {display:block;}
 .service-page .service-capabilities {grid-template-columns:minmax(0,1fr);gap:38px;margin-block:88px;}
 .service-page .capabilities-tech {margin-bottom:48px;}
 .tech-delivery {grid-template-columns:minmax(0,1fr);gap:28px;margin-bottom:88px;}
 .service-page .capability-grid {gap:28px 36px;}
 .service-page .service-showcase {grid-template-columns:minmax(0,1fr);margin-block:88px;gap:42px;}
 .service-page .service-showcase .showcase-art {max-width:600px;width:100%;margin-inline:auto;}
 .service-page .entry-offer {gap:32px;}
 .service-page .faq-section {margin-top:88px;}
 .service-hero-web .browser-title {font-size:clamp(2.6rem,6vw,3.9rem);}
 .route-node>strong {font-size:clamp(1.65rem,4.2vw,2.65rem);}
}
@media(max-width:600px) {
 .service-page .service-hero {padding-block:44px 60px;gap:36px;}
 .service-page .service-hero h1 {font-size:clamp(2.55rem,10vw,3.6rem);line-height:1.14;margin-bottom:26px;}
 .service-page .service-description {font-size:1rem;line-height:1.8;}
 .service-page .service-hero .service-button {font-size:.9375rem;gap:22px;padding:16px 20px;min-height:56px;}
 .service-hero .service-photo>img {max-height:480px;}
 .service-hero-marketing .marketing-photo {max-width:350px;}
 .web-hero-scene {padding:16px 10px;}
 .service-hero-web .browser-body {padding:24px 20px;}
 .service-hero-web .browser-title {font-size:clamp(2.5rem,10vw,3.4rem);}
 .service-hero-web .browser-bottom {gap:16px;}
 .service-hero-web .browser-bottom>span {max-width:130px;}
 .service-hero-tech .system-diagram {padding:20px 15px;}
 .service-hero-tech .system-node {padding:16px 12px;gap:12px;}
 .service-hero-tech .node-code {font-size:1.2rem;}
 .ads-route {min-height:0;grid-template-columns:40px minmax(0,1fr);column-gap:18px;}
 .ads-route>svg {width:40px;}
 .route-node {padding-block:20px 24px;}
 .route-node>span {font-size:.6rem;margin-bottom:9px;}
 .route-node>strong {font-size:clamp(1.65rem,6.2vw,2rem);}
 .service-page .web-pricing,.service-page .social-pricing {padding-top:64px;}
 .service-page .entry-offer {grid-template-columns:minmax(0,1fr);margin-top:64px;padding:25px;gap:30px;}
 .service-page .service-capabilities {margin-block:76px;gap:28px;}
 .service-page .capabilities-tech {margin-bottom:40px;}
 .tech-delivery {padding:26px 22px;margin-bottom:76px;}
 .service-capabilities .section-intro h2 {font-size:clamp(2rem,7.7vw,2.65rem);}
 .service-page .capability-grid {grid-template-columns:minmax(0,1fr);gap:16px;}
 .service-page .capability-grid>article {padding-block:22px 12px;}
 .service-page .capability-grid h3 {font-size:1.55rem;}
 .service-page .service-showcase {padding:28px 20px;margin-block:76px;gap:36px;}
 .service-page .faq-section {gap:28px;margin-block:76px 24px;}
 .service-page-content {padding-bottom:0;}
 body[data-page]:not([data-page="home"]) .contact-zone:not(.tone-general) {padding-block:68px;}
}
@media(prefers-reduced-motion:reduce) {
 .service-wash,.service-atmosphere>svg {transform:none;}
 .service-grid-light {mask-image:radial-gradient(ellipse at 75% 50%,#000,transparent);}
 .connector-signal {display:none;}
 .marketing-light-viewport {display:none;}
 .service-button>span {transition:none;translate:none;}
}
@media print {
 .service-atmosphere,.connector-signal,.marketing-light-viewport {display:none;}
 .service-hero-band {border:0;}
 .service-page .service-hero,.service-page .service-capabilities {display:block;min-height:0;padding-block:20px;margin-block:24px;}
 .service-capabilities .section-intro,.service-page .faq-section>div:first-child {position:static;}
}
