{% extends "_base.html" %} 
{% load static %}

    {% block title %}<title>TUPY in the Middle East | Exclusive Agent in Dubai</title>{% endblock %}

    {% block meta %}

    <meta name="description" content="Amini Building Materials Trading L.L.C in Dubai is the exclusive agent of TUPY S.A. for the Middle East, holding stock of galvanised and black malleable cast iron pipe fittings for building services, industrial piping and fire protection across the UAE, Iraq and the Gulf.">
    <meta property="og:type" content="website">
    <meta property="og:title" content="TUPY in the Middle East | Exclusive Agent in Dubai">
    <meta property="og:description" content="Amini Building Materials Trading L.L.C in Dubai is the exclusive agent of TUPY S.A. for the Middle East, holding stock of galvanised and black malleable cast iron pipe fittings for building services, industrial piping and fire protection across the UAE, Iraq and the Gulf.">
    <meta property="og:image" content="{{ request.scheme }}://{{ request.get_host }}{% static 'img/cover.png' %}">

        <script type="application/ld+json">
    { "@context": "https://schema.org", "@type": "BreadcrumbList",
      "itemListElement": [
        { "@type": "ListItem", "position": 1, "name": "Home", "item": "{{ request.scheme }}://{{ request.get_host }}/" },
        { "@type": "ListItem", "position": 2, "name": "Middle East" }
      ] }
    </script>

{% endblock %}

    {% block content %}

    <!-- Banner -->

    <section class="overflow-hidden my-10">
        <div class="container mx-auto">

            <div class="flex laptop:flex-col items-stretch min-h-[420px]">

                <!-- Image Side -->

                <div class="relative w-[45%] h-[100%] mt-10 laptop:w-full laptop:h-[100%] flex-shrink-0">
                    <img
                    src="{% static 'img/middle-east-banner.svg' %}"
                    alt="TUPY pipe fittings supplied across the Middle East from Dubai"
                    class="w-full h-full object-cover block"
                    />
                    
                </div>

                <!-- Text Side -->

                <div
                    class="w-[55%] laptop:w-full py-[50px] pl-20 laptop:px-5 laptop:py-7 mobile:px-4 mobile:py-6 flex flex-col justify-center items-start"
                >
                    <h1 class="font-YekanExtraBold text-[#6ecff6] text-[clamp(42px,5vw,70px)] leading-tight mb-6 laptop:mb-4 mobile:text-[28px]">
                        TUPY Fittings in the Middle East
                    </h1>
                    <h3 class="font-YekanRegular text-[#6ecff6] text-2xl mobile:text-[18px] leading-[2] text-justify">
                        Made in Brazil. Stocked in Dubai.
                    </h3>
                    <p class="font-YekanRegular text-[#c8d8ea] text-[clamp(15px,1.4vw,20px)] mobile:text-[14px] leading-[2] text-justify">
                        TUPY S.A. of Brazil manufactures malleable and ductile cast iron pipe fittings to international standards. Amini Building Materials Trading L.L.C, based in Dubai, is the exclusive agent of TUPY S.A. for the Middle East. Stock is held in Dubai and supplied across the United Arab Emirates, Iraq and the wider Gulf: BSP threaded fittings, NPT Class 150 and 300, and the TUPYPRES press system, galvanised and black, for building services, industrial piping and fire protection.
                    </p>
                </div>

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

    <!-- Quality -->
     
    <section class="tablet:py-8 mobile:py-6 overflow-hidden my-6">
        <div class="container mx-auto laptop:px-8 mobile:px-4 max-w-[1400px]">

            <div class="flex flex-row laptop:flex-col items-center justify-between gap-14 desktop:gap-10 tablet:gap-6 mobile:gap-4">

                <!-- Text -->

                <div class="w-full laptop:w-full laptop:h-auto flex flex-col justify-start gap-4 tablet:gap-3 mobile:gap-2">

                    <div class="flex items-center justify-start gap-3 mobile:gap-1.5">
                        <img 
                            src="{% static 'img/iran/namayeshgah.png' %}" 
                            alt="Exhibitions icon" 
                            class="w-12 h-12 laptop:w-10 laptop:h-10 tablet:w-7 tablet:h-7 mobile:w-9 mobile:h-9 object-contain" 
                        />
                        <h2 class="font-YekanExtraBold text-[#6ecff6] text-[30px] laptop:text-[20px] mobile:text-[20px]">
                            Exhibitions
                        </h2>
                    </div>

                    <h3 class="font-YekanMedium text-[#6ecff6] text-[24px] mt-5 mobile:mt-2 mobile:text-[13px] laptop:text-[20px]">
                        Big 5 Global, Dubai
                    </h3>

                    <p class="font-YekanRegular text-white text-[27px] 2xl:text-[22px] desktop:text-[18px] laptop:text-[16px] tablet:text-[12px] mobile:text-[13px] leading-[2.4] tablet:leading-[2] mobile:leading-[1.8] text-justify">
                        We exhibited at Big 5 Global in Dubai, one of the largest construction industry events in the world, and showed the TUPY range: BSP threaded fittings, NPT class fittings and the TUPYPRES press system. The show is a direct route to the contractors, wholesalers and project engineers who buy fittings across the Gulf, and to the international partners TUPY works with.
                    </p>
                </div>

                <!-- Image -->

                <div class="w-[30%] laptop:w-full h-[480px] 3xl:h-[550px] desktop:w-[35%] desktop:h-[400px] laptop:h-auto flex justify-end laptop:justify-center items-center laptop:items-center mobile:mt-2">
                    <img
                        src="{% static 'img/iran/iran2.jpg' %}"
                        alt="TUPY stand at Big 5 Global in Dubai"
                        class="border-4 border-[#6ecff6] rounded-2xl w-full max-w-[550px] laptop:max-w-[400px] tablet:max-w-[300px] mobile:max-w-full object-contain drop-shadow-2xl"
                    />
                </div>

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

    <section class="tablet:py-8 mobile:py-6 overflow-hidden my-6">
        <div class="container mx-auto laptop:px-8 mobile:px-4 max-w-[1400px]">

            <div class="flex flex-row laptop:flex-col items-center justify-between gap-14 desktop:gap-10 tablet:gap-6 mobile:gap-4">

                <!-- Text -->

                <div class="w-[60%] laptop:w-full h-[480px] 3xl:h-[550px] desktop:h-[400px] laptop:h-auto flex flex-col justify-start gap-4 tablet:gap-3 mobile:gap-2">

                    <h3 class="font-YekanMedium text-[#6ecff6] text-[24px] mt-5 mobile:mt-2 mobile:text-[13px] laptop:text-[20px]">
                        International exhibition, Baghdad, Iraq
                    </h3>

                    <p class="font-YekanRegular text-white text-[27px] 2xl:text-[22px] desktop:text-[18px] laptop:text-[16px] tablet:text-[12px] mobile:text-[13px] leading-[2.4] tablet:leading-[2] mobile:leading-[1.8] text-justify">
                        We exhibited at a specialist industrial trade show in Baghdad and presented the TUPY fitting range, including BSP threaded fittings and NPT Class 300 fittings built for demanding service conditions and industrial duty. Iraq is one of the main markets supplied from our Dubai stock, and the show is where we meet the distributors, fabricators and contractors working there.
                    </p>
                </div>

                <!-- Image -->
                <div class="w-[30%] laptop:w-full h-[480px] 3xl:h-[550px] desktop:w-[35%] desktop:h-[400px] laptop:h-auto flex justify-end laptop:justify-center items-center laptop:items-center mobile:mt-2">
                    <img
                        src="{% static 'img/iran/iran1.jpg' %}"
                        alt="TUPY stand at an international exhibition in Baghdad, Iraq"
                        class="border-4 border-[#6ecff6] rounded-2xl w-full max-w-[550px] laptop:max-w-[400px] tablet:max-w-[300px] mobile:max-w-full object-contain drop-shadow-2xl"
                    />
                </div>

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

    <section class="tablet:py-8 mobile:py-6 overflow-hidden my-6">
        <div class="container mx-auto laptop:px-8 mobile:px-4 max-w-[1400px]">

            <div class="flex flex-row laptop:flex-col items-center justify-between gap-14 desktop:gap-10 tablet:gap-6 mobile:gap-4">

                <!-- Text -->

                <div class="w-[60%] laptop:w-full h-[480px] 3xl:h-[550px] desktop:h-[400px] laptop:h-auto flex flex-col justify-start gap-4 tablet:gap-3 mobile:gap-2">

                    <h3 class="font-YekanMedium text-[#6ecff6] text-[24px] mt-5 mobile:mt-2 mobile:text-[13px] laptop:text-[20px]">
                        Building industry exhibitions across the region
                    </h3>

                    <p class="font-YekanRegular text-white text-[27px] 2xl:text-[22px] desktop:text-[18px] laptop:text-[16px] tablet:text-[12px] mobile:text-[13px] leading-[2.4] tablet:leading-[2] mobile:leading-[1.8] text-justify">
                        TUPY fittings are shown at building and industrial trade exhibitions around the region, where the BSP range and the TUPYPRES press system can be handled and inspected in person: the thread form, the galvanised finish, the casting quality and the markings that identify a genuine TUPY fitting. These events are also where most new distributors and project buyers first meet our Dubai team.
                    </p>
                </div>

                {# The Persian site used img/iran/iran3.jpg here - a stand at an
                   Iranian fair, with Persian signage on the wall. There is no
                   regional photo to put in its place yet, so the column is left
                   out rather than showing Tehran on the Middle East page.
                   Drop a photo in and restore this block. #}

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

    <!-- Projects -->

    {# The Persian site listed 20 Tehran projects here. Those are the Iranian
       business's references and do not belong on the Middle East site, so the
       rows were removed. Add Gulf and Iraq project references in the admin
       under Projects and this section reappears on its own. #}
    {% if projects %}
    <section class="py-10 mobile:py-7 overflow-hidden">
        <div class="container mx-auto px-6 mobile:px-4">

            <!-- Titles -->
            <div class="flex items-center justify-start gap-3 mb-12 mobile:mb-6">
                <img src="{% static 'img/about/icons/projects.png' %}" alt="Projects built with TUPY pipe fittings" class="w-9 h-12 mobile:w-8 mobile:h-8" />
                <h2 class="font-YekanExtraBold text-[#6ecff6] text-[30px] laptop:text-[20px] mobile:text-[17px]">
                    From Brazil to projects across the Middle East
                </h2>
            </div>

            <!-- Slider -->

            <div class="relative">
                <div id="projectsSlider" class="overflow-hidden">
                    <div id="projectsTrack" class="flex transition-transform duration-500 ease-in-out">

                        {% for project in projects %}

                        <div class="project-card flex-shrink-0 px-2">
                            <div class="rounded-2xl overflow-hidden aspect-[4/3] border border-[#1e3a5f] mb-3">
                                <img src="{{ project.image.url }}" alt="{{ project.title }} — built with TUPY pipe fittings" class="w-full h-full object-cover pointer-events-none" />
                            </div>
                            <p class="font-YekanRegular text-white text-[13px] text-center"> {{ project.title }} </p>
                        </div>

                        {% endfor %}

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

        </div>
    </section>
    {% endif %}

    {% endblock content %}


    {% block js %}
    
    <script src="{% static 'js/iran.js' %}"></script>

    {% endblock %}