﻿/* =========================================================
   Secciones bot (rev. usuario):
   - Sec 9: 4 herramientas (Tour 360, Dron, Video, Foto pro)
   - Sec 10: Opiniones de clientes
   - Sec 11: Blog y noticias
   - Sec 12: Preguntas y respuestas
   ========================================================= */

/* ---------- Sec 9: 4 herramientas de promoción ---------- */
const TOOLS = [
{
  icon: "view",
  badge: "360°",
  title: "Tour virtual 360°",
  desc: "Recorrido inmersivo para que los compradores visiten tu vivienda sin moverse de casa, en cualquier momento.",
  img: "assets/tool-tour-360.webp"
},
{
  icon: "plane",
  badge: "Aéreo",
  title: "Grabación con dron",
  desc: "Vistas aéreas que muestran la ubicación, el entorno y las cualidades únicas de la zona desde el aire.",
  img: "assets/tool-drone.png"
},
{
  icon: "video",
  badge: "Comercial",
  title: "Vídeo comercial",
  desc: "Nuestro comercial graba un vídeo de presentación recorriendo la vivienda y destacando lo que la hace especial.",
  img: "assets/tool-video-comercial.png"
},
{
  icon: "camera",
  badge: "Profesional",
  title: "Fotografía profesional",
  desc: "Sesión con fotógrafo profesional, edición HDR y staging virtual con IA para que tu casa luzca al máximo.",
  img: "assets/tool-photo-pro.jpg"
}];


function ToolsSection() {
  return (
    <section className="section qv-tools-luxe" id="como-vendemos" aria-label="Cómo promocionamos tu vivienda">
      <div className="container">
        <div className="qv-tools-luxe__head">
          <span className="qv-tools-luxe__eyebrow">Marketing de verdad</span>
          <h2 className="qv-tools-luxe__title">
            Servicios de <em>presentación premium</em>,<br />
            incluidos en tu exclusiva.
          </h2>
          <p className="qv-tools-luxe__lead">
            Cuatro disciplinas profesionales que llevamos a cada propiedad. Sin coste extra. Sin promesas vacías. Sin recargos a la firma.
          </p>
        </div>

        <div className="qv-tools-luxe__grid">
          {TOOLS.map((t, i) =>
          <article key={i} className="qv-tools-luxe__card">
              <div className={"qv-tools-luxe__media" + (t.contain ? " qv-tools-luxe__media--contain" : "")}>
                <img src={t.img} alt={t.title} />
                <span className="qv-tools-luxe__n">0{i + 1}</span>
              </div>
              <div className="qv-tools-luxe__body">
                <span className="qv-tools-luxe__tag">{t.badge}</span>
                <h3>{t.title}</h3>
                <p>{t.desc}</p>
                <span className="qv-tools-luxe__included">
                  <Icon name="check" size={12} strokeWidth={3} /> Incluido en tu exclusiva
                </span>
              </div>
            </article>
          )}
        </div>
      </div>
    </section>);

}

/* ---------- Sec 10: Testimonios ---------- */
const TESTIMONIALS = [
{
  quote: "Vendieron mi piso en La Mata en menos tiempo del que esperaba y todo lo prometido lo cumplieron. La transparencia con el comprador fue lo que marcó la diferencia.",
  name: "Carmen Zapata",
  role: "Vendedora · Torrevieja",
  avatar: "https://images.unsplash.com/photo-1544005313-94ddf0286df2?auto=format&fit=crop&w=160&q=80"
},
{
  quote: "Lo que más me gustó fue el contrato por servicios. Sabía exactamente qué iban a hacer y cómo me iban a reportar. Y la valoración fue realista, no inflada para captar.",
  name: "Javi Jauregui Apestegui",
  role: "Vendedor · Orihuela Costa",
  avatar: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?auto=format&fit=crop&w=160&q=80"
},
{
  quote: "El uso de IA para las descripciones multilingües nos abrió compradores que no esperábamos. La oferta final llegó de un alemán que había visto el anuncio en su idioma.",
  name: "Toni gca",
  role: "Vendedor · Punta Prima",
  avatar: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?auto=format&fit=crop&w=160&q=80"
},
{
  quote: "Trato cercano y profesional. Isaac y su equipo nos acompañaron hasta la firma del notario y resolvieron temas legales que nos habrían dado muchos quebraderos.",
  name: "José Manre",
  role: "Vendedor · Cabo Roig",
  avatar: "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?auto=format&fit=crop&w=160&q=80"
}];


function Testimonials() {
  const VISIBLE = 2;
  const N = TESTIMONIALS.length;
  // Track renders all testimonials + a clone of the first VISIBLE at the end,
  // so we can animate past the last card and then snap back to 0 invisibly.
  const items = [...TESTIMONIALS, ...TESTIMONIALS.slice(0, VISIBLE)];

  const [start, setStart] = useState(0);
  const [withTransition, setWithTransition] = useState(true);
  const viewportRef = useRef(null);
  const [cardW, setCardW] = useState(0);
  const gap = 60;

  useEffect(() => {
    const update = () => {
      if (!viewportRef.current) return;
      const style = window.getComputedStyle(viewportRef.current);
      const padL = parseFloat(style.paddingLeft) || 0;
      const padR = parseFloat(style.paddingRight) || 0;
      const w = viewportRef.current.clientWidth - padL - padR;
      const perView = window.innerWidth >= 880 ? VISIBLE : 1;
      setCardW((w - gap * (perView - 1)) / perView);
    };
    update();
    window.addEventListener("resize", update);
    return () => window.removeEventListener("resize", update);
  }, []);

  // After animating past the end, snap silently back to 0
  useEffect(() => {
    if (start === N) {
      const t = setTimeout(() => {
        setWithTransition(false);
        setStart(0);
      }, 500);
      return () => clearTimeout(t);
    }
    // After silent snap, re-enable transition for future moves
    if (!withTransition) {
      const t = setTimeout(() => setWithTransition(true), 50);
      return () => clearTimeout(t);
    }
  }, [start, withTransition]);

  const next = () => {
    if (!withTransition) return;
    setStart((s) => Math.min(s + 1, N));
  };
  const prev = () => {
    if (!withTransition) return;
    if (start === 0) {
      // Jump invisibly to position N (showing clones at the end),
      // then animate back one step to N-1 (which equals first real card).
      setWithTransition(false);
      setStart(N);
      // After the silent jump, animate to N-1
      setTimeout(() => {
        setWithTransition(true);
        setStart(N - 1);
      }, 60);
    } else {
      setStart((s) => s - 1);
    }
  };

  const trackOffset = -start * (cardW + gap);
  const activeDot = start % N;

  return (
    <section className="section section--w1400" aria-label="Opiniones de clientes">
      <div className="container">
        <div className="section-head">
          <span className="eyebrow eyebrow--center">Opiniones de clientes</span>
          <h2 style={{ color: "rgb(20, 28, 20)" }}>Vendedores que ya nos <span className="hl">recomiendan</span></h2>
        </div>

        <div className="testimonial-wrap">
          <button className="testimonial-arrow testimonial-arrow--left" onClick={prev} aria-label="Anterior">
            <Icon name="arrow-left" size={18} />
          </button>

          <div className="testimonial-viewport" ref={viewportRef}>
            <div
              className="testimonial-track"
              style={{
                transform: `translateX(${trackOffset}px)`,
                transition: withTransition ? "transform 480ms cubic-bezier(0.16, 1, 0.3, 1)" : "none"
              }}>
              
              {items.map((t, i) =>
              <article key={i} className="testimonial-card" style={{ width: cardW > 0 ? cardW + "px" : "100%" }}>
                  <div className="testimonial-card__body">
                    <p className="testimonial-card__quote">{t.quote}</p>
                    <div className="testimonial-card__stars" aria-label="5 estrellas">★ ★ ★ ★ ★</div>
                    <div className="testimonial-card__author">
                      <span className="testimonial-card__name" style={{ color: "rgb(20, 28, 20)" }}>{t.name}</span>
                      <span className="testimonial-card__sep">|</span>
                      <span className="testimonial-card__role">{t.role}</span>
                    </div>
                  </div>
                  <div className="testimonial-card__avatar-wrap">
                    <div className="testimonial-card__avatar" style={{ backgroundImage: `url(${t.avatar})` }} />
                    <span className="testimonial-card__quote-icon" aria-hidden="true">
                      <Icon name="quote" size={16} strokeWidth={2.2} />
                    </span>
                  </div>
                </article>
              )}
            </div>
          </div>

          <button className="testimonial-arrow testimonial-arrow--right" onClick={next} aria-label="Siguiente">
            <Icon name="arrow-right" size={18} />
          </button>
        </div>

        <div className="carousel__dots">
          {TESTIMONIALS.map((_, i) =>
          <span key={i} className={"carousel__dot" + (i === activeDot ? " is-active" : "")} />
          )}
        </div>
      </div>
    </section>);

}

/* ---------- Sec 11: Blog y noticias ---------- */
const POSTS = [
{
  cat: "Guía",
  date: "May 2026",
  title: "Cómo preparar tu vivienda en Torrevieja antes de ponerla a la venta",
  img: "https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=900&q=80"
},
{
  cat: "Mercado",
  date: "Abr 2026",
  title: "Precios de la vivienda en Orihuela Costa: cierre del trimestre",
  img: "https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=900&q=80"
},
{
  cat: "IA",
  date: "Abr 2026",
  title: "Por qué la IA no sustituye a tu agente: lo hace más efectivo",
  img: "https://images.unsplash.com/photo-1581091226825-a6a2a5aee158?auto=format&fit=crop&w=900&q=80"
}];


function Blog() {
  return (
    <section className="section section--cream" id="blog" aria-label="Blog y noticias">
      <div className="container">
        <div className="section-head">
          <span className="eyebrow eyebrow--center">Blog y noticias</span>
          <h2>Lee nuestro último <span className="hl">contenido</span></h2>
          <p>Información útil sobre el mercado de la Costa Blanca Sur y consejos prácticos para vendedores.</p>
        </div>

        <div className="blog-grid">
          {POSTS.map((p, i) =>
          <article key={i} className="blog-card">
              <div className="blog-card__media"><img src={p.img} alt={p.title} /></div>
              <div className="blog-card__body">
                <div className="blog-card__meta">
                  <span>{p.cat}</span>
                  <span className="dot" />
                  <span>{p.date}</span>
                </div>
                <h3>{p.title}</h3>
                <a className="blog-card__link" href="#">
                  Leer artículo <Icon name="arrow-right" size={14} />
                </a>
              </div>
            </article>
          )}
        </div>

        <div className="center-cta">
          <Button variant="primary" iconRight="arrow-right" as="a" href="blog.html">
            Ir al blog
          </Button>
        </div>
      </div>
    </section>);

}

/* ---------- Sec 12: FAQ ---------- */
const FAQS = [
{
  q: "¿Cuál es la mejor inmobiliaria para vender en Torrevieja?",
  a: "La mejor inmobiliaria es la que te ofrece transparencia, marketing real y un contrato que la obliga a cumplir. En Innovaria firmamos servicios por escrito, compartimos tu exclusiva con toda la red MLS y aplicamos IA al anuncio. Si no cumplimos lo pactado, la exclusiva no te obliga a ti."
},
{
  q: "¿Mejor exclusiva o trabajar con varias agencias?",
  a: "Una exclusiva compartida con la red MLS es lo mejor de ambos mundos: tu vivienda entra en todas las agencias asociadas, pero tú tratas con un único interlocutor. Evitas anuncios duplicados, precios incoherentes y compradores que ven tu casa rebotada por varias agencias."
},
{
  q: "¿Cobráis también al comprador?",
  a: "No. El precio anunciado es el precio final. Al comprador no se le añade ninguna comisión sobre el precio publicado. Esto evita sorpresas, agiliza negociaciones y hace tu vivienda más atractiva frente a anuncios que esconden cargos."
},
{
  q: "¿Cómo sé que cumpliréis lo que prometéis?",
  a: "Todo lo que hacemos por tu casa va por contrato: fotografía, vídeo, IA aplicada, difusión MLS, portales, reportes y acompañamiento. La exclusiva está condicionada a que cumplamos los servicios firmados. Si no lo hacemos, no te obliga."
},
{
  q: "¿Qué es una MLS inmobiliaria?",
  a: "Una MLS (Multiple Listing Service) es una red de agencias que comparten cartera bajo reglas comunes. Tú firmas con una sola, pero tu vivienda se publica y se trabaja desde todas las agencias asociadas, con reparto pactado de la comisión entre captadora y vendedora."
},
{
  q: "¿Cuánto cuesta vender con Innovaria?",
  a: "Trabajamos con honorarios de mercado, siempre acordados por contrato antes de empezar y siempre a éxito. No hay cuotas de alta, ni pagos por anuncio, ni gastos sorpresa. Al comprador no se le añade comisión sobre el precio anunciado."
},
{
  q: "¿Qué inmobiliaria usa IA para vender casas en la Costa Blanca?",
  a: "Innovaria es pionera en aplicar IA al proceso de venta en Torrevieja y Orihuela Costa: optimización de imágenes y staging virtual, descripciones en cinco idiomas, segmentación de campañas, pricing con datos y matching comprador-vivienda. La IA no sustituye al agente: lo hace más efectivo."
}];


function FAQ() {
  const [open, setOpen] = useState(0);
  return (
    <section className="section" aria-label="Preguntas frecuentes">
      <div className="container">
        <div className="section-head">
          <span className="eyebrow eyebrow--center">Preguntas y respuestas</span>
          <h2>Resolvemos tus dudas sobre <span className="hl">vender</span></h2>
          <p>Respuestas claras y autocontenidas para propietarios que quieren vender en Torrevieja u Orihuela Costa.</p>
        </div>

        <div className="faq">
          {FAQS.map((f, i) =>
          <FAQItem
            key={i}
            q={f.q}
            a={f.a}
            open={open === i}
            onClick={() => setOpen(open === i ? -1 : i)} />

          )}
        </div>

        <div className="center-cta">
          <Button variant="primary" iconRight="arrow-right" as="a" href="#valoracion">
            ¿Tienes otra pregunta? Consulta todas las preguntas
          </Button>
        </div>
      </div>
    </section>);

}

function AppPromo() {
  return (
    <section className="section section--split-cream-page" id="app" aria-label="Descarga nuestra app" style={{ padding: "50px 0px" }}>
      <div className="container" style={{ padding: "0 30px" }}>
        <div className="apppromo" style={{ height: "420px", maxWidth: "100%", width: "1900px" }}>
          <div className="apppromo__content">
            <span className="apppromo__eyebrow">Descarga la app</span>
            <h2>
              Tu vivienda en tu <span className="hl">móvil</span>
            </h2>
            <p>Encuentra tu vivienda en Torrevieja y Orihuela Costa desde el móvil, recibe alertas de nuevas propiedades y reserva visitas en un clic. 

            </p>
            <div className="apppromo__stores">
              <a className="app-store-btn" href="#" aria-label="Descargar en App Store">
                <span className="app-store-btn__icon">
                  <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
                    <path d="M16.5 1.5c0 1.2-.5 2.3-1.2 3.1-.9.9-2.3 1.6-3.4 1.5-.1-1.2.5-2.4 1.2-3.1.8-.9 2.2-1.5 3.4-1.5zM20.4 17.2c-.5 1.1-.7 1.6-1.4 2.6-.9 1.4-2.2 3.2-3.9 3.2-1.5 0-1.9-1-3.9-1-2 0-2.4 1-3.9 1-1.7 0-2.9-1.6-3.8-3.1C1 16.9.7 12 2.1 9.4 3.1 7.6 4.7 6.5 6.3 6.5c1.6 0 2.6 1 3.9 1 1.3 0 2.1-1 3.9-1 1.4 0 2.9.8 3.9 2.1-3.4 1.9-2.8 6.8 2.4 8.6z" />
                  </svg>
                </span>
                <span className="app-store-btn__text">
                  <span className="app-store-btn__small">Descargar en</span>
                  <span className="app-store-btn__big">App Store</span>
                </span>
              </a>
              <a className="app-store-btn app-store-btn--green" href="#" aria-label="Descargar en Google Play">
                <span className="app-store-btn__icon">
                  <svg viewBox="0 0 24 24" aria-hidden="true">
                    <path fill="#fff" d="M3.6 1.7C3.2 2.1 3 2.6 3 3.4v17.2c0 .8.2 1.3.6 1.7l.1.1L13.3 13l.1-.1-9.7-11.3-.1.1z" />
                    <path fill="#fff" d="M16.6 16.2L13.5 13l3-3 .1.1 3.7 2.1c1.1.6 1.1 1.6 0 2.2l-3.7 2-.1.1z" opacity=".85" />
                    <path fill="#fff" d="M16.7 16.1L13.4 12.8 3.6 22.4c.4.4 1 .4 1.8 0l11.3-6.3z" opacity=".8" />
                    <path fill="#fff" d="M16.7 9.6L5.4 3.3c-.8-.4-1.4-.4-1.8 0l9.8 9.5 3.3-3.2z" opacity=".95" />
                  </svg>
                </span>
                <span className="app-store-btn__text">
                  <span className="app-store-btn__small">Disponible en</span>
                  <span className="app-store-btn__big">Google Play</span>
                </span>
              </a>
            </div>
          </div>

          <div className="apppromo__phones">
            <img className="apppromo__phones-img" src="assets/app-phones.png" alt="App de Innovaria en dos móviles con QR" />
          </div>
        </div>
      </div>
    </section>);

}

/* ---------- HOME · Sección SEO con Inno (asistente IA 24/7) ---------- */
function HomeInnoSEO() {
  return (
    <section className="section pqi-assistant section--inverse" id="asistente" aria-label="Asistente inmobiliario IA en Torrevieja">
      <div className="container">
        <div className="pqi-assistant__layout">
          <div className="pqi-assistant__robot">
            <img src="assets/robot-ia-pointing.png" alt="Inno, asistente IA de Innovaria para Torrevieja y Orihuela Costa" />
          </div>
          <div className="pqi-assistant__content">
            <span className="eyebrow eyebrow--inverse">Asistente inmobiliario con IA · 24/7</span>
            <h2>Pregunta lo que quieras sobre vivienda en <span className="hl" style={{ color: "var(--innov-green-300)" }}>Torrevieja</span>.</h2>
            <p>
              ¿Cuánto vale tu casa? ¿Cuáles son las mejores zonas para invertir? ¿Cuánto tarda la firma del notario? <strong>Inno</strong>, nuestro asistente con IA, te responde al instante, también de madrugada, en cinco idiomas. Y si necesitas un humano, te conecta con uno de nuestros agentes especializados.
            </p>

            <div className="pqi-assistant__features">
              <div className="pqi-assistant__feature">
                <span className="pqi-assistant__feature-icon"><Icon name="message-circle" size={18} /></span>
                <div>
                  <strong>Pregúntale lo que sea</strong>
                  <p>Precios, zonas, impuestos, hipotecas, plazos, documentación. Lo que se te ocurra sobre comprar o vender.</p>
                </div>
              </div>
              <div className="pqi-assistant__feature">
                <span className="pqi-assistant__feature-icon"><Icon name="zap" size={18} /></span>
                <div>
                  <strong>Respuesta inmediata</strong>
                  <p>Menos de 30 segundos. Sin esperas, sin "le devolveremos la llamada", sin formularios eternos.</p>
                </div>
              </div>
              <div className="pqi-assistant__feature">
                <span className="pqi-assistant__feature-icon"><Icon name="languages" size={18} /></span>
                <div>
                  <strong>En tu idioma</strong>
                  <p>Español, inglés, alemán, francés y ruso. Te entendemos siempre, vendas o compres desde donde sea.</p>
                </div>
              </div>
              <div className="pqi-assistant__feature">
                <span className="pqi-assistant__feature-icon"><Icon name="user-check" size={18} /></span>
                <div>
                  <strong>Y un humano cuando hace falta</strong>
                  <p>Si tu caso lo necesita, Inno te pasa el relevo a un agente local con todo el contexto preparado.</p>
                </div>
              </div>
            </div>

            <div style={{ display: "flex", gap: 14, flexWrap: "wrap", marginTop: 32 }}>
              <Button variant="primary" iconRight="arrow-right" as="a" href="#asistente">
                Hablar con Inno
              </Button>
              <Button variant="ghost-light" icon="phone" as="a" href="tel:+34604494089">
                604 49 40 89
              </Button>
            </div>
          </div>
        </div>
      </div>
    </section>);

}

/* ---------- HOME · Bienvenida al mundo Innovaria ---------- */
function HomeWelcome() {
  const tiles = [
  {
    icon: "sparkles",
    label: "Asistente IA",
    title: "Inno te responde 24/7",
    text: "Pregunta lo que quieras sobre vivienda y obtén respuesta al instante en cinco idiomas.",
    href: "#asistente"
  },
  {
    icon: "smartphone",
    label: "App propia",
    title: "Tu vivienda en tu bolsillo",
    text: "Una app única para vendedores y compradores. Notificaciones, reportes y chat con tu agente.",
    href: "#app"
  },
  {
    icon: "calculator",
    label: "Estudio gratis",
    title: "¿Cuánto vale tu casa?",
    text: "Valoración profesional con IA de pricing y comparables reales. Sin coste, sin compromiso.",
    href: "valorar-mi-casa-gratis.html"
  },
  {
    icon: "search",
    label: "Cartera viva",
    title: "Encuentra tu próxima casa",
    text: "Filtra entre cientos de viviendas verificadas en Torrevieja y Orihuela Costa.",
    href: "quiero-comprar.html"
  }];

  return (
    <section className="section section--cream home-welcome" aria-label="Bienvenido al mundo Innovaria">
      <div className="container">
        <div className="section-head">
          <span className="eyebrow eyebrow--center">Bienvenido a nuestro mundo</span>
          <h2>Lo inmobiliario, <span className="hl">más fácil</span> que nunca</h2>
          <p>Tecnología propia, equipo humano y una sola misión: que comprar o vender tu vivienda en la Costa Blanca Sur sea sencillo, transparente y rápido. Esto es lo que vas a encontrar.</p>
        </div>

        <div className="home-welcome__grid">
          {tiles.map((t, i) =>
          <a key={i} className="home-welcome__tile" href={t.href}>
              <span className="home-welcome__icon"><Icon name={t.icon} size={24} /></span>
              <span className="home-welcome__label">{t.label}</span>
              <h3>{t.title}</h3>
              <p>{t.text}</p>
              <span className="home-welcome__arrow">
                <Icon name="arrow-up-right" size={16} />
              </span>
            </a>
          )}
        </div>
      </div>
    </section>);

}

/* ---------- HOME · Servicios (estilo findrealestate.com — Comprar / Vender) ---------- */
function HomeServicios() {
  const rows = [
  {
    n: "1",
    label: "Comprar",
    href: "quiero-comprar.html",
    text: "Compra de forma más inteligente con agentes expertos respaldados por profesionales en hipotecas, asesoría legal y tasaciones, listos para conseguirte la mejor oferta rápidamente. Lo hemos hecho con miles de viviendas y sabemos qué funciona.",
    img: "https://images.unsplash.com/photo-1564013799919-ab600027ffc6?auto=format&fit=crop&w=1800&q=80"
  },
  {
    n: "2",
    label: "Vender",
    href: "quiero-vender.html",
    text: "Vende rápido, vende caro. Tu vivienda contará con presentación profesional, precio estratégico, jornadas de visitas constantes y agentes que no paran de trabajar hasta que el comprador adecuado firme.",
    img: "https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1800&q=80"
  }];

  return (
    <section className="home-servicios" aria-label="Servicios Innovaria">
      <div className="home-servicios__head">
        <span className="home-servicios__eyebrow" style={{ color: "rgb(168, 220, 178)" }}>Servicios</span>
        <h2 className="home-servicios__title">
          Cómo <span className="home-servicios__title-em">Innovaria</span><br />
          <span className="home-servicios__title-sub" style={{ color: "rgb(168, 220, 178)" }}>puede ayudarte</span>
        </h2>
      </div>

      {rows.map((r, i) =>
      <a key={i} className="home-servicios__row" href={r.href} aria-label={`Ir a ${r.label}`} style={{ height: "288px" }}>
          <span className="home-servicios__bg" style={{ backgroundImage: `url(${r.img})` }} />
          <span className="home-servicios__veil" />

          <div className="home-servicios__row-inner">
            <div className="home-servicios__left">
              <span className="home-servicios__num">{r.n}</span>
              <p className="home-servicios__text">{r.text}</p>
            </div>

            <div className="home-servicios__right">
              <span className="home-servicios__big">{r.label}</span>
              <span className="home-servicios__arrow" aria-hidden="true">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round">
                  <line x1="5" y1="12" x2="19" y2="12" />
                  <polyline points="12 5 19 12 12 19" />
                </svg>
              </span>
            </div>
          </div>
        </a>
      )}

      <div className="home-servicios__closing">
        <div className="home-servicios__closing-inner">
          <h3 className="home-servicios__closing-title" style={{ fontSize: "36px", fontWeight: "600", width: "587px" }}>
            Nuestros agentes certificados te guiarán a través de cada etapa del proceso inmobiliario con <span style={{ color: "rgb(168, 220, 178)" }}>expertos. Conocimiento y apoyo fiable.</span>
          </h3>
          <a className="home-servicios__closing-cta" href="contacto.html">
            <span>Habla con un agente</span>
            <span className="home-servicios__closing-cta-arrow" aria-hidden="true">
              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round">
                <line x1="5" y1="12" x2="19" y2="12" />
                <polyline points="12 5 19 12 12 19" />
              </svg>
            </span>
          </a>
        </div>
      </div>
    </section>);

}

Object.assign(window, { ToolsSection, AppPromo, Testimonials, Blog, FAQ, HomeInnoSEO, HomeWelcome, HomeServicios });