/*
 * Movemos tu Imagen · Capa visual editorial v1.1.16
 * Mejoras: tipografía, Hero, Bento Grid y cabecera cristal.
 * Se carga después de styles.css y effects.css para mantener compatibilidad.
 */
:root {
  --display-spacing: -.058em;
  --card-soft-shadow: 0 24px 60px rgba(24,54,35,.085);
}

/* 1. Tipografía: ritmo editorial sin añadir dependencias externas. */
body {font-family: Inter, "Aptos", "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
      font-size: 16px; text-rendering: optimizeLegibility;}
h1,h2,h3 {text-wrap: balance;}
p {text-wrap: pretty;}
.hero h1,.inner-hero h1,.contact-header h1,
.section-head h2,.process-intro h2,.faq-grid h2,.statement-layout h2 {
  font-kerning: normal;
  letter-spacing: -.055em;
}
.section-head h2,.process-intro h2,.faq-grid h2,.split-note h2 {
  font-size: clamp(42px,4.65vw,66px);
  line-height: 1.095;
  font-weight: 825;
  margin-top: 17px;
}
.serif-italic, .headline-outline, h2 em, h3 em {
  font-family: "Iowan Old Style", "Baskerville", Georgia, "Times New Roman", serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -.052em;
}
.kicker {letter-spacing:.145em; font-size:11px; font-weight:800;}
.hero-lede,.section-head>p,.process-intro>p {line-height:1.75;}
.text-link {transition:gap .24s ease,color .24s ease;}
.text-link:hover {color:#426a3b;}
.btn {transition:transform .25s,background .25s,border-color .25s,box-shadow .25s;}

/* 2. Cabecera: cristal flotante real cuando se desplaza la página. */
.site-header {
  position: sticky;
  top:0;
  isolation:isolate;
  height:88px;
  background:transparent;
  border:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.site-header::before {
  content:"";
  pointer-events:none;
  position:absolute;
  z-index:0;
  left:50%; top:0;
  width:100%;height:100%;
  transform:translateX(-50%);
  background:rgba(250,251,246,.92);
  border-bottom:1px solid rgba(27,61,38,.075);
  backdrop-filter:blur(14px) saturate(130%);
  -webkit-backdrop-filter:blur(14px) saturate(130%);
  transition:width .38s cubic-bezier(.2,.8,.2,1),top .38s,
             height .38s,border-radius .38s,background .38s,box-shadow .38s;
}
.site-header.is-scrolled {box-shadow:none;}
.site-header.is-scrolled::before {
  top:7px;height:74px;
  width:min(1280px,calc(100% - 28px));
  border:1px solid rgba(255,255,255,.7);
  border-radius:21px;
  background:rgba(250,253,245,.79);
  backdrop-filter:blur(22px) saturate(170%);
  -webkit-backdrop-filter:blur(22px) saturate(170%);
  box-shadow:0 15px 42px rgba(24,52,31,.10),inset 0 1px 0 rgba(255,255,255,.8);
}
.nav-wrap {position:relative;z-index:1;}
.desktop-nav {gap:clamp(22px,2.25vw,35px);}
.desktop-nav a {color:#2c4b3a; font-size:13px;font-weight:740; letter-spacing:.006em;}
.desktop-nav a::after {bottom:3px;height:2px;border-radius:2px;}
.desktop-nav a:hover,.desktop-nav a[aria-current="page"] {color:#166231;}
.brand-logo-original {max-height:66px;}
.mobile-nav {z-index:3;}

/* 3. Hero: escala, equilibrio, profundidad y aire, sin cambiar el copy ni el logo. */
.hero {
  background:
    radial-gradient(ellipse 56% 65% at 79% 43%,rgba(211,243,165,.59) 0%,rgba(232,248,206,.35) 42%,transparent 83%),
    linear-gradient(165deg,#fcfdf8 0%,#f5f8ef 74%,#fafbf6 100%);
}
.hero-grid {
  grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr);
  gap:20px;
  min-height:640px;
  padding-top:82px;
  padding-bottom:84px;
}
.hero-copy {max-width:625px; padding-bottom:0;}
.hero h1 {
  font-size:clamp(62px,5.65vw,86px);
  font-weight:870;
  line-height:1.055;
  letter-spacing:-.064em;
  max-width:630px;
  margin-bottom:30px;
}
.hero .headline-outline {letter-spacing:-.075em;color:#587d49;}
.hero .headline-lime {background:linear-gradient(180deg,transparent 62%,#dcf4b9 62%,#dcf4b9 90%,transparent 90%);}
.hero-lede {font-size:clamp(16px,1.3vw,18px); max-width:510px; color:#4e6857; margin-bottom:33px;}
.hero-ctas {gap:23px;}
.hero .btn-lime {box-shadow:0 12px 30px rgba(123,168,80,.19);}
.hero .btn-lime:hover {box-shadow:0 17px 38px rgba(123,168,80,.31);}
.hero-stage-image {
  width:calc(100% + 38px);
  margin-left:-8px;
  padding:0;
  align-self:center;
  min-width:0;
  min-height:0;
}
.hero-art-float {width:100%;}
.hero-stage-art {
  width:100%; max-width:none;
  border-radius:0;
  filter:drop-shadow(0 28px 38px rgba(22,57,30,.095));
}
.hero-motion-orbits span:first-child {border-top-color:rgba(82,139,45,.43);}
.hero-motion-orbits span:nth-child(2) {border-bottom-color:rgba(91,151,47,.40);}
.hero-webgl-canvas {opacity:.49;}

/* 4. Bento Grid: cuatro servicios, mismo contenido, jerarquías distintas. */
.services-section {background:#fbfcf7;}
.services-section .section-head {margin-bottom:46px;}
.services-grid {
  display:grid;
  grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  grid-template-rows:repeat(2,minmax(290px,auto)) minmax(310px,auto);
  gap:20px;
}
.service-card {
  border-radius:25px;
  border:1px solid rgba(25,65,32,.065);
  box-shadow:0 11px 28px rgba(24,54,35,.045);
  padding:35px;
  transition:transform .34s ease,box-shadow .34s ease,border-color .34s ease;
}
.service-card:hover {box-shadow:var(--card-soft-shadow);border-color:rgba(57,108,50,.15);}
.service-top {font-size:10px;letter-spacing:.135em;font-weight:860;position:relative;z-index:4;}
.service-arrow {
  width:42px;height:42px;
  background:rgba(255,255,255,.27);
  border:1px solid rgba(24,73,35,.20);
  transition:background .25s,transform .3s,color .25s;
}
.service-card:hover .service-arrow {transform:rotate(45deg) scale(1.055);background:var(--lime);color:var(--deep);}
.service-featured {
  grid-row:span 2;
  min-height:600px;
  background:linear-gradient(142deg,#dff4ce 0%,#d3edb8 52%,#c1e5a0 100%);
}
.service-featured::before {width:560px;height:560px;right:-135px;bottom:-190px;border-color:rgba(98,161,73,.20);}
.service-feature-copy {max-width:480px;margin-top:48px;}
.service-feature-copy h3 {
  font-size:clamp(38px,3.7vw,51px);line-height:1.06;
  letter-spacing:-.055em;margin-bottom:20px;
}
.service-feature-copy p {font-size:14px;line-height:1.75;max-width:375px;}
.service-text-cta {font-size:12px;letter-spacing:.005em;}
.design-illustration {width:420px;height:310px;right:-34px;bottom:-88px;transform:rotate(-9deg);}
.service-featured:hover .design-illustration {transform:rotate(-5deg) translateY(-12px);}
.illustration-window {box-shadow:0 22px 50px rgba(31,72,41,.24);}
.service-small {
  min-height:290px;
  justify-content:flex-end;
  padding:32px 35px;
}
.service-small .service-top {position:absolute;top:31px;left:35px;width:calc(100% - 70px);}
.service-small h3 {
  margin:0 0 9px;
  font-size:clamp(25px,2.4vw,31px);line-height:1.12;
  letter-spacing:-.045em;
  max-width:330px;
}
.service-small p {font-size:13px;line-height:1.65;max-width:320px;margin:0;}
.service-search {background:linear-gradient(134deg,#f4f2e6 0%,#efeddc 100%);}
.service-care {background:linear-gradient(130deg,#e7f2e7,#dceee0);}
.service-graphic {right:30px;top:78px;filter:drop-shadow(0 8px 18px rgba(21,59,24,.085));transform:scale(.87);transform-origin:top right;}
.service-wide {
  grid-column:1/-1;
  min-height:310px;
  background:linear-gradient(110deg,#133325 0%,#153c2a 66%,#244c31 100%);
  padding:38px 45px;
}
.service-wide-content {width:70%;}
.service-wide h3 {font-size:clamp(30px,3.1vw,43px);letter-spacing:-.05em;line-height:1.12;}
.service-wide p {font-size:14px;line-height:1.7;max-width:540px;}
.service-wide .service-top {margin-bottom:22px;}
.wide-graphic {min-width:190px;}
.wide-graphic::before {border-color:rgba(161,214,146,.32);}
.wide-graphic::after {border-color:rgba(161,214,146,.23);}
.chart-badge {right:3px;top:35px;}

/* Escritorio medio: mantener proporciones sin compresión horizontal. */
@media(max-width:1190px) and (min-width:981px){
  .hero-grid {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;}
  .hero h1 {font-size:clamp(59px,6.1vw,75px);}
  .hero-stage-image {width:calc(100% + 16px);margin-left:0;}
  .services-grid {grid-template-rows:repeat(2,minmax(290px,auto)) minmax(310px,auto);}
  .service-feature-copy h3 {font-size:39px;}
}

/* Tablet: bloques apilados, Bento en dos columnas sólo si cabe. */
@media(max-width:980px){
  .site-header {height:76px;}
  .site-header.is-scrolled::before {height:65px;top:5px;width:calc(100% - 20px);border-radius:17px;}
  .mobile-nav {background:rgba(250,252,245,.985);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);}
  .hero-grid {grid-template-columns:1fr; gap:22px; min-height:auto; padding-top:66px;padding-bottom:70px;}
  .hero-copy {max-width:750px;}
  .hero h1 {font-size:clamp(57px,8vw,82px);max-width:760px;}
  .hero-stage-image {width:min(740px,100%);margin:0 auto;padding:0;}
  .services-grid {grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:18px;}
  .service-featured {grid-column:1/-1;grid-row:auto;min-height:520px;}
  .service-small {min-height:300px;}
  .service-wide {grid-column:1/-1;min-height:310px;}
}
@media(max-width:740px){
  .section-head h2,.process-intro h2,.faq-grid h2 {font-size:clamp(38px,8vw,54px);letter-spacing:-.045em;}
  .hero-grid {gap:14px;padding-top:54px;padding-bottom:54px;}
  .hero h1 {font-size:clamp(48px,9.3vw,68px);letter-spacing:-.055em;line-height:1.06;}
  .hero-lede {font-size:16px;max-width:570px;}
  .hero-stage-image {width:min(640px,100%);}
  .services-grid {grid-template-columns:1fr;gap:16px;}
  .service-featured {grid-column:auto;min-height:520px;}
  .service-small {min-height:290px;}
  .service-wide {min-height:440px;align-items:flex-start;padding:30px;}
  .service-wide-content {width:100%;}
  .service-wide .service-top {margin-bottom:28px;}
  .service-wide h3 {font-size:clamp(29px,6.4vw,40px);}
  .wide-graphic {position:absolute;right:25px;bottom:0;width:230px;height:160px;flex:none;transform:scale(.70);transform-origin:bottom right;}
}
@media(max-width:470px){
  .site-header {height:70px;}
  .site-header.is-scrolled::before {height:59px;top:5px;}
  .hero-grid {padding-top:45px;padding-bottom:42px;gap:12px;}
  .hero h1 {font-size:clamp(43px,10.9vw,54px);letter-spacing:-.061em;margin-bottom:22px;}
  .hero-lede {font-size:14.5px;line-height:1.7;margin-bottom:27px;}
  .hero-stage-image {width:100%;margin:0 auto;}
  .service-card {border-radius:20px;padding:24px;}
  .service-featured {min-height:510px;}
  .service-feature-copy {margin-top:38px;}
  .service-feature-copy h3 {font-size:clamp(33px,8.3vw,38px);}
  .service-feature-copy p {font-size:13px;max-width:270px;}
  .design-illustration {width:290px;height:234px;right:-46px;bottom:-57px;}
  .service-small {min-height:275px;}
  .service-small .service-top {top:23px;left:24px;width:calc(100% - 48px);}
  .service-small h3 {font-size:clamp(24px,6.6vw,30px);}
  .service-small p {font-size:12.5px;}
  .service-graphic {right:18px;top:73px;transform:scale(.82);}
  .service-wide {min-height:420px;}
  .service-wide h3 {font-size:clamp(28px,7.5vw,36px);}
  .service-wide p {font-size:13px;}
}