<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>I Instituto Politécnico Médio Beira-Índico (IPMB)</title>
    <link rel="stylesheet" href="index.css?v=24">
</head>
<body>

    <!-- NAVBAR -->
    <header class="navbar">
        <div class="navbar-container">
            <a href="index.php"  class="brand-logo active">
                <img src="img/webp/LOGO.webp" alt="IDHI Logo" class="logo-img" fetchpriority="high">
            </a>

            <button class="hamburger" id="hamburger">
                <span></span><span></span><span></span>
            </button>

            <nav class="navbar-nav" id="navbarNav">
                <ul class="nav-menu">
                    <li><a href="unidades.php" class="nav-link">Unidades Orgânicas</a></li>
                    <li class="dropdown">
                        <a href="educacao.php" class="nav-link">Educação</a>
                        <ul class="dropdown-menu">
                            <li><a href="catalogo.php" class="dropdown-item">Catalogo</a></li>
                            <li><a href="edital.php" class="dropdown-item">Edital</a></li>
                            <li><a href="inscricao.php" class="dropdown-item">Inscrições Online</a></li>
                        </ul>
                    </li>
                    <li><a href="certificacoes.php" class="nav-link">Certificações</a></li>
                    <li><a href="idhi.php" class="nav-link">IDHI</a></li>
                    <li><a href="noticias.php" class="nav-link">Notícias</a></li>
                    <li><a href="sobre-nos.php" class="nav-link">Sobre-nos</a></li>
                    <li><a href="contacto.php" class="nav-link">Contacto</a></li>
                </ul>
                <div class="nav-social">
                    <a href="https://www.facebook.com/ipmbi" class="social-link" aria-label="Facebook">
                        <svg viewBox="0 0 24 24" fill="currentColor"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>
                    </a>
                    <a href="" class="social-link" aria-label="YouTube">
                        <svg viewBox="0 0 24 24" fill="currentColor"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>
                    </a>
                    <a href="https://www.instagram.com/ipmbi.beira?igsh=YjFwaTQwbHZ5ZDg5" class="social-link" aria-label="Instagram">
                        <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 1 0 0 12.324 6.162 6.162 0 0 0 0-12.324zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.406-11.845a1.44 1.44 0 1 0 0 2.881 1.44 1.44 0 0 0 0-2.881z"/></svg>
                    </a>
                    <a href="#" class="social-link" aria-label="WhatsApp">
                        <svg viewBox="0 0 24 24" fill="currentColor"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413z"/></svg>
                    </a>
                </div>
            </nav>
        </div>
    </header>

    <!-- HERO -->
    <section class="hero">
        <img src="img/webp/Banner.webp" alt="Banner IDHI" class="hero-bg" fetchpriority="high">
        <div class="hero-overlay"></div>

        <div class="hero-content">
            <div class="hero-card">

                <!-- Coluna esquerda: imagem grande -->
                <div class="hero-img-col">
                    <img src="img/webp/FOTO de destaque -   (800 x 800 px) (3).webp" alt="IDHI Educação" fetchpriority="high">
                </div>

                <!-- Coluna direita: conteúdo -->
                <div class="hero-content-col">
                    <h1> Instituto Politécnico Médio Beira-Índico<br>Missão. Visão. Valores.</h1>

                   <p>O Instituto Politécnico Médio Beira-Índico (IPMB) é uma instituição de ensino técnico-profissional fundada em 2015, com sede na cidade da Beira e uma delegação em Vilankulos. 
                    Tem como missão primordial formar profissionais qualificados e comprometidos com o desenvolvimento humano e social, pautando-se por valores de dignidade, responsabilidade e excelência académica.</p>

                    <!-- Thumbnails em linha -->
                    <div class="thumbs-row">
                        <div class="thumb-item">
                            <img src="img/webp/MEDICINA GERAL 300X300.webp" alt="">
                            <span class="thumb-badge">Medicina Geral</span>
                        </div>
                        <div class="thumb-item">
                            <img src="img/webp/ENFERMAGEM 300X300.webp" alt="">
                            <span class="thumb-badge">Enfermagem</span>
                        </div>
                        <div class="thumb-item">
                            <img src="img/webp/CURSO DE SAUDE MATERNO E INFANTIL.webp" alt="">
                            <span class="thumb-badge">Saúde Materno e Infantil</span>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </section>

    <main>

        <!-- SERVIÇOS -->
        <section class="services-section">
            <div class="container">
                <div class="services-grid">

                    <!-- Missão -->
                    <div class="service-card">
                        <div class="service-icon">
                            <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <circle cx="12" cy="12" r="9" stroke="white" stroke-width="2" fill="none"/>
                                <circle cx="12" cy="12" r="5" stroke="white" stroke-width="2" fill="none"/>
                                <circle cx="12" cy="12" r="1.5" fill="white"/>
                            </svg>
                        </div>
                        <h3>Missão</h3>
                        <p>Promover o desenvolvimento da condição humana, através da formação científica, técnica, axiológica da sociedade moçambicana, para o progresso, a inovação e o bem-estar social.</p>
                    </div>

                    <!-- Visão -->
                    <div class="service-card">
                        <div class="service-icon">
                            <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8S1 12 1 12z" stroke="white" stroke-width="2" fill="none"/>
                                <circle cx="12" cy="12" r="3.5" stroke="white" stroke-width="2" fill="none"/>
                                <circle cx="12" cy="12" r="1.2" fill="white"/>
                            </svg>
                        </div>
                        <h3>Visão</h3>
                        <p>Ser uma instituição de educação de excelência, e catalisadora no aprimoramento de competências multidimensionais, e de reconhecido mérito no exercício da profissão.</p>
                    </div>

                    <!-- Valores -->
                    <div class="service-card">
                        <div class="service-icon">
                            <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" fill="white"/>
                            </svg>
                        </div>
                        <h3>Valores</h3>
                        <p>     Democracia e respeito pelos direitos humanos;
                                Valorização dos ideais da pátria, ciência, humanidade e respeito pelos valores culturais;
                                Liberdade de criação cultural, artística, científica, tecnológica e inovação;
                                Promoção da solidariedade, como condição para o desenvolvimento da comunidade e o mundo.</p>
                    </div>

                </div>
            </div>
        </section>

        <!-- DESTAQUE: DESENVOLVIMENTO HUMANO -->
        <section class="highlight-section">
            <div class="highlight-img">
                <img src="img/webp/FOTO PARA HISTORIA.webp" alt="Desenvolvimento Humano IDHI" loading="lazy" decoding="async">
            </div>
            <div class="highlight-content">
                <h2>Breve Historial </h2>
                <p> O Instituto Politécnico Médio Beira-Índico (IPMB) nasceu em 2015 com a missão de formar profissionais qualificados, capazes de responder às necessidades crescentes do mercado de trabalho moçambicano. Desde a sua criação, 
                    tem sido guiado por valores de dignidade humana, responsabilidade social e excelência académica concentrando-se em qualificações técnicas voltadas para áreas estratégicas,
                    como a saúde — com cursos de Enfermagem Geral, Nutrição, Medicina Geral e Enfermagem em Saúde Materno e Infantil — e na área comercial, com formações em Contabilidade, Informática, Gestão, Gestão de Recursos Humanos e Administração de Trabalho. 
                    O sucesso foi imediato: em apenas uma década, o IPMB já graduou mais de 1.400 jovens, com uma taxa de empregabilidade de cerca de 90%, um marco que demonstra a relevância prática da sua formação.
                    Com sede na cidade da Beira, o IPMB expandiu-se para Vilankulos, reforçando a sua presença em diferentes regiões do país e aproximando-se das comunidades locais. Essa expansão reflecte o compromisso da instituição em democratizar o acesso à educação técnico-profissional, 
                    criando oportunidades para jovens de diversas origens.
                o longo da sua trajectória, o IPMB consolidou parcerias com empresas, organizações e instituições públicas, promovendo estágios e programas de inserção laboral. Além disso, tem investido em inovação pedagógica, incorporando tecnologias digitais e metodologias modernas de ensino para preparar os estudantes para os desafios do país.
                Promover o desenvolvimento da condição humana, através da formação científica, técnica, axiológica da sociedade moçambicana, para o progresso, a inovação e o bem-estar social.
            Ser uma instituição de educação de excelência, e catalisadora no aprimoramento de competências multidimensionais, e de reconhecido mérito no exercício da profissão.</p>

                <a href="noticias.php" class="btn btn-primary highlight-btn">SABER MAIS</a>
            </div>
        </section>

        <!-- GALERIA ESTUDAR NO IDHI (CARROSSEL) -->
        <section class="study-gallery-section">
            <div class="container">
                <div class="sgs-header">
                    <h2>Estudar no IPMB</h2>
                    <div class="sgs-line"></div>
                    <p>Vem construir o teu futuro connosco</p>
                </div>
            </div>

            <div class="sgs-carousel">
                <button class="sgs-arrow sgs-arrow-left" type="button" aria-label="Anterior">&#8249;</button>

                <div class="sgs-viewport">
                    <div class="sgs-track">
                        <article class="sgs-item">
                            <img src="img/webp/FOTOS DE ESTUDANTES NA SALA DE AULAS  (1).webp" alt="Nossas Salas de Aulas" loading="lazy" decoding="async">
                            <div class="sgs-caption">
                                <h3>NOSSAS SALAS DE AULAS</h3>
                                <p>Programas de intercâmbio e parcerias internacionais para ampliar horizontes académicos.</p>
                                <a href="noticias.php" class="sgs-link">Saber mais &#8594;</a>
                            </div>
                        </article>
                        <article class="sgs-item">
                            <img src="img/webp/ESTAGIO.webp" alt="Centros de investigação" loading="lazy" decoding="async">
                            <div class="sgs-caption">
                                <h3>ESTAGIOS</h3>
                                <p>Os nossos estudantes realizam estágios de forma sistemática e cíclica a cada semestre, em diferentes campos de prática localizados tanto na cidade quanto em zonas rurais.</p>
                                <a href="noticias.php" class="sgs-link">Saber mais &#8594;</a>
                            </div>
                        </article>

                        <article class="sgs-item">
                            <img src="img/webp/SALA DE INFORMATICA.webp" alt="Comunidade e Extensão" loading="lazy" decoding="async">
                            <div class="sgs-caption">
                                <h3>SALA DE INFORMATICA</h3>
                                <p>Essa estrutura proporciona aos estudantes um ambiente de aprendizagem moderno e funcional, favorecendo a experimentação, a investigação e a consolidação dos conteúdos teóricos.</p>
                                 <a href="noticias.php" class="sgs-link">Saber mais &#8594;</a>
                            </div>
                        </article>

                        <article class="sgs-item">
                            <img src="img/webp/1.webp" alt="Faculdades e Extensões" loading="lazy" decoding="async">
                            <div class="sgs-caption">
                                <h3>FACULDADES E EXTENSOES</h3>
                                <p>Presença em Beira e Vilankulos, levando educação de qualidade a todo o país.</p>
                                 <a href="noticias.php" class="sgs-link">Saber mais &#8594;</a>
                            </div>
                        </article>
                        
                        </article>
                        <article class="sgs-item">
                            <img src="img/webp/LABORATORIO 800 X800  (1).webp" alt="Laboratórios e Prática" loading="lazy" decoding="async">
                            <div class="sgs-caption">
                                <h3>LABORATORIOS E PRATICA</h3>
                                <p>Os nossos laboratórios estão devidamente equipados com materiais e recursos que asseguram o desenvolvimento das aulas práticas com maior dinamismo e eficiência.</p>
                                <a href="noticias.php" class="sgs-link">Conhecer &#8594;</a>
                            </div>
                        </article>
                        <article class="sgs-item">
                            <img src="img/webp/CAPA.webp" alt="Comunidade e Extensão" loading="lazy" decoding="async">
                            <div class="sgs-caption">
                                <h3>COMUNIDADE E EXTENSÃO</h3>
                                <p>O Instituto Politécnico Médio Beira Índico (IPMB) celebra uma trajetória de 10 anos de existência, marcada pelo compromisso com a formação técnica e profissional de excelência.</p>
                                 <a href="noticias.php" class="sgs-link">Saber mais &#8594;</a>
                            </div>
                        </article>
                    </div>
                </div>

                <button class="sgs-arrow sgs-arrow-right" type="button" aria-label="Seguinte">&#8250;</button>
            </div>
        </section>

        <!-- NOSSAS INFRAESTRUTURAS -->
        <section class="infra-section">
            <div class="infra-inner">
                <div class="infra-card">
                    <h2>Nossas Infraestruturas</h2>
                    <div class="infra-line"></div>
                    <p>O IDHI dispõe de modernas instalações pedagógicas e laboratoriais que proporcionam um ambiente de aprendizagem de excelência, fomentando a inovação e o desenvolvimento humano.</p>
                    <a href="noticias.php" class="infra-btn">Saber mais &rarr;</a>
                </div>
                <div class="infra-images">
                    <div class="infra-carousel">
                        <div class="infra-track">
                            <img src="img/webp/DELEGACAO DE VILANKULO 800X800.webp" alt="Patio da Instituição" loading="lazy" decoding="async">
                            <img src="img/webp/LABORATORIO 800 X800  (2).webp" alt="Laboratório" loading="lazy" decoding="async">
                            <img src="img/webp/BIBLIOTECA 800 X 800.webp" alt="Biblioteca" loading="lazy" decoding="async">
                        </div>
                        <div class="infra-dots">
                            <button class="infra-dot active" data-idx="0"></button>
                            <button class="infra-dot" data-idx="1"></button>
                            <button class="infra-dot" data-idx="2"></button>
                        </div>
                        <div class="infra-nav">
                            <button class="infra-nav-btn infra-prev" aria-label="Anterior">&#8249;</button>
                            <button class="infra-nav-btn infra-next" aria-label="Seguinte">&#8250;</button>
                        </div>
                    </div>
                </div>
            </div>
        </section>

    </main>

    <!-- RODAPÉ -->
    <footer class="site-footer">

        <!-- CTA strip -->
        <div class="footer-cta">
            <div class="container footer-cta-inner">
                <div>
                    <p>Pronto para construir o seu futuro?</p>
                    <span>Inscreva-se hoje e faça parte da nossa comunidade académica.</span>
                </div>
                <a href="contacto.php" class="footer-cta-btn">Fale connosco</a>
            </div>
        </div>

        <div class="footer-top">
            <div class="container footer-grid">

                <div class="footer-col footer-brand">
                    <img src="img/webp/LOGO.webp" alt="IDHI Logo" class="footer-logo" loading="lazy">
                    <p class="footer-brand-name">IDHI</p>
                    <p>Instituto de Desenvolvimento Humano do Índico — formando profissionais comprometidos com o progresso e a dignidade humana em Moçambique.</p>
                </div>

                <div class="footer-col">
                    <h4>Navegação</h4>
                    <ul>
                        <li><a href="unidades.php">Unidades Orgânicas</a></li>
                        <li><a href="educacao.php">Educação</a></li>
                        <li><a href="certificacoes.php">Certificações</a></li>
                        <li><a href="idhi.php">IDHI</a></li>
                        <li><a href="noticias.php">Notícias</a></li>
                        <li><a href="sobre-nos.php">Sobre nós</a></li>
                        <li><a href="contacto.php">Contacto</a></li>
                    </ul>
                </div>

                <div class="footer-col">
                    <h4>Contactos</h4>
                    <ul class="footer-contact">
                        <li>
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            Beira | Manga-Chamba ao pé da Escola 25 de Setembro 
                        </li>
                        <li>
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12 19.79 19.79 0 0 1 1.61 3.18 2 2 0 0 1 3.61 1h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 8.6a16 16 0 0 0 6 6l.96-.96a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 21.5 16z"/></svg>
                            (+258)877663122  
                        </li>
                         <li>
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            Vilankulo Expansão | Rua de Esuder /Rua 240
                        </li>
                         <li>
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12 19.79 19.79 0 0 1 1.61 3.18 2 2 0 0 1 3.61 1h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 8.6a16 16 0 0 0 6 6l.96-.96a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 21.5 16z"/></svg>
                             +(258)876044387 
                        </li>
                        <li>
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
                            geral@idhi.ac.mz
                        </li>
                        <li>
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
                            Seg–Sex: 07h30–17h00
                        </li>
                    </ul>
                </div>

                <div class="footer-col">
                    <h4>Redes Sociais</h4>
                    <p style="font-size:13px;color:#475569;margin-bottom:14px;text-align:left;">Siga-nos e fique por dentro de todas as novidades do IDHI.</p>
                    <div class="footer-socials">
                        <a href="https://www.facebook.com/ipmbi" aria-label="Facebook">
                            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
                        </a>
                        <a href="https://www.instagram.com/ipmbi.beira" aria-label="Instagram">
                            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838a6.162 6.162 0 1 0 0 12.324 6.162 6.162 0 0 0 0-12.324zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.406-11.845a1.44 1.44 0 1 0 0 2.881 1.44 1.44 0 0 0 0-2.881z"/></svg>
                        </a>
                        <a href="#" aria-label="WhatsApp">
                            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413z"/></svg>
                        </a>
                        <a href="#" aria-label="YouTube">
                            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M22.54 6.42a2.78 2.78 0 0 0-1.95-1.96C18.88 4 12 4 12 4s-6.88 0-8.59.46A2.78 2.78 0 0 0 1.46 6.42 29 29 0 0 0 1 12a29 29 0 0 0 .46 5.58 2.78 2.78 0 0 0 1.95 1.96C5.12 20 12 20 12 20s6.88 0 8.59-.46a2.78 2.78 0 0 0 1.95-1.96A29 29 0 0 0 23 12a29 29 0 0 0-.46-5.58z"/><polygon points="9.75 15.02 15.5 12 9.75 8.98 9.75 15.02"/></svg>
                        </a>
                    </div>
                </div>

            </div>
        </div>

        <div class="footer-bottom">
            <div class="container footer-bottom-inner">
                <p>&copy; 2026 IDHI &mdash; Todos os direitos reservados. Criado Por SJ</p>
                <div class="footer-bottom-links">
                    <a href="sobre-nos.php">Sobre nós</a>
                    <a href="contacto.php">Contacto</a>
                    <a href="#">Política de Privacidade</a>
                </div>
            </div>
        </div>
    </footer>

    <script>
        const hamburger = document.getElementById('hamburger');
        const navbarNav = document.getElementById('navbarNav');
        const navbar = document.querySelector('.navbar');

        hamburger.addEventListener('click', () => {
            navbarNav.classList.toggle('active');
            hamburger.classList.toggle('active');
        });
        document.querySelectorAll('.nav-link').forEach(link => {
            link.addEventListener('click', () => {
                navbarNav.classList.remove('active');
                hamburger.classList.remove('active');
            });
        });

        window.addEventListener('scroll', () => {
            if (window.scrollY > 60) {
                navbar.classList.add('scrolled');
            } else {
                navbar.classList.remove('scrolled');
            }
        });

        // Add click handlers to thumb-item elements
        document.querySelectorAll('.thumb-item').forEach(thumbItem => {
            thumbItem.addEventListener('click', () => {
                window.location.href = 'inscricao.php';
            });
            // Add cursor pointer to show it's clickable
            thumbItem.style.cursor = 'pointer';
        });

        // Carrossel "Estudar no IDHI" — loop infinito
        (function () {
            var track    = document.querySelector('.sgs-track');
            var viewport = document.querySelector('.sgs-viewport');
            var originals = Array.from(document.querySelectorAll('.sgs-item'));
            var prevBtn  = document.querySelector('.sgs-arrow-left');
            var nextBtn  = document.querySelector('.sgs-arrow-right');
            if (!track || !viewport || originals.length === 0) return;

            var GAP      = 20;
            var total    = originals.length; // número de itens reais
            var idx      = 0;               // índice actual (sobre os originais)
            var isJumping = false;

            // Clonar todos os itens originais e anexar no fim da fita
            originals.forEach(function (item) {
                var clone = item.cloneNode(true);
                clone.setAttribute('aria-hidden', 'true');
                track.appendChild(clone);
            });

            var allItems = Array.from(track.querySelectorAll('.sgs-item'));

            function itemWidth() {
                return originals[0].offsetWidth;
            }

            function visible() {
                var vw = viewport.offsetWidth;
                var W  = itemWidth();
                return Math.max(1, Math.floor((vw + GAP) / (W + GAP)));
            }

            function goTo(i, animate) {
                var W = itemWidth();
                track.style.gap        = GAP + 'px';
                track.style.transition = animate ? 'transform 0.4s ease' : 'none';
                track.style.transform  = 'translateX(-' + i * (W + GAP) + 'px)';
            }

            // Quando a transição para o clone termina, salta silenciosamente
            // para o item original correspondente (sem animação)
            track.addEventListener('transitionend', function () {
                if (!isJumping) return;
                isJumping = false;
                goTo(idx, false);
            });

            function next() {
                idx++;
                if (idx >= total) {
                    // avança para o clone (idx continua a crescer)
                    isJumping = true;
                    goTo(idx, true);
                    idx = 0; // posição real para depois do transitionend
                } else {
                    goTo(idx, true);
                }
            }

            function prev() {
                if (idx <= 0) {
                    // salta silenciosamente para o clone do último e anima para trás
                    goTo(total, false);        // posiciona nos clones (sem animação)
                    idx = total - 1;
                    requestAnimationFrame(function () {
                        requestAnimationFrame(function () {
                            goTo(idx, true);   // agora anima para o último original
                        });
                    });
                } else {
                    idx--;
                    goTo(idx, true);
                }
            }

            var autoTimer;
            function resetAuto() {
                clearInterval(autoTimer);
                autoTimer = setInterval(next, 4000);
            }

            prevBtn.addEventListener('click', function () { prev(); resetAuto(); });
            nextBtn.addEventListener('click', function () { next(); resetAuto(); });

            window.addEventListener('resize', function () { goTo(idx, false); });
            goTo(idx, false);
            resetAuto();
        })();

        // Carrossel "Nossas Infraestruturas"
        (function () {
            var track   = document.querySelector('.infra-track');
            var dots    = Array.from(document.querySelectorAll('.infra-dot'));
            var prevBtn = document.querySelector('.infra-prev');
            var nextBtn = document.querySelector('.infra-next');
            if (!track || !prevBtn || !nextBtn) return;

            var imgs  = Array.from(track.querySelectorAll('img'));
            var total = imgs.length;
            var idx   = 0;
            var timer;

            function go(n) {
                idx = ((n % total) + total) % total;
                track.style.transform = 'translateX(-' + (idx * 100) + '%)';
                dots.forEach(function (d, i) {
                    d.classList.toggle('active', i === idx);
                });
            }

            prevBtn.addEventListener('click', function () { go(idx - 1); resetTimer(); });
            nextBtn.addEventListener('click', function () { go(idx + 1); resetTimer(); });
            dots.forEach(function (d) {
                d.addEventListener('click', function () { go(parseInt(d.dataset.idx)); resetTimer(); });
            });

            function resetTimer() {
                clearInterval(timer);
                timer = setInterval(function () { go(idx + 1); }, 5000);
            }
            resetTimer();
        })();

    </script>
</body>
</html>
