@extends('layouts.app')

@section('content')

<!-- Hero Section -->
<div class="bg-white p-6 rounded-xl shadow mb-6 flex justify-between items-center">

    <div>
        <h2 class="text-3xl font-bold">
            Alt du trenger,<br>
            <span class="text-blue-600">samlet på ett sted</span>
        </h2>

        <p class="text-gray-500 mt-2">
            Lag profesjonelle rapporter...
        </p>

        <button class="mt-4 bg-blue-600 text-white px-4 py-2 rounded">
            Kom i gang
        </button>
    </div>

    <img src="{{ asset('images/logo.png') }}" class="w-40">

</div>

<!-- Cards -->
<!--
<div class="grid grid-cols-3 gap-6">

    <div class="bg-white p-4 rounded shadow">
        <h3 class="font-bold">BMTF</h3>
        <p class="text-gray-500">Info og verktøy</p>
    </div>

    <div class="bg-white p-4 rounded shadow">
        <h3 class="font-bold">Finn Takstmann</h3>
        <p class="text-gray-500">Finn eksperter</p>
    </div>

    <div class="bg-white p-4 rounded shadow">
        <h3 class="font-bold">Mesterskolen</h3>
        <p class="text-gray-500">Kurs</p>
    </div>

</div>
-->



<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
    
    <!-- Card -->
    <a href="#" class="flex items-center justify-between p-6 bg-white rounded-2xl shadow-sm hover:shadow-md transition">
        
        <!-- Left -->
        <div class="flex items-center gap-4">
            
            <!-- Icon circle -->
            <div class="w-14 h-14 flex items-center justify-center rounded-full bg-blue-100">
                <!-- Icon -->
                <svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                        d="M5.121 17.804A9 9 0 1118.879 17.804M15 11a3 3 0 11-6 0 3 3 0 016 0z"/>
                </svg>
            </div>

            <!-- Text -->
            <div>
                <h3 class="font-semibold text-lg">BMTF</h3>
                <p class="text-gray-500 text-sm">
                    Norges eldste takseringsforbund
                </p>
            </div>
        </div>

        <!-- Arrow -->
        <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                d="M9 5l7 7-7 7"/>
        </svg>

    </a>
    
    
    <!-- Card -->
    <a href="#" class="flex items-center justify-between p-6 bg-white rounded-2xl shadow-sm hover:shadow-md transition">
        
        <!-- Left -->
        <div class="flex items-center gap-4">
            
            <!-- Icon circle -->
            <div class="w-14 h-14 flex items-center justify-center rounded-full bg-blue-100">
                <!-- Icon -->
                <svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                        d="M5.121 17.804A9 9 0 1118.879 17.804M15 11a3 3 0 11-6 0 3 3 0 016 0z"/>
                </svg>
            </div>

            <!-- Text -->
            <div>
                <h3 class="font-semibold text-lg">Finn Takstmann</h3>
                <p class="text-gray-500 text-sm">
                    Finn ut hvem din nærmeste takstmann er!
                </p>
            </div>
        </div>

        <!-- Arrow -->
        <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                d="M9 5l7 7-7 7"/>
        </svg>

    </a>
    
    
    <!-- Card -->
    <a href="#" class="flex items-center justify-between p-6 bg-white rounded-2xl shadow-sm hover:shadow-md transition">
        
        <!-- Left -->
        <div class="flex items-center gap-4">
            
            <!-- Icon circle -->
            <div class="w-14 h-14 flex items-center justify-center rounded-full bg-blue-100">
                <!-- Icon -->
                <svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                        d="M5.121 17.804A9 9 0 1118.879 17.804M15 11a3 3 0 11-6 0 3 3 0 016 0z"/>
                </svg>
            </div>

            <!-- Text -->
            <div>
                <h3 class="font-semibold text-lg">Metroskolen</h3>
                <p class="text-gray-500 text-sm">
                    Norges største skole for takstmann-utdanning.
                </p>
            </div>
        </div>

        <!-- Arrow -->
        <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                d="M9 5l7 7-7 7"/>
        </svg>

    </a>

</div>

<br>
<!-- row 2 -->

<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
    
    <!-- Card -->
    <a href="#" class="flex items-center justify-between p-6 bg-white rounded-2xl shadow-sm hover:shadow-md transition">
        
        <!-- Left -->
        <div class="flex items-center gap-4">
            
            <!-- Icon circle -->
            <div class="w-14 h-14 flex items-center justify-center rounded-full bg-blue-100">
                <!-- Icon -->
                <svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                        d="M5.121 17.804A9 9 0 1118.879 17.804M15 11a3 3 0 11-6 0 3 3 0 016 0z"/>
                </svg>
            </div>

            <!-- Text -->
            <div>
                <h3 class="font-semibold text-lg">Eierskifterapport</h3>
                <p class="text-gray-500 text-sm">
                    For deg som planlegger å selge din bolig.
                </p>
            </div>
        </div>

        <!-- Arrow -->
        <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                d="M9 5l7 7-7 7"/>
        </svg>

    </a>
    
    
    <!-- Card -->
    <a href="#" class="flex items-center justify-between p-6 bg-white rounded-2xl shadow-sm hover:shadow-md transition">
        
        <!-- Left -->
        <div class="flex items-center gap-4">
            
            <!-- Icon circle -->
            <div class="w-14 h-14 flex items-center justify-center rounded-full bg-blue-100">
                <!-- Icon -->
                <svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                        d="M5.121 17.804A9 9 0 1118.879 17.804M15 11a3 3 0 11-6 0 3 3 0 016 0z"/>
                </svg>
            </div>

            <!-- Text -->
            <div>
                <h3 class="font-semibold text-lg">AutoCAD LT KURS</h3>
                <p class="text-gray-500 text-sm">
                    Autocad LT kurs
                </p>
            </div>
        </div>

        <!-- Arrow -->
        <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                d="M9 5l7 7-7 7"/>
        </svg>

    </a>
    
    
    

</div>


@endsection