Tamazirt Surf | Ocean Blue Slider \u2013 Book Surf Lessons<\/title>\r\n <style>\r\n \/* minimal global reset for seamless embedding \u2013 design untouched except colors & content *\/\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n body {\r\n background: #f2f7ff;\r\n font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;\r\n }\r\n \/* ensure slider container fills width and looks perfect *\/\r\n #tamazirt-surf-slider {\r\n width: 100%;\r\n position: relative;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n \r\n <div id=\"tamazirt-surf-slider\"><\/div>\r\n\r\n <script>\r\n (function() {\r\n const mountPoint = document.getElementById('tamazirt-surf-slider');\r\n if (!mountPoint) return;\r\n const shadowRoot = mountPoint.attachShadow({ mode: 'open' });\r\n\r\n \/\/ \u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014 SLIDER HTML + STYLES (original design preserved, colors changed to BLUE, all accents blue, no orange) \u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\r\n shadowRoot.innerHTML = `\r\n <style>\r\n :host {\r\n \/* === FULL BLUE PALETTE === vibrant ocean, surf energy, no orange at all *\/\r\n --primary: #0A66C2; \/* strong surf blue (main cta, accents) *\/\r\n --secondary: #4A9EFF; \/* lighter wave blue (highlights, span text) *\/\r\n --accent-deep: #004e92; \/* deep ocean for subtle hover states *\/\r\n --light-bg: #eef6fe;\r\n --dark: #0b2b44;\r\n --white: #ffffff;\r\n --transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n }\r\n \r\n .myt-slider-container {\r\n position: relative;\r\n width: 100%;\r\n height: 680px;\r\n overflow: hidden;\r\n font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;\r\n background: #000; \/* fallback *\/\r\n }\r\n \r\n .myt-slider-wrapper {\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n \r\n .myt-slide {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n opacity: 0;\r\n transform: translateX(100%);\r\n transition: var(--transition);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n overflow: hidden;\r\n }\r\n \r\n .myt-slide.active {\r\n opacity: 1;\r\n transform: translateX(0);\r\n z-index: 1;\r\n }\r\n \r\n .myt-slide.prev {\r\n transform: translateX(-100%);\r\n opacity: 0;\r\n }\r\n \r\n .myt-slide-image {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n filter: brightness(0.75) contrast(1.05);\r\n }\r\n \r\n .myt-slide-content {\r\n position: relative;\r\n z-index: 2;\r\n max-width: 1200px;\r\n width: 90%;\r\n padding: 40px;\r\n color: var(--white);\r\n text-align: center;\r\n }\r\n \r\n .myt-slide-badge {\r\n display: inline-block;\r\n background: rgba(10, 102, 194, 0.25);\r\n backdrop-filter: blur(12px);\r\n -webkit-backdrop-filter: blur(12px);\r\n padding: 10px 24px;\r\n border-radius: 40px;\r\n font-size: 14px;\r\n font-weight: 700;\r\n letter-spacing: 1.2px;\r\n text-transform: uppercase;\r\n margin-bottom: 25px;\r\n border: 1px solid rgba(255, 255, 255, 0.4);\r\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\r\n }\r\n \r\n .myt-slide-title {\r\n font-size: 56px;\r\n font-weight: 800;\r\n line-height: 1.1;\r\n margin: 0 0 20px 0;\r\n text-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);\r\n }\r\n \r\n .myt-slide-title span {\r\n color: var(--secondary); \/* lighter blue accent *\/\r\n }\r\n \r\n .myt-slide-desc {\r\n font-size: 20px;\r\n line-height: 1.6;\r\n max-width: 700px;\r\n margin: 0 auto 35px;\r\n opacity: 0.96;\r\n text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);\r\n font-weight: 500;\r\n }\r\n \r\n \/* BUTTONS \u2013 PURE BLUE STYLE (same design, blue instead of orange) *\/\r\n .myt-slide-cta {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 12px;\r\n background: var(--primary);\r\n color: var(--white);\r\n padding: 16px 38px;\r\n border-radius: 60px;\r\n font-size: 18px;\r\n font-weight: 700;\r\n text-decoration: none;\r\n transition: var(--transition);\r\n border: 2px solid transparent;\r\n box-shadow: 0 12px 28px rgba(10, 102, 194, 0.4);\r\n letter-spacing: 0.3px;\r\n cursor: pointer;\r\n }\r\n \r\n .myt-slide-cta:hover {\r\n background: var(--white);\r\n color: var(--primary);\r\n transform: translateY(-4px);\r\n box-shadow: 0 18px 32px rgba(10, 102, 194, 0.5);\r\n border-color: rgba(10, 102, 194, 0.2);\r\n }\r\n \r\n .myt-slide-cta svg {\r\n width: 20px;\r\n height: 20px;\r\n stroke: currentColor;\r\n transition: var(--transition);\r\n }\r\n \r\n .myt-slide-cta:hover svg {\r\n transform: translateX(6px);\r\n }\r\n \r\n \/* Navigation arrows (glassmorphic white, unchanged elegant style) *\/\r\n .myt-slider-nav {\r\n position: absolute;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n width: 56px;\r\n height: 56px;\r\n background: rgba(255, 255, 255, 0.18);\r\n backdrop-filter: blur(12px);\r\n -webkit-backdrop-filter: blur(12px);\r\n border: 1px solid rgba(255, 255, 255, 0.35);\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n cursor: pointer;\r\n transition: var(--transition);\r\n z-index: 10;\r\n outline: none;\r\n }\r\n \r\n .myt-slider-nav:hover {\r\n background: rgba(255, 255, 255, 0.35);\r\n transform: translateY(-50%) scale(1.08);\r\n }\r\n \r\n .myt-slider-nav.prev {\r\n left: 30px;\r\n }\r\n \r\n .myt-slider-nav.next {\r\n right: 30px;\r\n }\r\n \r\n .myt-slider-nav svg {\r\n width: 26px;\r\n height: 26px;\r\n stroke: var(--white);\r\n stroke-width: 2.2;\r\n }\r\n \r\n .myt-slider-dots {\r\n position: absolute;\r\n bottom: 40px;\r\n left: 0;\r\n right: 0;\r\n display: flex;\r\n justify-content: center;\r\n gap: 14px;\r\n z-index: 10;\r\n }\r\n \r\n .myt-slider-dot {\r\n width: 11px;\r\n height: 11px;\r\n background: rgba(255, 255, 255, 0.5);\r\n border-radius: 50%;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n border: none;\r\n padding: 0;\r\n }\r\n \r\n .myt-slider-dot.active {\r\n background: var(--white);\r\n transform: scale(1.2);\r\n width: 12px;\r\n height: 12px;\r\n background: #ffffff;\r\n box-shadow: 0 0 8px rgba(255,255,255,0.8);\r\n }\r\n \r\n \/* responsive (same breakpoints, untouched) *\/\r\n @media (max-width: 1024px) {\r\n .myt-slider-container { height: 560px; }\r\n .myt-slide-title { font-size: 46px; }\r\n .myt-slide-desc { font-size: 18px; }\r\n .myt-slider-nav { width: 50px; height: 50px; }\r\n .myt-slider-nav.prev { left: 20px; }\r\n .myt-slider-nav.next { right: 20px; }\r\n .myt-slider-nav svg { width: 22px; height: 22px; }\r\n }\r\n \r\n @media (max-width: 768px) {\r\n .myt-slider-container { height: 500px; }\r\n .myt-slide-content { padding: 30px 25px; }\r\n .myt-slide-title { font-size: 36px; }\r\n .myt-slide-desc { font-size: 17px; margin-bottom: 30px; }\r\n .myt-slide-cta { padding: 14px 28px; font-size: 16px; gap: 8px; }\r\n .myt-slider-nav { width: 44px; height: 44px; display: none; }\r\n .myt-slider-dots { bottom: 30px; gap: 10px; }\r\n }\r\n \r\n @media (max-width: 480px) {\r\n .myt-slider-container { height: 440px; }\r\n .myt-slide-content { padding: 25px 20px; }\r\n .myt-slide-title { font-size: 30px; margin-bottom: 15px; }\r\n .myt-slide-desc { font-size: 15px; margin-bottom: 25px; }\r\n .myt-slide-badge { padding: 7px 18px; font-size: 11px; margin-bottom: 15px; }\r\n .myt-slide-cta { padding: 12px 24px; font-size: 15px; gap: 8px; }\r\n .myt-slider-dots { bottom: 25px; gap: 8px; }\r\n .myt-slider-dot { width: 8px; height: 8px; }\r\n .myt-slider-dot.active { width: 9px; height: 9px; }\r\n }\r\n \r\n @media (max-width: 360px) {\r\n .myt-slider-container { height: 400px; }\r\n .myt-slide-title { font-size: 26px; }\r\n .myt-slide-desc { font-size: 14px; }\r\n .myt-slide-cta { padding: 10px 20px; font-size: 14px; }\r\n }\r\n <\/style>\r\n\r\n <div class=\"myt-slider-container\" aria-label=\"Tamazirt Surf Shop \u2013 Surf adventures slider\">\r\n <div class=\"myt-slider-wrapper\">\r\n \r\n \r\n <div class=\"myt-slide active\" data-slide=\"1\">\r\n <img decoding=\"async\" class=\"myt-slide-image\" \r\n src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.12-1.jpeg\"\r\n alt=\"Surf session with Tamazirt Surf School \u2013 wave riding\">\r\n <div class=\"myt-slide-content\">\r\n <div class=\"myt-slide-badge\">\ud83c\udfc4\u200d\u2642\ufe0f Tamazirt Surf Shop School<\/div>\r\n <h1 class=\"myt-slide-title\">Ride the <span>Atlantic Waves<\/span><\/h1>\r\n <p class=\"myt-slide-desc\">\r\n Experience authentic Moroccan surf culture. Professional coaching, premium gear, and the best lineups in Tamraght & Taghazout.\r\n <\/p>\r\n <a href=\"#\" class=\"myt-slide-cta\" id=\"surf-cta-1\">\r\n Let\u2019s Go Surfing!\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M14 5l7 7-7 7\"\/>\r\n <\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <div class=\"myt-slide\" data-slide=\"2\">\r\n <img decoding=\"async\" class=\"myt-slide-image\" \r\n src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.11-1.jpeg\"\r\n alt=\"Surfboards and golden hour at Tamazirt Surf School\">\r\n <div class=\"myt-slide-content\">\r\n <div class=\"myt-slide-badge\">\ud83c\udfc4\u200d\u2640\ufe0f Lessons & Rentals<\/div>\r\n <h1 class=\"myt-slide-title\">Catch Your <span>First Wave<\/span><\/h1>\r\n <p class=\"myt-slide-desc\">\r\n Beginners to pros: daily surf lessons, board rental, and unforgettable group camps. Safe, fun, and all levels welcome.\r\n <\/p>\r\n <a href=\"#\" class=\"myt-slide-cta\" id=\"surf-cta-2\">\r\n Let\u2019s Go Surfing!\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M14 5l7 7-7 7\"\/>\r\n <\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <div class=\"myt-slide\" data-slide=\"3\">\r\n <img decoding=\"async\" class=\"myt-slide-image\" \r\n src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.11.jpeg\"\r\n alt=\"Tamazirt Surf community and ocean view\">\r\n <div class=\"myt-slide-content\">\r\n <div class=\"myt-slide-badge\">\ud83c\udf0a Tamazirt Vibe<\/div>\r\n <h1 class=\"myt-slide-title\">Surf, Explore, <span>Repeat<\/span><\/h1>\r\n <p class=\"myt-slide-desc\">\r\n Join our surf shop & school for epic adventures, yoga sessions, and Berber hospitality. Your Moroccan surf journey starts now.\r\n <\/p>\r\n <a href=\"#\" class=\"myt-slide-cta\" id=\"surf-cta-3\">\r\n Let\u2019s Go Surfing!\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M14 5l7 7-7 7\"\/>\r\n <\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <button class=\"myt-slider-nav prev\" aria-label=\"Previous slide\">\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 19l-7-7 7-7\"\/>\r\n <\/svg>\r\n <\/button>\r\n <button class=\"myt-slider-nav next\" aria-label=\"Next slide\">\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"\/>\r\n <\/svg>\r\n <\/button>\r\n \r\n \r\n <div class=\"myt-slider-dots\">\r\n <div class=\"myt-slider-dot active\" data-slide=\"1\" aria-label=\"Go to slide 1\"><\/div>\r\n <div class=\"myt-slider-dot\" data-slide=\"2\" aria-label=\"Go to slide 2\"><\/div>\r\n <div class=\"myt-slider-dot\" data-slide=\"3\" aria-label=\"Go to slide 3\"><\/div>\r\n <\/div>\r\n <\/div>\r\n `;\r\n\r\n \/\/ ==================== SLIDER LOGIC (fully functional with smooth auto-play) ====================\r\n setTimeout(() => {\r\n const container = shadowRoot.querySelector('.myt-slider-container');\r\n const slides = shadowRoot.querySelectorAll('.myt-slide');\r\n const dots = shadowRoot.querySelectorAll('.myt-slider-dot');\r\n const prevBtn = shadowRoot.querySelector('.myt-slider-nav.prev');\r\n const nextBtn = shadowRoot.querySelector('.myt-slider-nav.next');\r\n \r\n let currentIdx = 0;\r\n let autoInterval;\r\n const total = slides.length;\r\n \r\n \/\/ helper: update active classes and dots\r\n function updateSliderUI() {\r\n slides.forEach((slide, i) => {\r\n slide.classList.remove('active', 'prev');\r\n if (i === currentIdx) {\r\n slide.classList.add('active');\r\n } else if (i === (currentIdx - 1 + total) % total) {\r\n slide.classList.add('prev');\r\n }\r\n });\r\n dots.forEach((dot, i) => {\r\n dot.classList.remove('active');\r\n if (i === currentIdx) dot.classList.add('active');\r\n });\r\n }\r\n \r\n function goToSlide(index) {\r\n currentIdx = (index + total) % total;\r\n updateSliderUI();\r\n resetAutoPlay();\r\n }\r\n \r\n function nextSlide() {\r\n currentIdx = (currentIdx + 1) % total;\r\n updateSliderUI();\r\n resetAutoPlay();\r\n }\r\n \r\n function prevSlide() {\r\n currentIdx = (currentIdx - 1 + total) % total;\r\n updateSliderUI();\r\n resetAutoPlay();\r\n }\r\n \r\n function startAutoPlay() {\r\n if (autoInterval) clearInterval(autoInterval);\r\n autoInterval = setInterval(() => {\r\n nextSlide();\r\n }, 6000);\r\n }\r\n \r\n function stopAutoPlay() {\r\n if (autoInterval) {\r\n clearInterval(autoInterval);\r\n autoInterval = null;\r\n }\r\n }\r\n \r\n function resetAutoPlay() {\r\n stopAutoPlay();\r\n startAutoPlay();\r\n }\r\n \r\n \/\/ attach event listeners for navigation\r\n if (prevBtn) prevBtn.addEventListener('click', (e) => {\r\n e.preventDefault();\r\n prevSlide();\r\n });\r\n if (nextBtn) nextBtn.addEventListener('click', (e) => {\r\n e.preventDefault();\r\n nextSlide();\r\n });\r\n \r\n dots.forEach(dot => {\r\n dot.addEventListener('click', () => {\r\n const slideNum = parseInt(dot.getAttribute('data-slide'), 10);\r\n if (!isNaN(slideNum)) goToSlide(slideNum - 1);\r\n });\r\n });\r\n \r\n \/\/ hover pause \/ resume\r\n if (container) {\r\n container.addEventListener('mouseenter', () => stopAutoPlay());\r\n container.addEventListener('mouseleave', () => startAutoPlay());\r\n \r\n \/\/ touch swipe (mobile)\r\n let touchStart = 0;\r\n let touchEnd = 0;\r\n container.addEventListener('touchstart', (e) => {\r\n touchStart = e.changedTouches[0].screenX;\r\n stopAutoPlay();\r\n }, { passive: true });\r\n container.addEventListener('touchend', (e) => {\r\n touchEnd = e.changedTouches[0].screenX;\r\n const diff = touchStart - touchEnd;\r\n if (Math.abs(diff) > 50) {\r\n if (diff > 0) nextSlide();\r\n else prevSlide();\r\n }\r\n startAutoPlay();\r\n });\r\n }\r\n \r\n \/\/ ========== UPDATE BUTTONS: open the specific link in the same page, no message, no confirmation ==========\r\n \/\/ Target link: https:\/\/tamazirtsurfshopschool.com\/surf-lessons-in-taghazout\/\r\n const targetBookingUrl = \"https:\/\/tamazirtsurfshopschool.com\/surf-lessons-in-taghazout\/\";\r\n \r\n \/\/ Select all CTA buttons inside shadow DOM and attach click handler that redirects without any popup\/message\r\n const allCtas = shadowRoot.querySelectorAll('.myt-slide-cta');\r\n allCtas.forEach(btn => {\r\n \/\/ Remove any existing inline click handlers if any, to avoid conflicts\r\n btn.removeEventListener('click', () => {});\r\n \/\/ Attach new click event\r\n btn.addEventListener('click', (e) => {\r\n e.preventDefault();\r\n \/\/ Open the exact same link in the same tab\/page (no confirm, no alert)\r\n window.location.href = targetBookingUrl;\r\n });\r\n });\r\n \r\n \/\/ Also, ensure that if the buttons are clicked via any bubbling, it still works.\r\n \/\/ (extra safety)\r\n const styleWrapper = shadowRoot.querySelector('.myt-slider-container');\r\n if (styleWrapper) {\r\n styleWrapper.addEventListener('click', (e) => {\r\n const cta = e.target.closest('.myt-slide-cta');\r\n if (cta) {\r\n e.preventDefault();\r\n window.location.href = targetBookingUrl;\r\n }\r\n });\r\n }\r\n \r\n \/\/ initialization\r\n updateSliderUI();\r\n startAutoPlay();\r\n }, 80);\r\n })();\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-15e8a7d e-con-full e-flex e-con e-parent\" data-id=\"15e8a7d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b484190 elementor-widget elementor-widget-html\" data-id=\"b484190\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Tamazirt Surf Shop School \u00b7 Surf Lessons & Premium Gear<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* ALL CLASSES RENAMED WITH UNIQUE PREFIX \"tss-\" TO AVOID CONFLICTS *\/\r\n \/* MAIN COLOR: OCEAN BLUE (#0a5c7a, #1e6b8f, #0a2f44) with orange accent (#E07A2C) *\/\r\n .tss-section {\r\n width: 100%;\r\n min-height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 1rem 1rem 2rem;\r\n background: #e8f0f5; \/* soft light blue background - ocean inspired *\/\r\n font-family: 'Poppins', sans-serif;\r\n color: #2b2b2b;\r\n box-sizing: border-box;\r\n }\r\n\r\n .tss-container {\r\n width: 100%;\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n align-items: center;\r\n gap: clamp(1.5rem, 4vw, 5rem);\r\n }\r\n\r\n \/* ===== LEFT VISUAL ===== *\/\r\n .tss-visual {\r\n position: relative;\r\n width: 100%;\r\n aspect-ratio: 1 \/ 1.1;\r\n max-width: 600px;\r\n margin: 0 auto;\r\n }\r\n\r\n .tss-main-photo {\r\n position: absolute;\r\n left: 25%;\r\n top: 6%;\r\n width: 58%;\r\n height: 64%;\r\n border-radius: 42% 42% 34% 34% \/ 20% 20% 22% 22%;\r\n background: #cbdde6;\r\n overflow: hidden;\r\n box-shadow: 0 20px 40px rgba(10, 92, 122, 0.35);\r\n z-index: 3;\r\n }\r\n\r\n .tss-main-photo img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n }\r\n\r\n .tss-small-photo {\r\n position: absolute;\r\n left: 3%;\r\n bottom: 16%;\r\n width: 42%;\r\n max-width: 240px;\r\n aspect-ratio: 1\/1;\r\n border-radius: 50%;\r\n border: 6px solid #fff;\r\n background: #cbdde6;\r\n overflow: hidden;\r\n box-shadow: 0 16px 40px rgba(10, 92, 122, 0.4);\r\n z-index: 4;\r\n }\r\n\r\n .tss-small-photo img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n }\r\n\r\n .tss-stat-card {\r\n position: absolute;\r\n left: 0;\r\n top: 18%;\r\n width: auto;\r\n min-width: 170px;\r\n background: #ffffff;\r\n border-radius: 0 0 24px 24px;\r\n padding: 0.7rem 1.2rem 0.7rem 1rem;\r\n box-shadow: 0 20px 38px rgba(10, 92, 122, 0.25);\r\n z-index: 5;\r\n display: flex;\r\n align-items: center;\r\n gap: 0.7rem;\r\n white-space: nowrap;\r\n }\r\n\r\n .tss-stat-icon {\r\n width: 2.2rem;\r\n height: 2.2rem;\r\n border-radius: 12px;\r\n background: #1e6b8f; \/* ocean blue instead of orange *\/\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n }\r\n\r\n .tss-stat-icon svg {\r\n width: 20px;\r\n height: 20px;\r\n fill: white;\r\n stroke: white;\r\n }\r\n\r\n .tss-stat-text-wrapper {\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n\r\n .tss-stat-number {\r\n font-size: 1.2rem;\r\n font-weight: 800;\r\n color: #1e6b8f; \/* ocean blue *\/\r\n line-height: 1.2;\r\n }\r\n\r\n .tss-stat-text {\r\n font-size: 0.7rem;\r\n font-weight: 600;\r\n color: #0a5c7a;\r\n letter-spacing: 0.3px;\r\n }\r\n\r\n .tss-mini-icon {\r\n position: absolute;\r\n left: 34%;\r\n bottom: 22%;\r\n width: 3.2rem;\r\n height: 3.2rem;\r\n border-radius: 16px;\r\n background: #1e6b8f; \/* ocean blue *\/\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-shadow: 0 16px 30px rgba(30, 107, 143, 0.45);\r\n z-index: 6;\r\n }\r\n\r\n .tss-mini-icon svg {\r\n width: 26px;\r\n height: 26px;\r\n fill: white;\r\n }\r\n\r\n .tss-dots-top {\r\n position: absolute;\r\n left: 38%;\r\n top: 12%;\r\n width: 4rem;\r\n height: 2.8rem;\r\n background-image: radial-gradient(#1e6b8f 2px, transparent 2px);\r\n background-size: 12px 12px;\r\n opacity: 0.4;\r\n z-index: 1;\r\n }\r\n\r\n .tss-dots-bottom {\r\n position: absolute;\r\n left: 5%;\r\n bottom: 10%;\r\n width: 5rem;\r\n height: 3.8rem;\r\n background-image: radial-gradient(#0a5c7a 2px, transparent 2px);\r\n background-size: 14px 14px;\r\n opacity: 0.3;\r\n z-index: 1;\r\n }\r\n\r\n .tss-ring-left {\r\n position: absolute;\r\n left: -4%;\r\n top: 38%;\r\n width: 4rem;\r\n height: 4rem;\r\n border: 2px dashed #1e6b8f; \/* ocean blue *\/\r\n border-right-color: transparent;\r\n border-top-color: transparent;\r\n border-radius: 50%;\r\n opacity: 0.4;\r\n z-index: 1;\r\n }\r\n \r\n \/* ===== RIGHT CONTENT ===== *\/\r\n .tss-content {\r\n width: 100%;\r\n max-width: 580px;\r\n margin-left: auto;\r\n }\r\n\r\n .tss-topline {\r\n font-size: clamp(0.7rem, 2vw, 0.9rem);\r\n font-weight: 700;\r\n color: #E07A2C; \/* orange accent for topline *\/\r\n letter-spacing: 0.1em;\r\n text-transform: uppercase;\r\n margin-bottom: 0.4rem;\r\n }\r\n\r\n .tss-topline span {\r\n color: #1e6b8f;\r\n margin-left: 0.4rem;\r\n letter-spacing: 0.2em;\r\n }\r\n\r\n .tss-title {\r\n font-size: clamp(1.8rem, 5.5vw, 3.2rem);\r\n font-weight: 800;\r\n line-height: 1.1;\r\n color: #0a2f44; \/* deep ocean blue *\/\r\n margin-bottom: 0.7rem;\r\n }\r\n\r\n .tss-desc {\r\n font-size: clamp(0.85rem, 2.2vw, 1rem);\r\n line-height: 1.6;\r\n color: #2c4a5e;\r\n font-weight: 400;\r\n margin-bottom: 1.5rem;\r\n max-width: 520px;\r\n }\r\n\r\n .tss-highlight {\r\n position: relative;\r\n background: #ffffff;\r\n border-radius: 1.8rem;\r\n padding: 1.5rem 1.2rem 1.2rem 5.5rem;\r\n margin-bottom: 1.8rem;\r\n border: 1px solid #cce3ed;\r\n box-shadow: 0 4px 12px rgba(10, 92, 122, 0.08);\r\n }\r\n\r\n .tss-highlight-left {\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n bottom: 0;\r\n width: 4.8rem;\r\n background: #1e6b8f; \/* ocean blue *\/\r\n border-radius: 1.8rem 0 0 1.8rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .tss-highlight-left svg {\r\n width: 2.2rem;\r\n height: 2.2rem;\r\n fill: white;\r\n stroke: white;\r\n stroke-width: 0.2;\r\n }\r\n\r\n .tss-highlight-text {\r\n font-size: 0.85rem;\r\n line-height: 1.5;\r\n color: #2c4a5e;\r\n font-weight: 500;\r\n }\r\n\r\n .tss-highlight-text b,\r\n .tss-desc b {\r\n color: #E07A2C; \/* orange accent for bold text *\/\r\n font-weight: 700;\r\n }\r\n\r\n \/* FEATURE LIST *\/\r\n .tss-feature-list {\r\n display: grid;\r\n grid-template-columns: repeat(2, 1fr);\r\n gap: 1rem 1.5rem;\r\n margin-bottom: 1.8rem;\r\n }\r\n\r\n .tss-feature {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.7rem;\r\n font-weight: 500;\r\n font-size: 0.9rem;\r\n color: #000000; \/* BLACK FONT for keywords *\/\r\n }\r\n\r\n .tss-dot {\r\n width: 1.7rem;\r\n height: 1.7rem;\r\n border-radius: 50%;\r\n background: #1e6b8f; \/* ocean blue *\/\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n box-shadow: 0 6px 12px rgba(30, 107, 143, 0.25);\r\n }\r\n\r\n .tss-dot svg {\r\n width: 14px;\r\n height: 14px;\r\n fill: white;\r\n stroke: white;\r\n stroke-width: 0.5;\r\n }\r\n\r\n .tss-btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n background: #E07A2C; \/* orange accent for button *\/\r\n color: white;\r\n font-weight: 700;\r\n font-size: 1rem;\r\n padding: 0.8rem 2rem;\r\n border-radius: 40px;\r\n text-decoration: none;\r\n box-shadow: 0 16px 28px rgba(224, 122, 44, 0.35);\r\n transition: 0.2s;\r\n white-space: nowrap;\r\n border: none;\r\n cursor: pointer;\r\n }\r\n\r\n .tss-btn:hover {\r\n background: #B95C1A;\r\n transform: translateY(-2px);\r\n }\r\n\r\n \/* ===== MOBILE OPTIMIZATION ===== *\/\r\n @media (max-width: 900px) {\r\n .tss-container {\r\n grid-template-columns: 1fr;\r\n max-width: 620px;\r\n }\r\n\r\n .tss-visual {\r\n aspect-ratio: 1 \/ 1.15;\r\n max-width: 520px;\r\n margin: 0 auto 0.5rem;\r\n }\r\n\r\n .tss-main-photo {\r\n left: 20%;\r\n top: 3%;\r\n width: 64%;\r\n height: 70%;\r\n }\r\n\r\n .tss-small-photo {\r\n left: 2%;\r\n bottom: 12%;\r\n width: 46%;\r\n }\r\n\r\n .tss-mini-icon {\r\n left: 32%;\r\n bottom: 18%;\r\n width: 3.4rem;\r\n height: 3.4rem;\r\n }\r\n\r\n .tss-stat-card {\r\n padding: 0.6rem 1rem;\r\n gap: 0.6rem;\r\n min-width: 160px;\r\n }\r\n\r\n .tss-content {\r\n margin: 0 auto;\r\n max-width: 540px;\r\n padding: 0 0.5rem;\r\n }\r\n }\r\n\r\n @media (max-width: 600px) {\r\n .tss-section {\r\n padding: 0.8rem 0.8rem 1.5rem;\r\n }\r\n\r\n .tss-visual {\r\n aspect-ratio: 1 \/ 1.25;\r\n max-width: 100%;\r\n }\r\n\r\n .tss-main-photo {\r\n left: 16%;\r\n top: 1%;\r\n width: 70%;\r\n height: 74%;\r\n }\r\n\r\n .tss-small-photo {\r\n left: 0%;\r\n bottom: 10%;\r\n width: 48%;\r\n border-width: 5px;\r\n }\r\n\r\n .tss-mini-icon {\r\n left: 28%;\r\n bottom: 16%;\r\n width: 3.2rem;\r\n height: 3.2rem;\r\n }\r\n\r\n .tss-stat-card {\r\n padding: 0.5rem 0.9rem;\r\n gap: 0.5rem;\r\n top: 16%;\r\n }\r\n\r\n .tss-stat-icon {\r\n width: 2rem;\r\n height: 2rem;\r\n }\r\n\r\n .tss-stat-number {\r\n font-size: 1rem;\r\n }\r\n\r\n .tss-stat-text {\r\n font-size: 0.6rem;\r\n }\r\n\r\n .tss-highlight {\r\n padding: 1.4rem 1rem 1rem 5rem;\r\n }\r\n\r\n .tss-highlight-left {\r\n width: 4.2rem;\r\n }\r\n\r\n .tss-highlight-left svg {\r\n width: 2rem;\r\n height: 2rem;\r\n }\r\n\r\n .tss-highlight-text {\r\n font-size: 0.78rem;\r\n }\r\n\r\n .tss-feature-list {\r\n grid-template-columns: 1fr;\r\n gap: 0.7rem;\r\n }\r\n\r\n .tss-feature {\r\n font-size: 0.85rem;\r\n }\r\n\r\n .tss-btn {\r\n width: 100%;\r\n padding: 0.8rem 1rem;\r\n }\r\n }\r\n\r\n @media (max-width: 400px) {\r\n .tss-visual {\r\n aspect-ratio: 1 \/ 1.3;\r\n }\r\n .tss-main-photo {\r\n left: 12%;\r\n width: 76%;\r\n height: 76%;\r\n }\r\n .tss-small-photo {\r\n width: 50%;\r\n bottom: 8%;\r\n }\r\n .tss-mini-icon {\r\n left: 26%;\r\n bottom: 14%;\r\n }\r\n .tss-highlight {\r\n padding: 1.4rem 0.9rem 0.9rem 4.2rem;\r\n }\r\n .tss-highlight-left {\r\n width: 3.8rem;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <section class=\"tss-section\">\r\n <div class=\"tss-container\">\r\n\r\n \r\n <div class=\"tss-visual\">\r\n <div class=\"tss-dots-top\"><\/div>\r\n <div class=\"tss-dots-bottom\"><\/div>\r\n <div class=\"tss-ring-left\"><\/div>\r\n\r\n \r\n <div class=\"tss-stat-card\">\r\n <div class=\"tss-stat-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 3L14.2 7.5L19 8.2L15.5 11.6L16.3 16.4L12 14.1L7.7 16.4L8.5 11.6L5 8.2L9.8 7.5L12 3Z\" fill=\"white\" stroke=\"white\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"tss-stat-text-wrapper\">\r\n <div class=\"tss-stat-number\">+1,280+<\/div>\r\n <div class=\"tss-stat-text\">Happy surfers<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-main-photo\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.09-3.jpeg\" alt=\"Surf instructor teaching at Tamazirt Surf Shop School Taghazout\">\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-small-photo\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.09-2.jpeg\" alt=\"Surfboards and premium gear at Tamazirt Surf Shop Morocco\">\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-mini-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M2 12C2 6.48 6.48 2 12 2s10 4.48 10 10-4.48 10-10 10S2 17.52 2 12zm10-6c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-content\">\r\n <div class=\"tss-topline\">Tamazirt Surf Shop School <span>\u2726 \u2726 \u2726 \u2726<\/span><\/div>\r\n\r\n <h1 class=\"tss-title\">Surf Lessons &<br> Premium Gear in Taghazout<\/h1>\r\n\r\n <p class=\"tss-desc\">\r\n <b>Tamazirt Surf Shop School<\/b> offers expert <b>surf lessons for all levels<\/b>, \r\n premium <b>board rentals & wetsuits<\/b>, and unforgettable <b>surf adventures<\/b> along Morocco's \r\n Atlantic coast. Experience authentic Taghazout surf culture with certified local instructors.\r\n <\/p>\r\n\r\n \r\n <div class=\"tss-highlight\">\r\n <div class=\"tss-highlight-left\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"tss-highlight-text\">\r\n <b>Personalized surf coaching & small groups<\/b> with certified instructors. \r\n Enjoy <b>video analysis, safety training, and local spot knowledge<\/b> \u2014 \r\n from beginner friendly waves to advanced reef breaks like Anchor Point.\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-feature-list\">\r\n <div class=\"tss-feature\">\r\n <span class=\"tss-dot\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/span>\r\n Beginner surf lessons\r\n <\/div>\r\n <div class=\"tss-feature\">\r\n <span class=\"tss-dot\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/span>\r\n Advanced coaching\r\n <\/div>\r\n <div class=\"tss-feature\">\r\n <span class=\"tss-dot\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/span>\r\n Surfboard & wetsuit rental\r\n <\/div>\r\n <div class=\"tss-feature\">\r\n <span class=\"tss-dot\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/span>\r\n Surf camps & guiding\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/surf-lessons-in-taghazout\/\" class=\"tss-btn\">Book Now \u2192<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8dacf1f e-con-full e-flex e-con e-parent\" data-id=\"8dacf1f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3a41c51 elementor-widget elementor-widget-html\" data-id=\"3a41c51\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Tamazirt & Surf Shop School \u00b7 Premium Surf Services<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700;14..32,800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'Inter', sans-serif;\r\n background: #ffffff;\r\n }\r\n\r\n \/* Features Section - NO BACKGROUND *\/\r\n .features-section {\r\n width: 100%;\r\n background: transparent; \/* No background *\/\r\n padding: 5rem 2rem;\r\n }\r\n\r\n .features-container {\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n }\r\n\r\n \/* Section Header *\/\r\n .section-header {\r\n text-align: center;\r\n margin-bottom: 4rem;\r\n }\r\n\r\n .section-header h2 {\r\n font-size: clamp(2rem, 5vw, 2.8rem);\r\n font-weight: 800;\r\n color: #0a2f44;\r\n margin-bottom: 0.75rem;\r\n letter-spacing: -0.02em;\r\n }\r\n\r\n .section-header p {\r\n font-size: 1.1rem;\r\n color: #4a6f86;\r\n max-width: 580px;\r\n margin: 0 auto;\r\n }\r\n\r\n .section-header .divider {\r\n width: 70px;\r\n height: 3px;\r\n background: #E07A2C;\r\n margin: 1rem auto 0;\r\n border-radius: 3px;\r\n }\r\n\r\n \/* Feature Item *\/\r\n .feature-item {\r\n display: flex;\r\n align-items: center;\r\n gap: 4rem;\r\n margin-bottom: 5rem;\r\n background: transparent; \/* No background *\/\r\n border-radius: 2rem;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-item:last-child {\r\n margin-bottom: 0;\r\n }\r\n\r\n \/* Image Container with Professional Frame (Cadre) *\/\r\n .feature-image {\r\n flex: 1;\r\n position: relative;\r\n border-radius: 1.5rem;\r\n overflow: hidden;\r\n box-shadow: 0 20px 35px -12px rgba(0, 0, 0, 0.15);\r\n transition: transform 0.4s ease, box-shadow 0.4s ease;\r\n }\r\n\r\n .feature-image:hover {\r\n transform: translateY(-6px);\r\n box-shadow: 0 25px 40px -12px rgba(0, 0, 0, 0.25);\r\n }\r\n\r\n .feature-image img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n transition: transform 0.5s ease;\r\n }\r\n\r\n .feature-image:hover img {\r\n transform: scale(1.03);\r\n }\r\n\r\n \/* Professional Frame (Cadre) - Double border effect *\/\r\n .feature-image::before {\r\n content: '';\r\n position: absolute;\r\n top: 1rem;\r\n left: 1rem;\r\n right: 1rem;\r\n bottom: 1rem;\r\n border: 1.5px solid rgba(255, 255, 255, 0.5);\r\n border-radius: 1rem;\r\n z-index: 2;\r\n pointer-events: none;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-image::after {\r\n content: '';\r\n position: absolute;\r\n top: 0.5rem;\r\n left: 0.5rem;\r\n right: 0.5rem;\r\n bottom: 0.5rem;\r\n border: 1px solid rgba(224, 122, 44, 0.7);\r\n border-radius: 1.2rem;\r\n z-index: 2;\r\n pointer-events: none;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-image:hover::before {\r\n top: 0.8rem;\r\n left: 0.8rem;\r\n right: 0.8rem;\r\n bottom: 0.8rem;\r\n border-color: rgba(255, 255, 255, 0.8);\r\n }\r\n\r\n .feature-image:hover::after {\r\n top: 0.3rem;\r\n left: 0.3rem;\r\n right: 0.3rem;\r\n bottom: 0.3rem;\r\n border-color: #E07A2C;\r\n }\r\n\r\n \/* Content Area *\/\r\n .feature-content {\r\n flex: 1;\r\n padding: 1rem;\r\n }\r\n\r\n \/* Category Badge - BOLD with different color *\/\r\n .feature-category {\r\n display: inline-block;\r\n font-size: 0.9rem;\r\n font-weight: 800; \/* EXTRA BOLD *\/\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n margin-bottom: 1rem;\r\n padding: 0.3rem 0.8rem;\r\n border-radius: 50px;\r\n }\r\n\r\n \/* Different colors for each category - BOLD keywords *\/\r\n .feature-item:nth-child(1) .feature-category {\r\n color: #E07A2C;\r\n background: rgba(224, 122, 44, 0.12);\r\n }\r\n \r\n .feature-item:nth-child(2) .feature-category {\r\n color: #2C7A5E;\r\n background: rgba(44, 122, 94, 0.12);\r\n }\r\n \r\n .feature-item:nth-child(3) .feature-category {\r\n color: #3A86FF;\r\n background: rgba(58, 134, 255, 0.12);\r\n }\r\n\r\n \/* Title *\/\r\n .feature-title {\r\n font-size: clamp(1.8rem, 4vw, 2.4rem);\r\n font-weight: 800;\r\n color: #0a2f44;\r\n margin-bottom: 1.25rem;\r\n line-height: 1.3;\r\n letter-spacing: -0.01em;\r\n }\r\n\r\n \/* Description with BOLD keywords *\/\r\n .feature-description {\r\n font-size: 1rem;\r\n line-height: 1.6;\r\n color: #4a5568;\r\n margin-bottom: 1.75rem;\r\n }\r\n \r\n \/* Make important keywords BOLD with different colors *\/\r\n .feature-description strong {\r\n font-weight: 800;\r\n color: #E07A2C;\r\n }\r\n \r\n \/* Specific keyword styling *\/\r\n .keyword-bold {\r\n font-weight: 800;\r\n color: #E07A2C;\r\n }\r\n\r\n \/* Button *\/\r\n .feature-btn {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 0.6rem;\r\n background: transparent;\r\n color: #E07A2C;\r\n font-weight: 700;\r\n font-size: 0.95rem;\r\n padding: 0.8rem 1.8rem;\r\n border-radius: 50px;\r\n text-decoration: none;\r\n transition: all 0.3s ease;\r\n border: 2px solid #E07A2C;\r\n cursor: pointer;\r\n }\r\n\r\n .feature-btn:hover {\r\n background: #E07A2C;\r\n color: white;\r\n transform: translateX(5px);\r\n }\r\n\r\n .feature-btn svg {\r\n width: 18px;\r\n height: 18px;\r\n fill: currentColor;\r\n transition: transform 0.2s;\r\n }\r\n\r\n .feature-btn:hover svg {\r\n transform: translateX(3px);\r\n }\r\n\r\n \/* Alternating Layout *\/\r\n .feature-item.reverse {\r\n flex-direction: row-reverse;\r\n }\r\n\r\n \/* ========== OPTIMIZED MOBILE RESPONSIVE ========== *\/\r\n @media (max-width: 1024px) {\r\n .features-section {\r\n padding: 4rem 1.8rem;\r\n }\r\n .feature-item {\r\n gap: 2.5rem;\r\n }\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .feature-item {\r\n flex-direction: column !important;\r\n gap: 2rem;\r\n margin-bottom: 4rem;\r\n background: transparent;\r\n }\r\n \r\n .feature-image {\r\n width: 100%;\r\n max-width: 100%;\r\n margin: 0 auto;\r\n }\r\n \r\n .feature-content {\r\n text-align: left;\r\n padding: 0;\r\n width: 100%;\r\n }\r\n \r\n .feature-category {\r\n display: inline-block;\r\n font-size: 0.85rem;\r\n }\r\n \r\n .feature-title {\r\n font-size: 1.7rem;\r\n margin-bottom: 1rem;\r\n }\r\n \r\n .feature-description {\r\n font-size: 0.98rem;\r\n line-height: 1.55;\r\n margin-bottom: 1.5rem;\r\n }\r\n \r\n .feature-btn {\r\n display: inline-flex;\r\n margin: 0;\r\n }\r\n \r\n \/* Keep frames on mobile but simpler for performance *\/\r\n .feature-image::before,\r\n .feature-image::after {\r\n display: none;\r\n }\r\n }\r\n\r\n @media (max-width: 680px) {\r\n .features-section {\r\n padding: 2.5rem 1.2rem;\r\n }\r\n \r\n .feature-item {\r\n margin-bottom: 3rem;\r\n gap: 1.5rem;\r\n }\r\n \r\n .feature-title {\r\n font-size: 1.5rem;\r\n }\r\n \r\n .feature-description {\r\n font-size: 0.92rem;\r\n line-height: 1.5;\r\n }\r\n \r\n .feature-category {\r\n font-size: 0.8rem;\r\n padding: 0.25rem 0.7rem;\r\n margin-bottom: 0.75rem;\r\n }\r\n \r\n .feature-btn {\r\n padding: 0.7rem 1.5rem;\r\n font-size: 0.9rem;\r\n }\r\n \r\n .section-header {\r\n margin-bottom: 2.5rem;\r\n }\r\n \r\n .section-header h2 {\r\n font-size: 1.8rem;\r\n }\r\n \r\n .section-header p {\r\n font-size: 0.95rem;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .features-section {\r\n padding: 2rem 1rem;\r\n }\r\n \r\n .feature-title {\r\n font-size: 1.35rem;\r\n }\r\n \r\n .feature-description {\r\n font-size: 0.88rem;\r\n }\r\n \r\n .feature-category {\r\n font-size: 0.75rem;\r\n }\r\n \r\n .feature-btn {\r\n padding: 0.6rem 1.3rem;\r\n font-size: 0.85rem;\r\n }\r\n }\r\n\r\n \/* Animation on load *\/\r\n @keyframes fadeInUp {\r\n from {\r\n opacity: 0;\r\n transform: translateY(30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n .feature-item {\r\n animation: fadeInUp 0.6s ease forwards;\r\n opacity: 0;\r\n }\r\n\r\n .feature-item:nth-child(1) {\r\n animation-delay: 0.1s;\r\n }\r\n .feature-item:nth-child(2) {\r\n animation-delay: 0.2s;\r\n }\r\n .feature-item:nth-child(3) {\r\n animation-delay: 0.3s;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"features-section\">\r\n <div class=\"features-container\">\r\n \r\n <div class=\"section-header\">\r\n <h2>Experience the Atlantic Spirit<\/h2>\r\n <p>Premium surf & outdoor adventures in Taghazout<\/p>\r\n <div class=\"divider\"><\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-image\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.12.jpeg\" alt=\"Surf lessons in Taghazout with Tamazirt Surf Shop School\">\r\n <\/div>\r\n <div class=\"feature-content\">\r\n <div class=\"feature-category\">\ud83c\udfc4\u200d\u2642\ufe0f SURFING<\/div>\r\n <h3 class=\"feature-title\">Join Surf Lessons In Taghazout<\/h3>\r\n <p class=\"feature-description\">\r\n <strong>Learn to surf<\/strong> in Taghazout with <strong>trusted local instructors<\/strong>. From first rides to skill-building sessions, each lesson suits your level. Join <strong>small group classes<\/strong>, go <strong>one-on-one with private surf lessons<\/strong>, or let <strong>kids surf safely<\/strong>. Book your <strong>Taghazout surf experience<\/strong> now\u2014fun, friendly, and designed for all abilities.\r\n <\/p>\r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/surf-lessons-in-taghazout\/\" class=\"feature-btn\">\r\n Explore Surf Packages\r\n <svg viewbox=\"0 0 24 24\"><path d=\"M5 13h11.86l-3.63 4.36L14 18l6-6-6-6-1.77 1.64L16.86 11H5v2z\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item reverse\">\r\n <div class=\"feature-image\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.10.58.jpeg\" alt=\"Surfboard and SUP rentals in Taghazout\">\r\n <\/div>\r\n <div class=\"feature-content\">\r\n <div class=\"feature-category\">\ud83c\udfc4\u200d\u2640\ufe0f RENTALS<\/div>\r\n <h3 class=\"feature-title\">Rent a surfboard or stand-up paddleboard<\/h3>\r\n <p class=\"feature-description\">\r\n At <strong>Tamazirt Surf Shop<\/strong>, we've got the <strong>perfect board<\/strong> waiting for you\u2014whether you're just starting out or chasing the next big swell. From <strong>beginner-friendly surfboards<\/strong> to <strong>high-performance stand-up paddleboards<\/strong>, our rental selection suits every level. <strong>Book online now<\/strong> and get straight to the waves when you arrive.\r\n <\/p>\r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/surf-rentals\/\" class=\"feature-btn\">\r\n Zarezerwuj teraz\r\n <svg viewbox=\"0 0 24 24\"><path d=\"M5 13h11.86l-3.63 4.36L14 18l6-6-6-6-1.77 1.64L16.86 11H5v2z\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-image\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/taghazout-activities-camel-hose-sable-2-850x540-1.webp\" alt=\"Outdoor activities in Taghazout Paradise Valley and sandboarding\">\r\n <\/div>\r\n <div class=\"feature-content\">\r\n <div class=\"feature-category\">\ud83c\udf04 ACTIVITIES<\/div>\r\n <h3 class=\"feature-title\">Join unforgettable outdoor activities<\/h3>\r\n <p class=\"feature-description\">\r\n There's <strong>more to Taghazout than surfing<\/strong> \u2014 let us show you the magic. From <strong>peaceful walks through Paradise Valley<\/strong> to the <strong>golden dunes of Timlalin<\/strong> and exciting <strong>sandboarding experiences<\/strong>, each trip is guided with care. Travel in style with <strong>air-conditioned transport<\/strong> and <strong>friendly local guides<\/strong>. Discover, explore, and make memories \u2014 <strong>book your trip with us now<\/strong>.\r\n <\/p>\r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/activities\/\" class=\"feature-btn\">\r\n Explore now\r\n <svg viewbox=\"0 0 24 24\"><path d=\"M5 13h11.86l-3.63 4.36L14 18l6-6-6-6-1.77 1.64L16.86 11H5v2z\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-95741f5 e-con-full e-flex e-con e-parent\" data-id=\"95741f5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-086b35f elementor-widget elementor-widget-html\" data-id=\"086b35f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Tamazirt Surf Shop & School \u00b7 Taghazout Morocco<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700;14..32,800;14..32,900&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n \/* Full Width Banner Section with Fixed Background - Reduced Height *\/\r\n .hero-banner {\r\n position: relative;\r\n width: 100%;\r\n height: 85vh;\r\n min-height: 550px;\r\n max-height: 700px;\r\n background-image: url('https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.12.jpeg');\r\n background-size: cover;\r\n background-position: center;\r\n background-attachment: fixed;\r\n background-repeat: no-repeat;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-family: 'Inter', sans-serif;\r\n overflow: hidden;\r\n }\r\n\r\n \/* Dark Overlay with Vibrant Ocean Blue *\/\r\n .hero-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: linear-gradient(135deg, rgba(10, 92, 122, 0.88) 0%, rgba(30, 107, 143, 0.82) 100%);\r\n z-index: 1;\r\n }\r\n\r\n \/* Content Container *\/\r\n .hero-content {\r\n position: relative;\r\n z-index: 2;\r\n max-width: 900px;\r\n padding: 2rem;\r\n text-align: center;\r\n color: white;\r\n animation: fadeInUp 0.8s ease-out;\r\n }\r\n\r\n \/* Title with Gradient *\/\r\n .hero-title {\r\n font-size: clamp(2rem, 5vw, 3.8rem);\r\n font-weight: 900;\r\n margin-bottom: 0.75rem;\r\n line-height: 1.2;\r\n letter-spacing: -0.02em;\r\n background: linear-gradient(135deg, #ffffff 60%, #E07A2C 100%);\r\n -webkit-background-clip: text;\r\n background-clip: text;\r\n color: transparent;\r\n }\r\n\r\n \/* Subtitle \/ Tagline *\/\r\n .hero-subtitle {\r\n font-size: clamp(1rem, 2.5vw, 1.2rem);\r\n font-weight: 600;\r\n margin-bottom: 1.2rem;\r\n color: rgba(255, 255, 255, 0.95);\r\n letter-spacing: -0.01em;\r\n }\r\n\r\n \/* Description Text - Exactly 3 Lines *\/\r\n .hero-description {\r\n font-size: clamp(0.9rem, 2vw, 1rem);\r\n line-height: 1.5;\r\n margin-bottom: 2rem;\r\n max-width: 700px;\r\n margin-left: auto;\r\n margin-right: auto;\r\n color: rgba(255, 255, 255, 0.92);\r\n font-weight: 400;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 3;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n }\r\n\r\n \/* CTA Button *\/\r\n .hero-btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 0.8rem;\r\n background: transparent;\r\n color: white;\r\n font-weight: 700;\r\n font-size: 1rem;\r\n padding: 0.85rem 2.2rem;\r\n border-radius: 50px;\r\n text-decoration: none;\r\n transition: all 0.3s ease;\r\n border: 2px solid #E07A2C;\r\n cursor: pointer;\r\n letter-spacing: 0.5px;\r\n }\r\n\r\n .hero-btn:hover {\r\n background: #E07A2C;\r\n color: white;\r\n transform: translateY(-3px);\r\n box-shadow: 0 15px 30px rgba(224, 122, 44, 0.3);\r\n border-color: #E07A2C;\r\n }\r\n\r\n .hero-btn svg {\r\n width: 18px;\r\n height: 18px;\r\n fill: currentColor;\r\n transition: transform 0.2s;\r\n }\r\n\r\n .hero-btn:hover svg {\r\n transform: translateX(5px);\r\n }\r\n\r\n \/* Fade In Up Animation *\/\r\n @keyframes fadeInUp {\r\n from {\r\n opacity: 0;\r\n transform: translateY(40px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n \/* Responsive Design *\/\r\n @media (max-width: 1024px) {\r\n .hero-banner {\r\n height: 80vh;\r\n min-height: 500px;\r\n max-height: 650px;\r\n }\r\n .hero-content {\r\n padding: 1.5rem;\r\n }\r\n .hero-description {\r\n max-width: 600px;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .hero-banner {\r\n height: auto;\r\n min-height: 480px;\r\n background-attachment: scroll; \/* Better performance on mobile *\/\r\n }\r\n .hero-content {\r\n padding: 1.5rem;\r\n }\r\n .hero-description {\r\n margin-bottom: 1.8rem;\r\n -webkit-line-clamp: 3;\r\n }\r\n .hero-btn {\r\n padding: 0.75rem 1.8rem;\r\n font-size: 0.95rem;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .hero-banner {\r\n min-height: 450px;\r\n }\r\n .hero-description {\r\n font-size: 0.85rem;\r\n line-height: 1.5;\r\n }\r\n .hero-btn {\r\n padding: 0.7rem 1.6rem;\r\n font-size: 0.9rem;\r\n }\r\n .hero-title {\r\n margin-bottom: 0.5rem;\r\n }\r\n .hero-subtitle {\r\n margin-bottom: 1rem;\r\n }\r\n }\r\n\r\n \/* Smooth Scroll Behavior *\/\r\n html {\r\n scroll-behavior: smooth;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <section class=\"hero-banner\">\r\n <div class=\"hero-overlay\"><\/div>\r\n <div class=\"hero-content\">\r\n \r\n \r\n <h1 class=\"hero-title\">Tamazirt Surf Shop & School<\/h1>\r\n \r\n \r\n <p class=\"hero-subtitle\">Taghazout's Premier Surf Experience<\/p>\r\n \r\n \r\n <p class=\"hero-description\">\r\n Quality surfboard rentals, fun surf lessons in Taghazout, and a handpicked mix of locally crafted shirts and souvenirs. \r\n Whether you're a first-timer or chasing your next wave, we've got you covered. \r\n Come visit us, say hi, and dive into the surf spirit \u2014 no stress, just stoke.\r\n <\/p>\r\n \r\n \r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/surf-rentals\/\" class=\"hero-btn\">\r\n Visit Our Shop\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M5 13h11.86l-3.63 4.36L14 18l6-6-6-6-1.77 1.64L16.86 11H5v2z\"\/>\r\n <\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/section>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fa95ebe e-flex e-con-boxed e-con e-parent\" data-id=\"fa95ebe\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5fc88fd elementor-widget elementor-widget-shortcode\" data-id=\"5fc88fd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><pre class=\"ti-widget\"><template id=\"trustindex-google-widget-html\"><div class=\"ti-widget ti-goog ti-review-text-mode-readmore ti-text-align-left\" data-no-translation=\"true\" data-time-locale=\"%d %s ago|today|day|days|week|weeks|month|months|year|years\" data-plugin-version=\"13.2.8\" data-layout-id=\"34\" data-layout-category=\"slider\" data-set-id=\"light-background\" data-pid=\"\" data-language=\"en\" data-close-locale=\"Close\" data-review-target-width=\"300\" data-css-version=\"2\" data-reply-by-locale=\"Owner's reply\" data-only-rating-locale=\"This user only left a rating.\" data-pager-autoplay-timeout=\"6\"> <div class=\"ti-widget-container ti-col-3\"> <div class=\"ti-header ti-header-grid source-Google\"> <div class=\"ti-fade-container\"> <div class=\"ti-rating-text\"> <strong class=\"ti-rating ti-rating-large\"> EXCELLENT <\/strong> <\/div> <span class=\"ti-stars star-lg\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><\/span> <div class=\"ti-rating-text\"> <span class=\"nowrap\">Based on <strong>32 reviews<\/strong><\/span> <\/div> <div class=\"ti-large-logo\"> <div class=\"ti-v-center\"> <trustindex-image class=\"ti-logo-fb\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/logo.svg\" width=\"150\" height=\"25\" loading=\"lazy\" alt=\"Google\"><\/trustindex-image> <\/div> <\/div> <\/div> <\/div> <div class=\"ti-reviews-container\"> <div class=\"ti-controls\"> <div class=\"ti-next\" aria-label=\"Next review\" role=\"button\" tabindex=\"0\"><\/div> <div class=\"ti-prev\" aria-label=\"Previous review\" role=\"button\" tabindex=\"0\"><\/div> <\/div> <div class=\"ti-reviews-container-wrapper\"> <div data-empty=\"0\" data-time=\"1774742400\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocJP6fDBYzTp74SpQ3d_zrejZXkpVWvPqhepe0v8EPiihg20Ug=w40-h40-c-rp-mo-br100\" alt=\"School of Dough CIC profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> School of Dough CIC <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Surf hire - board and wetsuit during short stay in taghazout to recharge! Super friendly, excellent price and good choice of boards. Strongly recommend - big shout out! \ud83c\udfc4\u200d\u2642\ufe0f \ud83e\udd19<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774742400\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a-\/ALV-UjUjg2NSPP4-Wn7lG3vuVxcusZprnyLeNFvtl0GPfTNI-FmWfveU2A=w40-h40-c-rp-mo-br100\" alt=\"Madison Boles profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Madison Boles <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Such great people!<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774742400\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a-\/ALV-UjXc2nmOf7yeGW5jrs3ulLK8cRcV_IIC7LCV5iygFESN1AfpUPnt=w40-h40-c-rp-mo-br100\" alt=\"Emilia Di Paola profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Emilia Di Paola <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">What great service. If you need a board rental head over to tamazirt surf shop and school !<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774656000\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocI3_U4ph3xgD4H7V0eNHY-54gUF_pCz5OJ_OmFNrmnZ8leMRw=w40-h40-c-rp-mo-br100\" alt=\"Josse Bender profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Josse Bender <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Top Preis<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774483200\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocLprSyU-NDMt1W39eqwYWQSit15oXWJ2xjzKdLm-GYG3MYLqQ=w40-h40-c-rp-mo-br100\" alt=\"Helene Weichelt profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Helene Weichelt <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">It was so great, very friendly!<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774224000\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocKJZ1HZOdwu8h3YvCxlIcoV9kdpToBbDWEa9t9PKEXty8J9Ww=w40-h40-c-rp-mo-br100\" alt=\"jessica hart profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> jessica hart <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Beautiful little shop very reasonable prices. Well worth a visit \u263a\ufe0f<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774137600\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocItLP4Hll_fN77BqZw5fOIOMwFWvdqdTUEFhb6efBM5y4zVdw=w40-h40-c-rp-mo-br100\" alt=\"Redwa Sunsurf profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Redwa Sunsurf <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Guys i realy remember this shop it\u2019s super nice they have nice equipment for surf good boards and also instructure I had really good lessons I learned alot<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1773705600\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocKGKsaieMexY_E9aTTUYFO7slJtYoBQ_j_k0RW58lKWSv_Y7w=w40-h40-c-rp-mo-ba2-br100\" alt=\"alessandro solinas profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> alessandro solinas <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Il top per qualit\u00e0 e prezzo Karim e i suoi amici sono stati davvero disponibili e gentili le migliori tavole da surf ai migliori prezzi<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <\/div> <div class=\"ti-controls-line\"> <div class=\"dot\"><\/div> <\/div> <\/div> <div class=\"ti-verified-by ti-verified-by-row\" data-style=\"1\"> <div class=\"ti-inner\"> Verified by Trustindex <span class=\"ti-info-icon\"><\/span> <div class=\"ti-disclaimer\">Trustindex verified badge is the Universal Symbol of Trust. Only the greatest companies can get the verified badge who has a review score above 4.5, based on customer reviews over the past 12 months. <a href=\"https:\/\/www.trustindex.io\/?a=sys&c=wp-verified-badge&url=\/the-trustindex-verified-badge\/\" target=\"_blank\" rel=\"noopener\">Read more<\/a><\/div> <\/div> <\/div> <\/div> <\/div> <\/template><\/pre><div data-src=\"https:\/\/cdn.trustindex.io\/loader.js?wp-widget\" data-template-id=\"trustindex-google-widget-html\" data-css-url=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/trustindex-google-widget.css?1774876167\"><\/div><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1632805 e-con-full e-flex e-con e-parent\" data-id=\"1632805\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9ea62ad elementor-widget elementor-widget-html\" data-id=\"9ea62ad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Tamazirt Surf Shop & School \u00b7 Why Choose Us<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n .whyus-section {\r\n width: 100%;\r\n min-height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 5rem 2rem;\r\n background: #e8f0f5;\r\n font-family: 'Poppins', sans-serif;\r\n color: #2b2b2b;\r\n }\r\n\r\n .whyus-container {\r\n width: 100%;\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n align-items: center;\r\n gap: clamp(2rem, 5vw, 5rem);\r\n }\r\n\r\n \/* ===== LEFT SIDE - COLLAGE IMAGE DESIGN ===== *\/\r\n .whyus-collage {\r\n position: relative;\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n grid-template-rows: 1fr 1fr;\r\n gap: clamp(14px, 2vw, 22px);\r\n min-height: clamp(360px, 42vw, 520px);\r\n align-content: stretch;\r\n --badge-x: 50%;\r\n --badge-y: 50%;\r\n --badge-size: clamp(110px, 14vw, 150px);\r\n }\r\n\r\n .whyus-img-box {\r\n position: relative;\r\n overflow: hidden;\r\n box-shadow: 0 10px 25px rgba(224,122,44,.08);\r\n background: #cbdde6;\r\n transition: transform 0.3s ease;\r\n }\r\n\r\n .whyus-img-box:hover {\r\n transform: scale(1.02);\r\n }\r\n\r\n .whyus-img-box img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n transition: transform 0.5s ease;\r\n }\r\n\r\n .whyus-img-box:hover img {\r\n transform: scale(1.05);\r\n }\r\n\r\n .whyus-img-1 {\r\n grid-column: 1 \/ 2;\r\n grid-row: 1 \/ 2;\r\n border-radius: 120px 22px 22px 22px;\r\n }\r\n\r\n .whyus-img-3 {\r\n grid-column: 1 \/ 2;\r\n grid-row: 2 \/ 3;\r\n border-radius: 22px 22px 22px 120px;\r\n }\r\n\r\n .whyus-img-2 {\r\n grid-column: 2 \/ 3;\r\n grid-row: 1 \/ 3;\r\n border-radius: 22px;\r\n align-self: center;\r\n height: 86%;\r\n transform: translateY(2%);\r\n z-index: 1;\r\n }\r\n\r\n \/* Orange Ring *\/\r\n .whyus-ring {\r\n position: absolute;\r\n width: clamp(140px, 18vw, 200px);\r\n height: clamp(140px, 18vw, 200px);\r\n border-radius: 999px;\r\n border: clamp(12px, 1.4vw, 18px) solid #E07A2C;\r\n top: clamp(10px, 2vw, 18px);\r\n left: 56%;\r\n transform: translateX(-10%);\r\n z-index: 0;\r\n opacity: .8;\r\n }\r\n\r\n \/* Experience Badge *\/\r\n .whyus-exp-badge {\r\n position: absolute;\r\n width: var(--badge-size);\r\n height: var(--badge-size);\r\n border-radius: 999px;\r\n background: #0a2f44;\r\n color: #f39c12;\r\n display: grid;\r\n place-items: center;\r\n text-align: center;\r\n box-shadow: 0 18px 40px rgba(0,0,0,.20);\r\n border: 8px solid #fff;\r\n left: var(--badge-x);\r\n top: var(--badge-y);\r\n transform: translate(-50%, -50%);\r\n z-index: 4;\r\n }\r\n\r\n .whyus-exp-inner {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 6px;\r\n }\r\n\r\n .whyus-exp-badge .whyus-num {\r\n font-weight: 900;\r\n font-size: clamp(28px, 3.2vw, 42px);\r\n line-height: 1;\r\n margin: 0;\r\n color: #E07A2C;\r\n }\r\n\r\n .whyus-exp-badge .whyus-txt {\r\n margin: 0;\r\n font-weight: 900;\r\n font-size: clamp(11px, 1.2vw, 14px);\r\n line-height: 1.15;\r\n color: #f39c12;\r\n }\r\n\r\n \/* Dots Decoration *\/\r\n .whyus-dots-top {\r\n position: absolute;\r\n left: 30%;\r\n top: -5%;\r\n width: 4rem;\r\n height: 3rem;\r\n background-image: radial-gradient(#1e6b8f 2px, transparent 2px);\r\n background-size: 12px 12px;\r\n opacity: 0.4;\r\n z-index: 1;\r\n }\r\n\r\n .whyus-dots-bottom {\r\n position: absolute;\r\n left: 8%;\r\n bottom: -5%;\r\n width: 5rem;\r\n height: 4rem;\r\n background-image: radial-gradient(#0a5c7a 2px, transparent 2px);\r\n background-size: 14px 14px;\r\n opacity: 0.3;\r\n z-index: 1;\r\n }\r\n\r\n \/* ===== RIGHT SIDE - CONTENT ===== *\/\r\n .whyus-content {\r\n width: 100%;\r\n max-width: 580px;\r\n }\r\n\r\n .whyus-topline {\r\n font-size: clamp(0.7rem, 2vw, 0.9rem);\r\n font-weight: 700;\r\n color: #E07A2C;\r\n letter-spacing: 0.1em;\r\n text-transform: uppercase;\r\n margin-bottom: 0.5rem;\r\n }\r\n\r\n .whyus-title {\r\n font-size: clamp(2rem, 5vw, 3rem);\r\n font-weight: 800;\r\n line-height: 1.2;\r\n color: #0a2f44;\r\n margin-bottom: 1rem;\r\n }\r\n\r\n .whyus-subtitle {\r\n font-size: 1rem;\r\n line-height: 1.6;\r\n color: #2c4a5e;\r\n font-weight: 400;\r\n margin-bottom: 2rem;\r\n }\r\n\r\n \/* Features with Background *\/\r\n .features-list {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 1.2rem;\r\n }\r\n\r\n .feature-item {\r\n display: flex;\r\n gap: 1.2rem;\r\n align-items: flex-start;\r\n background: #ffffff;\r\n padding: 1.2rem 1.5rem;\r\n border-radius: 1.2rem;\r\n transition: all 0.3s ease;\r\n border: 1px solid rgba(30, 107, 143, 0.1);\r\n box-shadow: 0 4px 12px rgba(10, 92, 122, 0.05);\r\n }\r\n\r\n .feature-item:hover {\r\n transform: translateX(8px);\r\n border-color: rgba(224, 122, 44, 0.3);\r\n box-shadow: 0 8px 20px rgba(10, 92, 122, 0.1);\r\n }\r\n\r\n .feature-icon {\r\n flex-shrink: 0;\r\n width: 55px;\r\n height: 55px;\r\n background: linear-gradient(135deg, #0a2f44 0%, #1e6b8f 100%);\r\n border-radius: 18px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-item:hover .feature-icon {\r\n background: linear-gradient(135deg, #E07A2C 0%, #f39c12 100%);\r\n transform: scale(1.05);\r\n }\r\n\r\n .feature-icon svg {\r\n width: 28px;\r\n height: 28px;\r\n fill: white;\r\n }\r\n\r\n .feature-text {\r\n flex: 1;\r\n }\r\n\r\n .feature-text h3 {\r\n font-size: 1.2rem;\r\n font-weight: 700;\r\n color: #0a2f44;\r\n margin-bottom: 0.4rem;\r\n transition: color 0.3s ease;\r\n }\r\n\r\n .feature-item:hover .feature-text h3 {\r\n color: #E07A2C;\r\n }\r\n\r\n .feature-text p {\r\n font-size: 0.85rem;\r\n line-height: 1.5;\r\n color: #4a5b68;\r\n }\r\n\r\n \/* Responsive *\/\r\n @media (min-width: 981px) {\r\n .whyus-collage {\r\n min-height: 460px;\r\n }\r\n .whyus-img-2 {\r\n height: 78%;\r\n transform: translateY(6%);\r\n }\r\n }\r\n\r\n @media (max-width: 980px) {\r\n .whyus-container {\r\n grid-template-columns: 1fr;\r\n gap: 2.5rem;\r\n }\r\n .whyus-collage {\r\n max-width: 550px;\r\n margin: 0 auto;\r\n min-height: 420px;\r\n }\r\n .whyus-content {\r\n max-width: 100%;\r\n text-align: center;\r\n }\r\n .features-list {\r\n max-width: 550px;\r\n margin: 0 auto;\r\n }\r\n .feature-item {\r\n text-align: left;\r\n }\r\n }\r\n\r\n @media (max-width: 640px) {\r\n .whyus-section {\r\n padding: 3rem 1.2rem;\r\n }\r\n .whyus-collage {\r\n min-height: 380px;\r\n --badge-size: 122px;\r\n }\r\n .whyus-img-2 {\r\n height: 82%;\r\n }\r\n .whyus-ring {\r\n left: 58%;\r\n top: 8px;\r\n }\r\n .whyus-exp-badge {\r\n border-width: 6px;\r\n }\r\n .whyus-exp-badge .whyus-num {\r\n font-size: 36px;\r\n }\r\n .whyus-exp-badge .whyus-txt {\r\n font-size: 13px;\r\n }\r\n .feature-item {\r\n padding: 1rem;\r\n gap: 1rem;\r\n }\r\n .feature-icon {\r\n width: 45px;\r\n height: 45px;\r\n border-radius: 14px;\r\n }\r\n .feature-icon svg {\r\n width: 22px;\r\n height: 22px;\r\n }\r\n .feature-text h3 {\r\n font-size: 1rem;\r\n }\r\n .feature-text p {\r\n font-size: 0.8rem;\r\n }\r\n }\r\n\r\n \/* Animation *\/\r\n @keyframes fadeInLeft {\r\n from {\r\n opacity: 0;\r\n transform: translateX(-30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateX(0);\r\n }\r\n }\r\n\r\n @keyframes fadeInRight {\r\n from {\r\n opacity: 0;\r\n transform: translateX(30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateX(0);\r\n }\r\n }\r\n\r\n .whyus-collage {\r\n animation: fadeInLeft 0.6s ease-out forwards;\r\n }\r\n\r\n .whyus-content {\r\n animation: fadeInRight 0.6s ease-out forwards;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n <section class=\"whyus-section\">\r\n <div class=\"whyus-container\">\r\n\r\n \r\n <div class=\"whyus-collage\">\r\n <div class=\"whyus-ring\"><\/div>\r\n <div class=\"whyus-dots-top\"><\/div>\r\n <div class=\"whyus-dots-bottom\"><\/div>\r\n\r\n \r\n <div class=\"whyus-img-box whyus-img-1\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/sandboarding.jpg\" alt=\"Surf lesson at Tamazirt Surf Shop Taghazout\">\r\n <\/div>\r\n\r\n \r\n <div class=\"whyus-img-box whyus-img-2\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.05-1.jpeg\" alt=\"Premium surfboards at Tamazirt Surf Shop\">\r\n <\/div>\r\n\r\n \r\n <div class=\"whyus-img-box whyus-img-3\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.08.jpeg\" alt=\"Surfing experience Taghazout Morocco\">\r\n <\/div>\r\n\r\n \r\n <div class=\"whyus-exp-badge\">\r\n <div class=\"whyus-exp-inner\">\r\n <div class=\"whyus-num\">8+<\/div>\r\n <div class=\"whyus-txt\">Years of<br\/>Surf Excellence<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"whyus-content\">\r\n <div class=\"whyus-topline\">Why Choose Us<\/div>\r\n <h2 class=\"whyus-title\">The Tamazirt Surf Shop & School Difference<\/h2>\r\n <p class=\"whyus-subtitle\">\r\n Experience authentic Moroccan surf culture with passionate locals who live and breathe the ocean.\r\n <\/p>\r\n\r\n <div class=\"features-list\">\r\n \r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"feature-text\">\r\n <h3>Expert Local Instructors<\/h3>\r\n <p>Certified Moroccan surf guides with years of experience teaching all levels, from first-timers to advanced riders.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M18.92 6.01C18.72 5.42 18.16 5 17.5 5h-11c-.66 0-1.21.42-1.42 1.01L3 12v8c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-1h12v1c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-8l-2.08-5.99zM6.5 16c-.83 0-1.5-.67-1.5-1.5S5.67 13 6.5 13s1.5.67 1.5 1.5S7.33 16 6.5 16zm11 0c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zM5 11l1.5-4.5h11L19 11H5z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"feature-text\">\r\n <h3>Premium Equipment<\/h3>\r\n <p>Top-quality surfboards, SUPs, and wetsuits from leading brands, meticulously maintained for optimal performance.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"feature-text\">\r\n <h3>Authentic Moroccan Vibe<\/h3>\r\n <p>Immerse yourself in local culture with handpicked souvenirs, artisan goods, and genuine Taghazout hospitality.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-604140f e-con-full e-flex e-con e-parent\" data-id=\"604140f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-748c4d9 elementor-widget elementor-widget-html\" data-id=\"748c4d9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Yalla Surf \u00b7 Photo Gallery | Surfing in Taghazout<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n .gallery-section {\r\n width: 100%;\r\n background: linear-gradient(145deg, #f8fbfe 0%, #eef3fa 100%);\r\n font-family: 'Poppins', sans-serif;\r\n padding: 5rem 2rem;\r\n }\r\n\r\n .gallery-container {\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n }\r\n\r\n \/* Section Header *\/\r\n .gallery-header {\r\n text-align: center;\r\n margin-bottom: 3rem;\r\n }\r\n\r\n .gallery-header .badge {\r\n display: inline-block;\r\n background: rgba(224, 122, 44, 0.12);\r\n color: #E07A2C;\r\n font-size: 0.75rem;\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n letter-spacing: 1.5px;\r\n padding: 0.3rem 1rem;\r\n border-radius: 30px;\r\n margin-bottom: 1rem;\r\n }\r\n\r\n .gallery-header h2 {\r\n font-size: clamp(2rem, 5vw, 2.8rem);\r\n font-weight: 800;\r\n color: #0a2f44;\r\n margin-bottom: 0.75rem;\r\n letter-spacing: -0.02em;\r\n }\r\n\r\n .gallery-header p {\r\n font-size: 1.1rem;\r\n color: #4a6f86;\r\n max-width: 580px;\r\n margin: 0 auto;\r\n }\r\n\r\n .gallery-header .divider {\r\n width: 70px;\r\n height: 3px;\r\n background: #E07A2C;\r\n margin: 1rem auto 0;\r\n border-radius: 3px;\r\n }\r\n\r\n \/* Gallery Grid - 4 columns on desktop *\/\r\n .gallery-grid {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 1.5rem;\r\n }\r\n\r\n \/* Gallery Item *\/\r\n .gallery-item {\r\n position: relative;\r\n border-radius: 1.2rem;\r\n overflow: hidden;\r\n cursor: pointer;\r\n aspect-ratio: 1 \/ 1;\r\n box-shadow: 0 12px 25px -10px rgba(0, 0, 0, 0.1);\r\n transition: all 0.4s cubic-bezier(0.2, 0.9, 0.4, 1.1);\r\n }\r\n\r\n .gallery-item:hover {\r\n transform: translateY(-8px);\r\n box-shadow: 0 25px 35px -12px rgba(0, 0, 0, 0.2);\r\n }\r\n\r\n .gallery-item img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n transition: transform 0.6s ease;\r\n display: block;\r\n }\r\n\r\n .gallery-item:hover img {\r\n transform: scale(1.08);\r\n }\r\n\r\n \/* Overlay effect on hover *\/\r\n .gallery-overlay {\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n background: linear-gradient(to top, rgba(10, 47, 68, 0.85), transparent);\r\n padding: 1.5rem 1rem 1rem;\r\n transform: translateY(100%);\r\n transition: transform 0.4s ease;\r\n text-align: center;\r\n }\r\n\r\n .gallery-item:hover .gallery-overlay {\r\n transform: translateY(0);\r\n }\r\n\r\n .gallery-overlay svg {\r\n width: 28px;\r\n height: 28px;\r\n fill: white;\r\n opacity: 0.9;\r\n }\r\n\r\n \/* Lightbox Modal (optional but adds professionalism) *\/\r\n .lightbox {\r\n display: none;\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0, 0, 0, 0.9);\r\n z-index: 1000;\r\n justify-content: center;\r\n align-items: center;\r\n cursor: pointer;\r\n opacity: 0;\r\n transition: opacity 0.3s ease;\r\n }\r\n\r\n .lightbox.active {\r\n display: flex;\r\n opacity: 1;\r\n }\r\n\r\n .lightbox img {\r\n max-width: 90%;\r\n max-height: 90%;\r\n object-fit: contain;\r\n border-radius: 8px;\r\n box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);\r\n }\r\n\r\n .lightbox-close {\r\n position: absolute;\r\n top: 20px;\r\n right: 30px;\r\n color: white;\r\n font-size: 40px;\r\n cursor: pointer;\r\n font-weight: 300;\r\n transition: transform 0.2s;\r\n }\r\n\r\n .lightbox-close:hover {\r\n transform: scale(1.1);\r\n }\r\n\r\n \/* Responsive Design *\/\r\n @media (max-width: 1024px) {\r\n .gallery-section {\r\n padding: 4rem 1.8rem;\r\n }\r\n .gallery-grid {\r\n gap: 1.2rem;\r\n }\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .gallery-grid {\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 1.2rem;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .gallery-section {\r\n padding: 3rem 1.2rem;\r\n }\r\n .gallery-grid {\r\n grid-template-columns: repeat(2, 1fr);\r\n gap: 1rem;\r\n }\r\n .gallery-header h2 {\r\n font-size: 1.8rem;\r\n }\r\n .gallery-header p {\r\n font-size: 0.95rem;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .gallery-section {\r\n padding: 2.5rem 1rem;\r\n }\r\n .gallery-grid {\r\n grid-template-columns: 1fr;\r\n gap: 1rem;\r\n max-width: 380px;\r\n margin: 0 auto;\r\n }\r\n .gallery-item {\r\n aspect-ratio: 4 \/ 3;\r\n }\r\n }\r\n\r\n \/* Animation on scroll *\/\r\n @keyframes fadeInUp {\r\n from {\r\n opacity: 0;\r\n transform: translateY(30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n .gallery-item {\r\n animation: fadeInUp 0.6s ease forwards;\r\n opacity: 0;\r\n }\r\n\r\n .gallery-item:nth-child(1) { animation-delay: 0.05s; }\r\n .gallery-item:nth-child(2) { animation-delay: 0.1s; }\r\n .gallery-item:nth-child(3) { animation-delay: 0.15s; }\r\n .gallery-item:nth-child(4) { animation-delay: 0.2s; }\r\n .gallery-item:nth-child(5) { animation-delay: 0.25s; }\r\n .gallery-item:nth-child(6) { animation-delay: 0.3s; }\r\n .gallery-item:nth-child(7) { animation-delay: 0.35s; }\r\n .gallery-item:nth-child(8) { animation-delay: 0.4s; }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n <section class=\"gallery-section\">\r\n <div class=\"gallery-container\">\r\n \r\n <div class=\"gallery-header\">\r\n <div class=\"badge\">Yalla Surf Moments<\/div>\r\n <h2>Capturing the Stoke<\/h2>\r\n <p>Authentic moments from our surf sessions, shop, and the beautiful Taghazout coastline<\/p>\r\n <div class=\"divider\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"gallery-grid\">\r\n \r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.09-3.jpeg\" \r\n alt=\"Surf instructor teaching at Yalla Surf Shop School\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.05-1.jpeg\" \r\n alt=\"Surfing action in Taghazout Bay\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.08-1.jpeg\" \r\n alt=\"Surfboard and equipment at Yalla Surf Shop\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.10-1.jpeg\" \r\n alt=\"Sunset surfing in Taghazout\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.17.21.jpeg\" \r\n alt=\"Group surf lesson with Yalla instructors\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.17.22.jpeg\" \r\n alt=\"Yalla Surf Shop interior and gear\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.12.jpeg\" \r\n alt=\"Wave riding in Taghazout\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/sandboarding.jpg\" \r\n alt=\"Sandboarding adventure near Taghazout\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <div id=\"lightbox\" class=\"lightbox\" onclick=\"closeLightbox()\">\r\n <span class=\"lightbox-close\">×<\/span>\r\n <img decoding=\"async\" id=\"lightbox-img\" src=\"\" alt=\"Gallery image\">\r\n <\/div>\r\n\r\n <script>\r\n function openLightbox(element) {\r\n const img = element.querySelector('img');\r\n const lightbox = document.getElementById('lightbox');\r\n const lightboxImg = document.getElementById('lightbox-img');\r\n lightboxImg.src = img.src;\r\n lightbox.classList.add('active');\r\n document.body.style.overflow = 'hidden';\r\n }\r\n\r\n function closeLightbox() {\r\n const lightbox = document.getElementById('lightbox');\r\n lightbox.classList.remove('active');\r\n document.body.style.overflow = 'auto';\r\n }\r\n\r\n \/\/ Close with Escape key\r\n document.addEventListener('keydown', function(e) {\r\n if (e.key === 'Escape') {\r\n closeLightbox();\r\n }\r\n });\r\n <\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Tamazirt Surf | Ocean Blue Slider \u2013 Book Surf Lessons Tamazirt Surf Shop School \u00b7 Surf Lessons & Premium Gear +1,280+ Happy surfers Tamazirt Surf Shop School \u2726 \u2726 \u2726 \u2726 Surf Lessons & Premium Gear in Taghazout Tamazirt Surf Shop School offers expert surf lessons for all levels, premium board rentals & wetsuits, and […]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":80,"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":357,"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/pages\/8\/revisions\/357"}],"wp:attachment":[{"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Tamazirt Surf | Ocean Blue Slider \u2013 Book Surf Lessons<\/title>\r\n <style>\r\n \/* minimal global reset for seamless embedding \u2013 design untouched except colors & content *\/\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n body {\r\n background: #f2f7ff;\r\n font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;\r\n }\r\n \/* ensure slider container fills width and looks perfect *\/\r\n #tamazirt-surf-slider {\r\n width: 100%;\r\n position: relative;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n \r\n <div id=\"tamazirt-surf-slider\"><\/div>\r\n\r\n <script>\r\n (function() {\r\n const mountPoint = document.getElementById('tamazirt-surf-slider');\r\n if (!mountPoint) return;\r\n const shadowRoot = mountPoint.attachShadow({ mode: 'open' });\r\n\r\n \/\/ \u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014 SLIDER HTML + STYLES (original design preserved, colors changed to BLUE, all accents blue, no orange) \u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\u2014\r\n shadowRoot.innerHTML = `\r\n <style>\r\n :host {\r\n \/* === FULL BLUE PALETTE === vibrant ocean, surf energy, no orange at all *\/\r\n --primary: #0A66C2; \/* strong surf blue (main cta, accents) *\/\r\n --secondary: #4A9EFF; \/* lighter wave blue (highlights, span text) *\/\r\n --accent-deep: #004e92; \/* deep ocean for subtle hover states *\/\r\n --light-bg: #eef6fe;\r\n --dark: #0b2b44;\r\n --white: #ffffff;\r\n --transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n }\r\n \r\n .myt-slider-container {\r\n position: relative;\r\n width: 100%;\r\n height: 680px;\r\n overflow: hidden;\r\n font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;\r\n background: #000; \/* fallback *\/\r\n }\r\n \r\n .myt-slider-wrapper {\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n \r\n .myt-slide {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n opacity: 0;\r\n transform: translateX(100%);\r\n transition: var(--transition);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n overflow: hidden;\r\n }\r\n \r\n .myt-slide.active {\r\n opacity: 1;\r\n transform: translateX(0);\r\n z-index: 1;\r\n }\r\n \r\n .myt-slide.prev {\r\n transform: translateX(-100%);\r\n opacity: 0;\r\n }\r\n \r\n .myt-slide-image {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n filter: brightness(0.75) contrast(1.05);\r\n }\r\n \r\n .myt-slide-content {\r\n position: relative;\r\n z-index: 2;\r\n max-width: 1200px;\r\n width: 90%;\r\n padding: 40px;\r\n color: var(--white);\r\n text-align: center;\r\n }\r\n \r\n .myt-slide-badge {\r\n display: inline-block;\r\n background: rgba(10, 102, 194, 0.25);\r\n backdrop-filter: blur(12px);\r\n -webkit-backdrop-filter: blur(12px);\r\n padding: 10px 24px;\r\n border-radius: 40px;\r\n font-size: 14px;\r\n font-weight: 700;\r\n letter-spacing: 1.2px;\r\n text-transform: uppercase;\r\n margin-bottom: 25px;\r\n border: 1px solid rgba(255, 255, 255, 0.4);\r\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\r\n }\r\n \r\n .myt-slide-title {\r\n font-size: 56px;\r\n font-weight: 800;\r\n line-height: 1.1;\r\n margin: 0 0 20px 0;\r\n text-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);\r\n }\r\n \r\n .myt-slide-title span {\r\n color: var(--secondary); \/* lighter blue accent *\/\r\n }\r\n \r\n .myt-slide-desc {\r\n font-size: 20px;\r\n line-height: 1.6;\r\n max-width: 700px;\r\n margin: 0 auto 35px;\r\n opacity: 0.96;\r\n text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);\r\n font-weight: 500;\r\n }\r\n \r\n \/* BUTTONS \u2013 PURE BLUE STYLE (same design, blue instead of orange) *\/\r\n .myt-slide-cta {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 12px;\r\n background: var(--primary);\r\n color: var(--white);\r\n padding: 16px 38px;\r\n border-radius: 60px;\r\n font-size: 18px;\r\n font-weight: 700;\r\n text-decoration: none;\r\n transition: var(--transition);\r\n border: 2px solid transparent;\r\n box-shadow: 0 12px 28px rgba(10, 102, 194, 0.4);\r\n letter-spacing: 0.3px;\r\n cursor: pointer;\r\n }\r\n \r\n .myt-slide-cta:hover {\r\n background: var(--white);\r\n color: var(--primary);\r\n transform: translateY(-4px);\r\n box-shadow: 0 18px 32px rgba(10, 102, 194, 0.5);\r\n border-color: rgba(10, 102, 194, 0.2);\r\n }\r\n \r\n .myt-slide-cta svg {\r\n width: 20px;\r\n height: 20px;\r\n stroke: currentColor;\r\n transition: var(--transition);\r\n }\r\n \r\n .myt-slide-cta:hover svg {\r\n transform: translateX(6px);\r\n }\r\n \r\n \/* Navigation arrows (glassmorphic white, unchanged elegant style) *\/\r\n .myt-slider-nav {\r\n position: absolute;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n width: 56px;\r\n height: 56px;\r\n background: rgba(255, 255, 255, 0.18);\r\n backdrop-filter: blur(12px);\r\n -webkit-backdrop-filter: blur(12px);\r\n border: 1px solid rgba(255, 255, 255, 0.35);\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n cursor: pointer;\r\n transition: var(--transition);\r\n z-index: 10;\r\n outline: none;\r\n }\r\n \r\n .myt-slider-nav:hover {\r\n background: rgba(255, 255, 255, 0.35);\r\n transform: translateY(-50%) scale(1.08);\r\n }\r\n \r\n .myt-slider-nav.prev {\r\n left: 30px;\r\n }\r\n \r\n .myt-slider-nav.next {\r\n right: 30px;\r\n }\r\n \r\n .myt-slider-nav svg {\r\n width: 26px;\r\n height: 26px;\r\n stroke: var(--white);\r\n stroke-width: 2.2;\r\n }\r\n \r\n .myt-slider-dots {\r\n position: absolute;\r\n bottom: 40px;\r\n left: 0;\r\n right: 0;\r\n display: flex;\r\n justify-content: center;\r\n gap: 14px;\r\n z-index: 10;\r\n }\r\n \r\n .myt-slider-dot {\r\n width: 11px;\r\n height: 11px;\r\n background: rgba(255, 255, 255, 0.5);\r\n border-radius: 50%;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n border: none;\r\n padding: 0;\r\n }\r\n \r\n .myt-slider-dot.active {\r\n background: var(--white);\r\n transform: scale(1.2);\r\n width: 12px;\r\n height: 12px;\r\n background: #ffffff;\r\n box-shadow: 0 0 8px rgba(255,255,255,0.8);\r\n }\r\n \r\n \/* responsive (same breakpoints, untouched) *\/\r\n @media (max-width: 1024px) {\r\n .myt-slider-container { height: 560px; }\r\n .myt-slide-title { font-size: 46px; }\r\n .myt-slide-desc { font-size: 18px; }\r\n .myt-slider-nav { width: 50px; height: 50px; }\r\n .myt-slider-nav.prev { left: 20px; }\r\n .myt-slider-nav.next { right: 20px; }\r\n .myt-slider-nav svg { width: 22px; height: 22px; }\r\n }\r\n \r\n @media (max-width: 768px) {\r\n .myt-slider-container { height: 500px; }\r\n .myt-slide-content { padding: 30px 25px; }\r\n .myt-slide-title { font-size: 36px; }\r\n .myt-slide-desc { font-size: 17px; margin-bottom: 30px; }\r\n .myt-slide-cta { padding: 14px 28px; font-size: 16px; gap: 8px; }\r\n .myt-slider-nav { width: 44px; height: 44px; display: none; }\r\n .myt-slider-dots { bottom: 30px; gap: 10px; }\r\n }\r\n \r\n @media (max-width: 480px) {\r\n .myt-slider-container { height: 440px; }\r\n .myt-slide-content { padding: 25px 20px; }\r\n .myt-slide-title { font-size: 30px; margin-bottom: 15px; }\r\n .myt-slide-desc { font-size: 15px; margin-bottom: 25px; }\r\n .myt-slide-badge { padding: 7px 18px; font-size: 11px; margin-bottom: 15px; }\r\n .myt-slide-cta { padding: 12px 24px; font-size: 15px; gap: 8px; }\r\n .myt-slider-dots { bottom: 25px; gap: 8px; }\r\n .myt-slider-dot { width: 8px; height: 8px; }\r\n .myt-slider-dot.active { width: 9px; height: 9px; }\r\n }\r\n \r\n @media (max-width: 360px) {\r\n .myt-slider-container { height: 400px; }\r\n .myt-slide-title { font-size: 26px; }\r\n .myt-slide-desc { font-size: 14px; }\r\n .myt-slide-cta { padding: 10px 20px; font-size: 14px; }\r\n }\r\n <\/style>\r\n\r\n <div class=\"myt-slider-container\" aria-label=\"Tamazirt Surf Shop \u2013 Surf adventures slider\">\r\n <div class=\"myt-slider-wrapper\">\r\n \r\n \r\n <div class=\"myt-slide active\" data-slide=\"1\">\r\n <img decoding=\"async\" class=\"myt-slide-image\" \r\n src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.12-1.jpeg\"\r\n alt=\"Surf session with Tamazirt Surf School \u2013 wave riding\">\r\n <div class=\"myt-slide-content\">\r\n <div class=\"myt-slide-badge\">\ud83c\udfc4\u200d\u2642\ufe0f Tamazirt Surf Shop School<\/div>\r\n <h1 class=\"myt-slide-title\">Ride the <span>Atlantic Waves<\/span><\/h1>\r\n <p class=\"myt-slide-desc\">\r\n Experience authentic Moroccan surf culture. Professional coaching, premium gear, and the best lineups in Tamraght & Taghazout.\r\n <\/p>\r\n <a href=\"#\" class=\"myt-slide-cta\" id=\"surf-cta-1\">\r\n Let\u2019s Go Surfing!\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M14 5l7 7-7 7\"\/>\r\n <\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <div class=\"myt-slide\" data-slide=\"2\">\r\n <img decoding=\"async\" class=\"myt-slide-image\" \r\n src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.11-1.jpeg\"\r\n alt=\"Surfboards and golden hour at Tamazirt Surf School\">\r\n <div class=\"myt-slide-content\">\r\n <div class=\"myt-slide-badge\">\ud83c\udfc4\u200d\u2640\ufe0f Lessons & Rentals<\/div>\r\n <h1 class=\"myt-slide-title\">Catch Your <span>First Wave<\/span><\/h1>\r\n <p class=\"myt-slide-desc\">\r\n Beginners to pros: daily surf lessons, board rental, and unforgettable group camps. Safe, fun, and all levels welcome.\r\n <\/p>\r\n <a href=\"#\" class=\"myt-slide-cta\" id=\"surf-cta-2\">\r\n Let\u2019s Go Surfing!\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M14 5l7 7-7 7\"\/>\r\n <\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <div class=\"myt-slide\" data-slide=\"3\">\r\n <img decoding=\"async\" class=\"myt-slide-image\" \r\n src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.11.jpeg\"\r\n alt=\"Tamazirt Surf community and ocean view\">\r\n <div class=\"myt-slide-content\">\r\n <div class=\"myt-slide-badge\">\ud83c\udf0a Tamazirt Vibe<\/div>\r\n <h1 class=\"myt-slide-title\">Surf, Explore, <span>Repeat<\/span><\/h1>\r\n <p class=\"myt-slide-desc\">\r\n Join our surf shop & school for epic adventures, yoga sessions, and Berber hospitality. Your Moroccan surf journey starts now.\r\n <\/p>\r\n <a href=\"#\" class=\"myt-slide-cta\" id=\"surf-cta-3\">\r\n Let\u2019s Go Surfing!\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M14 5l7 7-7 7\"\/>\r\n <\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <button class=\"myt-slider-nav prev\" aria-label=\"Previous slide\">\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 19l-7-7 7-7\"\/>\r\n <\/svg>\r\n <\/button>\r\n <button class=\"myt-slider-nav next\" aria-label=\"Next slide\">\r\n <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"\/>\r\n <\/svg>\r\n <\/button>\r\n \r\n \r\n <div class=\"myt-slider-dots\">\r\n <div class=\"myt-slider-dot active\" data-slide=\"1\" aria-label=\"Go to slide 1\"><\/div>\r\n <div class=\"myt-slider-dot\" data-slide=\"2\" aria-label=\"Go to slide 2\"><\/div>\r\n <div class=\"myt-slider-dot\" data-slide=\"3\" aria-label=\"Go to slide 3\"><\/div>\r\n <\/div>\r\n <\/div>\r\n `;\r\n\r\n \/\/ ==================== SLIDER LOGIC (fully functional with smooth auto-play) ====================\r\n setTimeout(() => {\r\n const container = shadowRoot.querySelector('.myt-slider-container');\r\n const slides = shadowRoot.querySelectorAll('.myt-slide');\r\n const dots = shadowRoot.querySelectorAll('.myt-slider-dot');\r\n const prevBtn = shadowRoot.querySelector('.myt-slider-nav.prev');\r\n const nextBtn = shadowRoot.querySelector('.myt-slider-nav.next');\r\n \r\n let currentIdx = 0;\r\n let autoInterval;\r\n const total = slides.length;\r\n \r\n \/\/ helper: update active classes and dots\r\n function updateSliderUI() {\r\n slides.forEach((slide, i) => {\r\n slide.classList.remove('active', 'prev');\r\n if (i === currentIdx) {\r\n slide.classList.add('active');\r\n } else if (i === (currentIdx - 1 + total) % total) {\r\n slide.classList.add('prev');\r\n }\r\n });\r\n dots.forEach((dot, i) => {\r\n dot.classList.remove('active');\r\n if (i === currentIdx) dot.classList.add('active');\r\n });\r\n }\r\n \r\n function goToSlide(index) {\r\n currentIdx = (index + total) % total;\r\n updateSliderUI();\r\n resetAutoPlay();\r\n }\r\n \r\n function nextSlide() {\r\n currentIdx = (currentIdx + 1) % total;\r\n updateSliderUI();\r\n resetAutoPlay();\r\n }\r\n \r\n function prevSlide() {\r\n currentIdx = (currentIdx - 1 + total) % total;\r\n updateSliderUI();\r\n resetAutoPlay();\r\n }\r\n \r\n function startAutoPlay() {\r\n if (autoInterval) clearInterval(autoInterval);\r\n autoInterval = setInterval(() => {\r\n nextSlide();\r\n }, 6000);\r\n }\r\n \r\n function stopAutoPlay() {\r\n if (autoInterval) {\r\n clearInterval(autoInterval);\r\n autoInterval = null;\r\n }\r\n }\r\n \r\n function resetAutoPlay() {\r\n stopAutoPlay();\r\n startAutoPlay();\r\n }\r\n \r\n \/\/ attach event listeners for navigation\r\n if (prevBtn) prevBtn.addEventListener('click', (e) => {\r\n e.preventDefault();\r\n prevSlide();\r\n });\r\n if (nextBtn) nextBtn.addEventListener('click', (e) => {\r\n e.preventDefault();\r\n nextSlide();\r\n });\r\n \r\n dots.forEach(dot => {\r\n dot.addEventListener('click', () => {\r\n const slideNum = parseInt(dot.getAttribute('data-slide'), 10);\r\n if (!isNaN(slideNum)) goToSlide(slideNum - 1);\r\n });\r\n });\r\n \r\n \/\/ hover pause \/ resume\r\n if (container) {\r\n container.addEventListener('mouseenter', () => stopAutoPlay());\r\n container.addEventListener('mouseleave', () => startAutoPlay());\r\n \r\n \/\/ touch swipe (mobile)\r\n let touchStart = 0;\r\n let touchEnd = 0;\r\n container.addEventListener('touchstart', (e) => {\r\n touchStart = e.changedTouches[0].screenX;\r\n stopAutoPlay();\r\n }, { passive: true });\r\n container.addEventListener('touchend', (e) => {\r\n touchEnd = e.changedTouches[0].screenX;\r\n const diff = touchStart - touchEnd;\r\n if (Math.abs(diff) > 50) {\r\n if (diff > 0) nextSlide();\r\n else prevSlide();\r\n }\r\n startAutoPlay();\r\n });\r\n }\r\n \r\n \/\/ ========== UPDATE BUTTONS: open the specific link in the same page, no message, no confirmation ==========\r\n \/\/ Target link: https:\/\/tamazirtsurfshopschool.com\/surf-lessons-in-taghazout\/\r\n const targetBookingUrl = \"https:\/\/tamazirtsurfshopschool.com\/surf-lessons-in-taghazout\/\";\r\n \r\n \/\/ Select all CTA buttons inside shadow DOM and attach click handler that redirects without any popup\/message\r\n const allCtas = shadowRoot.querySelectorAll('.myt-slide-cta');\r\n allCtas.forEach(btn => {\r\n \/\/ Remove any existing inline click handlers if any, to avoid conflicts\r\n btn.removeEventListener('click', () => {});\r\n \/\/ Attach new click event\r\n btn.addEventListener('click', (e) => {\r\n e.preventDefault();\r\n \/\/ Open the exact same link in the same tab\/page (no confirm, no alert)\r\n window.location.href = targetBookingUrl;\r\n });\r\n });\r\n \r\n \/\/ Also, ensure that if the buttons are clicked via any bubbling, it still works.\r\n \/\/ (extra safety)\r\n const styleWrapper = shadowRoot.querySelector('.myt-slider-container');\r\n if (styleWrapper) {\r\n styleWrapper.addEventListener('click', (e) => {\r\n const cta = e.target.closest('.myt-slide-cta');\r\n if (cta) {\r\n e.preventDefault();\r\n window.location.href = targetBookingUrl;\r\n }\r\n });\r\n }\r\n \r\n \/\/ initialization\r\n updateSliderUI();\r\n startAutoPlay();\r\n }, 80);\r\n })();\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-15e8a7d e-con-full e-flex e-con e-parent\" data-id=\"15e8a7d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b484190 elementor-widget elementor-widget-html\" data-id=\"b484190\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Tamazirt Surf Shop School \u00b7 Surf Lessons & Premium Gear<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* ALL CLASSES RENAMED WITH UNIQUE PREFIX \"tss-\" TO AVOID CONFLICTS *\/\r\n \/* MAIN COLOR: OCEAN BLUE (#0a5c7a, #1e6b8f, #0a2f44) with orange accent (#E07A2C) *\/\r\n .tss-section {\r\n width: 100%;\r\n min-height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 1rem 1rem 2rem;\r\n background: #e8f0f5; \/* soft light blue background - ocean inspired *\/\r\n font-family: 'Poppins', sans-serif;\r\n color: #2b2b2b;\r\n box-sizing: border-box;\r\n }\r\n\r\n .tss-container {\r\n width: 100%;\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n align-items: center;\r\n gap: clamp(1.5rem, 4vw, 5rem);\r\n }\r\n\r\n \/* ===== LEFT VISUAL ===== *\/\r\n .tss-visual {\r\n position: relative;\r\n width: 100%;\r\n aspect-ratio: 1 \/ 1.1;\r\n max-width: 600px;\r\n margin: 0 auto;\r\n }\r\n\r\n .tss-main-photo {\r\n position: absolute;\r\n left: 25%;\r\n top: 6%;\r\n width: 58%;\r\n height: 64%;\r\n border-radius: 42% 42% 34% 34% \/ 20% 20% 22% 22%;\r\n background: #cbdde6;\r\n overflow: hidden;\r\n box-shadow: 0 20px 40px rgba(10, 92, 122, 0.35);\r\n z-index: 3;\r\n }\r\n\r\n .tss-main-photo img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n }\r\n\r\n .tss-small-photo {\r\n position: absolute;\r\n left: 3%;\r\n bottom: 16%;\r\n width: 42%;\r\n max-width: 240px;\r\n aspect-ratio: 1\/1;\r\n border-radius: 50%;\r\n border: 6px solid #fff;\r\n background: #cbdde6;\r\n overflow: hidden;\r\n box-shadow: 0 16px 40px rgba(10, 92, 122, 0.4);\r\n z-index: 4;\r\n }\r\n\r\n .tss-small-photo img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n }\r\n\r\n .tss-stat-card {\r\n position: absolute;\r\n left: 0;\r\n top: 18%;\r\n width: auto;\r\n min-width: 170px;\r\n background: #ffffff;\r\n border-radius: 0 0 24px 24px;\r\n padding: 0.7rem 1.2rem 0.7rem 1rem;\r\n box-shadow: 0 20px 38px rgba(10, 92, 122, 0.25);\r\n z-index: 5;\r\n display: flex;\r\n align-items: center;\r\n gap: 0.7rem;\r\n white-space: nowrap;\r\n }\r\n\r\n .tss-stat-icon {\r\n width: 2.2rem;\r\n height: 2.2rem;\r\n border-radius: 12px;\r\n background: #1e6b8f; \/* ocean blue instead of orange *\/\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n }\r\n\r\n .tss-stat-icon svg {\r\n width: 20px;\r\n height: 20px;\r\n fill: white;\r\n stroke: white;\r\n }\r\n\r\n .tss-stat-text-wrapper {\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n\r\n .tss-stat-number {\r\n font-size: 1.2rem;\r\n font-weight: 800;\r\n color: #1e6b8f; \/* ocean blue *\/\r\n line-height: 1.2;\r\n }\r\n\r\n .tss-stat-text {\r\n font-size: 0.7rem;\r\n font-weight: 600;\r\n color: #0a5c7a;\r\n letter-spacing: 0.3px;\r\n }\r\n\r\n .tss-mini-icon {\r\n position: absolute;\r\n left: 34%;\r\n bottom: 22%;\r\n width: 3.2rem;\r\n height: 3.2rem;\r\n border-radius: 16px;\r\n background: #1e6b8f; \/* ocean blue *\/\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-shadow: 0 16px 30px rgba(30, 107, 143, 0.45);\r\n z-index: 6;\r\n }\r\n\r\n .tss-mini-icon svg {\r\n width: 26px;\r\n height: 26px;\r\n fill: white;\r\n }\r\n\r\n .tss-dots-top {\r\n position: absolute;\r\n left: 38%;\r\n top: 12%;\r\n width: 4rem;\r\n height: 2.8rem;\r\n background-image: radial-gradient(#1e6b8f 2px, transparent 2px);\r\n background-size: 12px 12px;\r\n opacity: 0.4;\r\n z-index: 1;\r\n }\r\n\r\n .tss-dots-bottom {\r\n position: absolute;\r\n left: 5%;\r\n bottom: 10%;\r\n width: 5rem;\r\n height: 3.8rem;\r\n background-image: radial-gradient(#0a5c7a 2px, transparent 2px);\r\n background-size: 14px 14px;\r\n opacity: 0.3;\r\n z-index: 1;\r\n }\r\n\r\n .tss-ring-left {\r\n position: absolute;\r\n left: -4%;\r\n top: 38%;\r\n width: 4rem;\r\n height: 4rem;\r\n border: 2px dashed #1e6b8f; \/* ocean blue *\/\r\n border-right-color: transparent;\r\n border-top-color: transparent;\r\n border-radius: 50%;\r\n opacity: 0.4;\r\n z-index: 1;\r\n }\r\n \r\n \/* ===== RIGHT CONTENT ===== *\/\r\n .tss-content {\r\n width: 100%;\r\n max-width: 580px;\r\n margin-left: auto;\r\n }\r\n\r\n .tss-topline {\r\n font-size: clamp(0.7rem, 2vw, 0.9rem);\r\n font-weight: 700;\r\n color: #E07A2C; \/* orange accent for topline *\/\r\n letter-spacing: 0.1em;\r\n text-transform: uppercase;\r\n margin-bottom: 0.4rem;\r\n }\r\n\r\n .tss-topline span {\r\n color: #1e6b8f;\r\n margin-left: 0.4rem;\r\n letter-spacing: 0.2em;\r\n }\r\n\r\n .tss-title {\r\n font-size: clamp(1.8rem, 5.5vw, 3.2rem);\r\n font-weight: 800;\r\n line-height: 1.1;\r\n color: #0a2f44; \/* deep ocean blue *\/\r\n margin-bottom: 0.7rem;\r\n }\r\n\r\n .tss-desc {\r\n font-size: clamp(0.85rem, 2.2vw, 1rem);\r\n line-height: 1.6;\r\n color: #2c4a5e;\r\n font-weight: 400;\r\n margin-bottom: 1.5rem;\r\n max-width: 520px;\r\n }\r\n\r\n .tss-highlight {\r\n position: relative;\r\n background: #ffffff;\r\n border-radius: 1.8rem;\r\n padding: 1.5rem 1.2rem 1.2rem 5.5rem;\r\n margin-bottom: 1.8rem;\r\n border: 1px solid #cce3ed;\r\n box-shadow: 0 4px 12px rgba(10, 92, 122, 0.08);\r\n }\r\n\r\n .tss-highlight-left {\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n bottom: 0;\r\n width: 4.8rem;\r\n background: #1e6b8f; \/* ocean blue *\/\r\n border-radius: 1.8rem 0 0 1.8rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .tss-highlight-left svg {\r\n width: 2.2rem;\r\n height: 2.2rem;\r\n fill: white;\r\n stroke: white;\r\n stroke-width: 0.2;\r\n }\r\n\r\n .tss-highlight-text {\r\n font-size: 0.85rem;\r\n line-height: 1.5;\r\n color: #2c4a5e;\r\n font-weight: 500;\r\n }\r\n\r\n .tss-highlight-text b,\r\n .tss-desc b {\r\n color: #E07A2C; \/* orange accent for bold text *\/\r\n font-weight: 700;\r\n }\r\n\r\n \/* FEATURE LIST *\/\r\n .tss-feature-list {\r\n display: grid;\r\n grid-template-columns: repeat(2, 1fr);\r\n gap: 1rem 1.5rem;\r\n margin-bottom: 1.8rem;\r\n }\r\n\r\n .tss-feature {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.7rem;\r\n font-weight: 500;\r\n font-size: 0.9rem;\r\n color: #000000; \/* BLACK FONT for keywords *\/\r\n }\r\n\r\n .tss-dot {\r\n width: 1.7rem;\r\n height: 1.7rem;\r\n border-radius: 50%;\r\n background: #1e6b8f; \/* ocean blue *\/\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n box-shadow: 0 6px 12px rgba(30, 107, 143, 0.25);\r\n }\r\n\r\n .tss-dot svg {\r\n width: 14px;\r\n height: 14px;\r\n fill: white;\r\n stroke: white;\r\n stroke-width: 0.5;\r\n }\r\n\r\n .tss-btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n background: #E07A2C; \/* orange accent for button *\/\r\n color: white;\r\n font-weight: 700;\r\n font-size: 1rem;\r\n padding: 0.8rem 2rem;\r\n border-radius: 40px;\r\n text-decoration: none;\r\n box-shadow: 0 16px 28px rgba(224, 122, 44, 0.35);\r\n transition: 0.2s;\r\n white-space: nowrap;\r\n border: none;\r\n cursor: pointer;\r\n }\r\n\r\n .tss-btn:hover {\r\n background: #B95C1A;\r\n transform: translateY(-2px);\r\n }\r\n\r\n \/* ===== MOBILE OPTIMIZATION ===== *\/\r\n @media (max-width: 900px) {\r\n .tss-container {\r\n grid-template-columns: 1fr;\r\n max-width: 620px;\r\n }\r\n\r\n .tss-visual {\r\n aspect-ratio: 1 \/ 1.15;\r\n max-width: 520px;\r\n margin: 0 auto 0.5rem;\r\n }\r\n\r\n .tss-main-photo {\r\n left: 20%;\r\n top: 3%;\r\n width: 64%;\r\n height: 70%;\r\n }\r\n\r\n .tss-small-photo {\r\n left: 2%;\r\n bottom: 12%;\r\n width: 46%;\r\n }\r\n\r\n .tss-mini-icon {\r\n left: 32%;\r\n bottom: 18%;\r\n width: 3.4rem;\r\n height: 3.4rem;\r\n }\r\n\r\n .tss-stat-card {\r\n padding: 0.6rem 1rem;\r\n gap: 0.6rem;\r\n min-width: 160px;\r\n }\r\n\r\n .tss-content {\r\n margin: 0 auto;\r\n max-width: 540px;\r\n padding: 0 0.5rem;\r\n }\r\n }\r\n\r\n @media (max-width: 600px) {\r\n .tss-section {\r\n padding: 0.8rem 0.8rem 1.5rem;\r\n }\r\n\r\n .tss-visual {\r\n aspect-ratio: 1 \/ 1.25;\r\n max-width: 100%;\r\n }\r\n\r\n .tss-main-photo {\r\n left: 16%;\r\n top: 1%;\r\n width: 70%;\r\n height: 74%;\r\n }\r\n\r\n .tss-small-photo {\r\n left: 0%;\r\n bottom: 10%;\r\n width: 48%;\r\n border-width: 5px;\r\n }\r\n\r\n .tss-mini-icon {\r\n left: 28%;\r\n bottom: 16%;\r\n width: 3.2rem;\r\n height: 3.2rem;\r\n }\r\n\r\n .tss-stat-card {\r\n padding: 0.5rem 0.9rem;\r\n gap: 0.5rem;\r\n top: 16%;\r\n }\r\n\r\n .tss-stat-icon {\r\n width: 2rem;\r\n height: 2rem;\r\n }\r\n\r\n .tss-stat-number {\r\n font-size: 1rem;\r\n }\r\n\r\n .tss-stat-text {\r\n font-size: 0.6rem;\r\n }\r\n\r\n .tss-highlight {\r\n padding: 1.4rem 1rem 1rem 5rem;\r\n }\r\n\r\n .tss-highlight-left {\r\n width: 4.2rem;\r\n }\r\n\r\n .tss-highlight-left svg {\r\n width: 2rem;\r\n height: 2rem;\r\n }\r\n\r\n .tss-highlight-text {\r\n font-size: 0.78rem;\r\n }\r\n\r\n .tss-feature-list {\r\n grid-template-columns: 1fr;\r\n gap: 0.7rem;\r\n }\r\n\r\n .tss-feature {\r\n font-size: 0.85rem;\r\n }\r\n\r\n .tss-btn {\r\n width: 100%;\r\n padding: 0.8rem 1rem;\r\n }\r\n }\r\n\r\n @media (max-width: 400px) {\r\n .tss-visual {\r\n aspect-ratio: 1 \/ 1.3;\r\n }\r\n .tss-main-photo {\r\n left: 12%;\r\n width: 76%;\r\n height: 76%;\r\n }\r\n .tss-small-photo {\r\n width: 50%;\r\n bottom: 8%;\r\n }\r\n .tss-mini-icon {\r\n left: 26%;\r\n bottom: 14%;\r\n }\r\n .tss-highlight {\r\n padding: 1.4rem 0.9rem 0.9rem 4.2rem;\r\n }\r\n .tss-highlight-left {\r\n width: 3.8rem;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <section class=\"tss-section\">\r\n <div class=\"tss-container\">\r\n\r\n \r\n <div class=\"tss-visual\">\r\n <div class=\"tss-dots-top\"><\/div>\r\n <div class=\"tss-dots-bottom\"><\/div>\r\n <div class=\"tss-ring-left\"><\/div>\r\n\r\n \r\n <div class=\"tss-stat-card\">\r\n <div class=\"tss-stat-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 3L14.2 7.5L19 8.2L15.5 11.6L16.3 16.4L12 14.1L7.7 16.4L8.5 11.6L5 8.2L9.8 7.5L12 3Z\" fill=\"white\" stroke=\"white\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"tss-stat-text-wrapper\">\r\n <div class=\"tss-stat-number\">+1,280+<\/div>\r\n <div class=\"tss-stat-text\">Happy surfers<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-main-photo\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.09-3.jpeg\" alt=\"Surf instructor teaching at Tamazirt Surf Shop School Taghazout\">\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-small-photo\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.09-2.jpeg\" alt=\"Surfboards and premium gear at Tamazirt Surf Shop Morocco\">\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-mini-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M2 12C2 6.48 6.48 2 12 2s10 4.48 10 10-4.48 10-10 10S2 17.52 2 12zm10-6c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-content\">\r\n <div class=\"tss-topline\">Tamazirt Surf Shop School <span>\u2726 \u2726 \u2726 \u2726<\/span><\/div>\r\n\r\n <h1 class=\"tss-title\">Surf Lessons &<br> Premium Gear in Taghazout<\/h1>\r\n\r\n <p class=\"tss-desc\">\r\n <b>Tamazirt Surf Shop School<\/b> offers expert <b>surf lessons for all levels<\/b>, \r\n premium <b>board rentals & wetsuits<\/b>, and unforgettable <b>surf adventures<\/b> along Morocco's \r\n Atlantic coast. Experience authentic Taghazout surf culture with certified local instructors.\r\n <\/p>\r\n\r\n \r\n <div class=\"tss-highlight\">\r\n <div class=\"tss-highlight-left\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"tss-highlight-text\">\r\n <b>Personalized surf coaching & small groups<\/b> with certified instructors. \r\n Enjoy <b>video analysis, safety training, and local spot knowledge<\/b> \u2014 \r\n from beginner friendly waves to advanced reef breaks like Anchor Point.\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"tss-feature-list\">\r\n <div class=\"tss-feature\">\r\n <span class=\"tss-dot\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/span>\r\n Beginner surf lessons\r\n <\/div>\r\n <div class=\"tss-feature\">\r\n <span class=\"tss-dot\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/span>\r\n Advanced coaching\r\n <\/div>\r\n <div class=\"tss-feature\">\r\n <span class=\"tss-dot\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/span>\r\n Surfboard & wetsuit rental\r\n <\/div>\r\n <div class=\"tss-feature\">\r\n <span class=\"tss-dot\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/span>\r\n Surf camps & guiding\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/surf-lessons-in-taghazout\/\" class=\"tss-btn\">Book Now \u2192<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8dacf1f e-con-full e-flex e-con e-parent\" data-id=\"8dacf1f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3a41c51 elementor-widget elementor-widget-html\" data-id=\"3a41c51\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Tamazirt & Surf Shop School \u00b7 Premium Surf Services<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700;14..32,800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'Inter', sans-serif;\r\n background: #ffffff;\r\n }\r\n\r\n \/* Features Section - NO BACKGROUND *\/\r\n .features-section {\r\n width: 100%;\r\n background: transparent; \/* No background *\/\r\n padding: 5rem 2rem;\r\n }\r\n\r\n .features-container {\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n }\r\n\r\n \/* Section Header *\/\r\n .section-header {\r\n text-align: center;\r\n margin-bottom: 4rem;\r\n }\r\n\r\n .section-header h2 {\r\n font-size: clamp(2rem, 5vw, 2.8rem);\r\n font-weight: 800;\r\n color: #0a2f44;\r\n margin-bottom: 0.75rem;\r\n letter-spacing: -0.02em;\r\n }\r\n\r\n .section-header p {\r\n font-size: 1.1rem;\r\n color: #4a6f86;\r\n max-width: 580px;\r\n margin: 0 auto;\r\n }\r\n\r\n .section-header .divider {\r\n width: 70px;\r\n height: 3px;\r\n background: #E07A2C;\r\n margin: 1rem auto 0;\r\n border-radius: 3px;\r\n }\r\n\r\n \/* Feature Item *\/\r\n .feature-item {\r\n display: flex;\r\n align-items: center;\r\n gap: 4rem;\r\n margin-bottom: 5rem;\r\n background: transparent; \/* No background *\/\r\n border-radius: 2rem;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-item:last-child {\r\n margin-bottom: 0;\r\n }\r\n\r\n \/* Image Container with Professional Frame (Cadre) *\/\r\n .feature-image {\r\n flex: 1;\r\n position: relative;\r\n border-radius: 1.5rem;\r\n overflow: hidden;\r\n box-shadow: 0 20px 35px -12px rgba(0, 0, 0, 0.15);\r\n transition: transform 0.4s ease, box-shadow 0.4s ease;\r\n }\r\n\r\n .feature-image:hover {\r\n transform: translateY(-6px);\r\n box-shadow: 0 25px 40px -12px rgba(0, 0, 0, 0.25);\r\n }\r\n\r\n .feature-image img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n transition: transform 0.5s ease;\r\n }\r\n\r\n .feature-image:hover img {\r\n transform: scale(1.03);\r\n }\r\n\r\n \/* Professional Frame (Cadre) - Double border effect *\/\r\n .feature-image::before {\r\n content: '';\r\n position: absolute;\r\n top: 1rem;\r\n left: 1rem;\r\n right: 1rem;\r\n bottom: 1rem;\r\n border: 1.5px solid rgba(255, 255, 255, 0.5);\r\n border-radius: 1rem;\r\n z-index: 2;\r\n pointer-events: none;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-image::after {\r\n content: '';\r\n position: absolute;\r\n top: 0.5rem;\r\n left: 0.5rem;\r\n right: 0.5rem;\r\n bottom: 0.5rem;\r\n border: 1px solid rgba(224, 122, 44, 0.7);\r\n border-radius: 1.2rem;\r\n z-index: 2;\r\n pointer-events: none;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-image:hover::before {\r\n top: 0.8rem;\r\n left: 0.8rem;\r\n right: 0.8rem;\r\n bottom: 0.8rem;\r\n border-color: rgba(255, 255, 255, 0.8);\r\n }\r\n\r\n .feature-image:hover::after {\r\n top: 0.3rem;\r\n left: 0.3rem;\r\n right: 0.3rem;\r\n bottom: 0.3rem;\r\n border-color: #E07A2C;\r\n }\r\n\r\n \/* Content Area *\/\r\n .feature-content {\r\n flex: 1;\r\n padding: 1rem;\r\n }\r\n\r\n \/* Category Badge - BOLD with different color *\/\r\n .feature-category {\r\n display: inline-block;\r\n font-size: 0.9rem;\r\n font-weight: 800; \/* EXTRA BOLD *\/\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n margin-bottom: 1rem;\r\n padding: 0.3rem 0.8rem;\r\n border-radius: 50px;\r\n }\r\n\r\n \/* Different colors for each category - BOLD keywords *\/\r\n .feature-item:nth-child(1) .feature-category {\r\n color: #E07A2C;\r\n background: rgba(224, 122, 44, 0.12);\r\n }\r\n \r\n .feature-item:nth-child(2) .feature-category {\r\n color: #2C7A5E;\r\n background: rgba(44, 122, 94, 0.12);\r\n }\r\n \r\n .feature-item:nth-child(3) .feature-category {\r\n color: #3A86FF;\r\n background: rgba(58, 134, 255, 0.12);\r\n }\r\n\r\n \/* Title *\/\r\n .feature-title {\r\n font-size: clamp(1.8rem, 4vw, 2.4rem);\r\n font-weight: 800;\r\n color: #0a2f44;\r\n margin-bottom: 1.25rem;\r\n line-height: 1.3;\r\n letter-spacing: -0.01em;\r\n }\r\n\r\n \/* Description with BOLD keywords *\/\r\n .feature-description {\r\n font-size: 1rem;\r\n line-height: 1.6;\r\n color: #4a5568;\r\n margin-bottom: 1.75rem;\r\n }\r\n \r\n \/* Make important keywords BOLD with different colors *\/\r\n .feature-description strong {\r\n font-weight: 800;\r\n color: #E07A2C;\r\n }\r\n \r\n \/* Specific keyword styling *\/\r\n .keyword-bold {\r\n font-weight: 800;\r\n color: #E07A2C;\r\n }\r\n\r\n \/* Button *\/\r\n .feature-btn {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 0.6rem;\r\n background: transparent;\r\n color: #E07A2C;\r\n font-weight: 700;\r\n font-size: 0.95rem;\r\n padding: 0.8rem 1.8rem;\r\n border-radius: 50px;\r\n text-decoration: none;\r\n transition: all 0.3s ease;\r\n border: 2px solid #E07A2C;\r\n cursor: pointer;\r\n }\r\n\r\n .feature-btn:hover {\r\n background: #E07A2C;\r\n color: white;\r\n transform: translateX(5px);\r\n }\r\n\r\n .feature-btn svg {\r\n width: 18px;\r\n height: 18px;\r\n fill: currentColor;\r\n transition: transform 0.2s;\r\n }\r\n\r\n .feature-btn:hover svg {\r\n transform: translateX(3px);\r\n }\r\n\r\n \/* Alternating Layout *\/\r\n .feature-item.reverse {\r\n flex-direction: row-reverse;\r\n }\r\n\r\n \/* ========== OPTIMIZED MOBILE RESPONSIVE ========== *\/\r\n @media (max-width: 1024px) {\r\n .features-section {\r\n padding: 4rem 1.8rem;\r\n }\r\n .feature-item {\r\n gap: 2.5rem;\r\n }\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .feature-item {\r\n flex-direction: column !important;\r\n gap: 2rem;\r\n margin-bottom: 4rem;\r\n background: transparent;\r\n }\r\n \r\n .feature-image {\r\n width: 100%;\r\n max-width: 100%;\r\n margin: 0 auto;\r\n }\r\n \r\n .feature-content {\r\n text-align: left;\r\n padding: 0;\r\n width: 100%;\r\n }\r\n \r\n .feature-category {\r\n display: inline-block;\r\n font-size: 0.85rem;\r\n }\r\n \r\n .feature-title {\r\n font-size: 1.7rem;\r\n margin-bottom: 1rem;\r\n }\r\n \r\n .feature-description {\r\n font-size: 0.98rem;\r\n line-height: 1.55;\r\n margin-bottom: 1.5rem;\r\n }\r\n \r\n .feature-btn {\r\n display: inline-flex;\r\n margin: 0;\r\n }\r\n \r\n \/* Keep frames on mobile but simpler for performance *\/\r\n .feature-image::before,\r\n .feature-image::after {\r\n display: none;\r\n }\r\n }\r\n\r\n @media (max-width: 680px) {\r\n .features-section {\r\n padding: 2.5rem 1.2rem;\r\n }\r\n \r\n .feature-item {\r\n margin-bottom: 3rem;\r\n gap: 1.5rem;\r\n }\r\n \r\n .feature-title {\r\n font-size: 1.5rem;\r\n }\r\n \r\n .feature-description {\r\n font-size: 0.92rem;\r\n line-height: 1.5;\r\n }\r\n \r\n .feature-category {\r\n font-size: 0.8rem;\r\n padding: 0.25rem 0.7rem;\r\n margin-bottom: 0.75rem;\r\n }\r\n \r\n .feature-btn {\r\n padding: 0.7rem 1.5rem;\r\n font-size: 0.9rem;\r\n }\r\n \r\n .section-header {\r\n margin-bottom: 2.5rem;\r\n }\r\n \r\n .section-header h2 {\r\n font-size: 1.8rem;\r\n }\r\n \r\n .section-header p {\r\n font-size: 0.95rem;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .features-section {\r\n padding: 2rem 1rem;\r\n }\r\n \r\n .feature-title {\r\n font-size: 1.35rem;\r\n }\r\n \r\n .feature-description {\r\n font-size: 0.88rem;\r\n }\r\n \r\n .feature-category {\r\n font-size: 0.75rem;\r\n }\r\n \r\n .feature-btn {\r\n padding: 0.6rem 1.3rem;\r\n font-size: 0.85rem;\r\n }\r\n }\r\n\r\n \/* Animation on load *\/\r\n @keyframes fadeInUp {\r\n from {\r\n opacity: 0;\r\n transform: translateY(30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n .feature-item {\r\n animation: fadeInUp 0.6s ease forwards;\r\n opacity: 0;\r\n }\r\n\r\n .feature-item:nth-child(1) {\r\n animation-delay: 0.1s;\r\n }\r\n .feature-item:nth-child(2) {\r\n animation-delay: 0.2s;\r\n }\r\n .feature-item:nth-child(3) {\r\n animation-delay: 0.3s;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"features-section\">\r\n <div class=\"features-container\">\r\n \r\n <div class=\"section-header\">\r\n <h2>Experience the Atlantic Spirit<\/h2>\r\n <p>Premium surf & outdoor adventures in Taghazout<\/p>\r\n <div class=\"divider\"><\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-image\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.12.jpeg\" alt=\"Surf lessons in Taghazout with Tamazirt Surf Shop School\">\r\n <\/div>\r\n <div class=\"feature-content\">\r\n <div class=\"feature-category\">\ud83c\udfc4\u200d\u2642\ufe0f SURFING<\/div>\r\n <h3 class=\"feature-title\">Join Surf Lessons In Taghazout<\/h3>\r\n <p class=\"feature-description\">\r\n <strong>Learn to surf<\/strong> in Taghazout with <strong>trusted local instructors<\/strong>. From first rides to skill-building sessions, each lesson suits your level. Join <strong>small group classes<\/strong>, go <strong>one-on-one with private surf lessons<\/strong>, or let <strong>kids surf safely<\/strong>. Book your <strong>Taghazout surf experience<\/strong> now\u2014fun, friendly, and designed for all abilities.\r\n <\/p>\r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/surf-lessons-in-taghazout\/\" class=\"feature-btn\">\r\n Explore Surf Packages\r\n <svg viewbox=\"0 0 24 24\"><path d=\"M5 13h11.86l-3.63 4.36L14 18l6-6-6-6-1.77 1.64L16.86 11H5v2z\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item reverse\">\r\n <div class=\"feature-image\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.10.58.jpeg\" alt=\"Surfboard and SUP rentals in Taghazout\">\r\n <\/div>\r\n <div class=\"feature-content\">\r\n <div class=\"feature-category\">\ud83c\udfc4\u200d\u2640\ufe0f RENTALS<\/div>\r\n <h3 class=\"feature-title\">Rent a surfboard or stand-up paddleboard<\/h3>\r\n <p class=\"feature-description\">\r\n At <strong>Tamazirt Surf Shop<\/strong>, we've got the <strong>perfect board<\/strong> waiting for you\u2014whether you're just starting out or chasing the next big swell. From <strong>beginner-friendly surfboards<\/strong> to <strong>high-performance stand-up paddleboards<\/strong>, our rental selection suits every level. <strong>Book online now<\/strong> and get straight to the waves when you arrive.\r\n <\/p>\r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/surf-rentals\/\" class=\"feature-btn\">\r\n Zarezerwuj teraz\r\n <svg viewbox=\"0 0 24 24\"><path d=\"M5 13h11.86l-3.63 4.36L14 18l6-6-6-6-1.77 1.64L16.86 11H5v2z\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-image\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/taghazout-activities-camel-hose-sable-2-850x540-1.webp\" alt=\"Outdoor activities in Taghazout Paradise Valley and sandboarding\">\r\n <\/div>\r\n <div class=\"feature-content\">\r\n <div class=\"feature-category\">\ud83c\udf04 ACTIVITIES<\/div>\r\n <h3 class=\"feature-title\">Join unforgettable outdoor activities<\/h3>\r\n <p class=\"feature-description\">\r\n There's <strong>more to Taghazout than surfing<\/strong> \u2014 let us show you the magic. From <strong>peaceful walks through Paradise Valley<\/strong> to the <strong>golden dunes of Timlalin<\/strong> and exciting <strong>sandboarding experiences<\/strong>, each trip is guided with care. Travel in style with <strong>air-conditioned transport<\/strong> and <strong>friendly local guides<\/strong>. Discover, explore, and make memories \u2014 <strong>book your trip with us now<\/strong>.\r\n <\/p>\r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/activities\/\" class=\"feature-btn\">\r\n Explore now\r\n <svg viewbox=\"0 0 24 24\"><path d=\"M5 13h11.86l-3.63 4.36L14 18l6-6-6-6-1.77 1.64L16.86 11H5v2z\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-95741f5 e-con-full e-flex e-con e-parent\" data-id=\"95741f5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-086b35f elementor-widget elementor-widget-html\" data-id=\"086b35f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Tamazirt Surf Shop & School \u00b7 Taghazout Morocco<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700;14..32,800;14..32,900&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n \/* Full Width Banner Section with Fixed Background - Reduced Height *\/\r\n .hero-banner {\r\n position: relative;\r\n width: 100%;\r\n height: 85vh;\r\n min-height: 550px;\r\n max-height: 700px;\r\n background-image: url('https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.12.jpeg');\r\n background-size: cover;\r\n background-position: center;\r\n background-attachment: fixed;\r\n background-repeat: no-repeat;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-family: 'Inter', sans-serif;\r\n overflow: hidden;\r\n }\r\n\r\n \/* Dark Overlay with Vibrant Ocean Blue *\/\r\n .hero-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: linear-gradient(135deg, rgba(10, 92, 122, 0.88) 0%, rgba(30, 107, 143, 0.82) 100%);\r\n z-index: 1;\r\n }\r\n\r\n \/* Content Container *\/\r\n .hero-content {\r\n position: relative;\r\n z-index: 2;\r\n max-width: 900px;\r\n padding: 2rem;\r\n text-align: center;\r\n color: white;\r\n animation: fadeInUp 0.8s ease-out;\r\n }\r\n\r\n \/* Title with Gradient *\/\r\n .hero-title {\r\n font-size: clamp(2rem, 5vw, 3.8rem);\r\n font-weight: 900;\r\n margin-bottom: 0.75rem;\r\n line-height: 1.2;\r\n letter-spacing: -0.02em;\r\n background: linear-gradient(135deg, #ffffff 60%, #E07A2C 100%);\r\n -webkit-background-clip: text;\r\n background-clip: text;\r\n color: transparent;\r\n }\r\n\r\n \/* Subtitle \/ Tagline *\/\r\n .hero-subtitle {\r\n font-size: clamp(1rem, 2.5vw, 1.2rem);\r\n font-weight: 600;\r\n margin-bottom: 1.2rem;\r\n color: rgba(255, 255, 255, 0.95);\r\n letter-spacing: -0.01em;\r\n }\r\n\r\n \/* Description Text - Exactly 3 Lines *\/\r\n .hero-description {\r\n font-size: clamp(0.9rem, 2vw, 1rem);\r\n line-height: 1.5;\r\n margin-bottom: 2rem;\r\n max-width: 700px;\r\n margin-left: auto;\r\n margin-right: auto;\r\n color: rgba(255, 255, 255, 0.92);\r\n font-weight: 400;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 3;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n }\r\n\r\n \/* CTA Button *\/\r\n .hero-btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 0.8rem;\r\n background: transparent;\r\n color: white;\r\n font-weight: 700;\r\n font-size: 1rem;\r\n padding: 0.85rem 2.2rem;\r\n border-radius: 50px;\r\n text-decoration: none;\r\n transition: all 0.3s ease;\r\n border: 2px solid #E07A2C;\r\n cursor: pointer;\r\n letter-spacing: 0.5px;\r\n }\r\n\r\n .hero-btn:hover {\r\n background: #E07A2C;\r\n color: white;\r\n transform: translateY(-3px);\r\n box-shadow: 0 15px 30px rgba(224, 122, 44, 0.3);\r\n border-color: #E07A2C;\r\n }\r\n\r\n .hero-btn svg {\r\n width: 18px;\r\n height: 18px;\r\n fill: currentColor;\r\n transition: transform 0.2s;\r\n }\r\n\r\n .hero-btn:hover svg {\r\n transform: translateX(5px);\r\n }\r\n\r\n \/* Fade In Up Animation *\/\r\n @keyframes fadeInUp {\r\n from {\r\n opacity: 0;\r\n transform: translateY(40px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n \/* Responsive Design *\/\r\n @media (max-width: 1024px) {\r\n .hero-banner {\r\n height: 80vh;\r\n min-height: 500px;\r\n max-height: 650px;\r\n }\r\n .hero-content {\r\n padding: 1.5rem;\r\n }\r\n .hero-description {\r\n max-width: 600px;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .hero-banner {\r\n height: auto;\r\n min-height: 480px;\r\n background-attachment: scroll; \/* Better performance on mobile *\/\r\n }\r\n .hero-content {\r\n padding: 1.5rem;\r\n }\r\n .hero-description {\r\n margin-bottom: 1.8rem;\r\n -webkit-line-clamp: 3;\r\n }\r\n .hero-btn {\r\n padding: 0.75rem 1.8rem;\r\n font-size: 0.95rem;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .hero-banner {\r\n min-height: 450px;\r\n }\r\n .hero-description {\r\n font-size: 0.85rem;\r\n line-height: 1.5;\r\n }\r\n .hero-btn {\r\n padding: 0.7rem 1.6rem;\r\n font-size: 0.9rem;\r\n }\r\n .hero-title {\r\n margin-bottom: 0.5rem;\r\n }\r\n .hero-subtitle {\r\n margin-bottom: 1rem;\r\n }\r\n }\r\n\r\n \/* Smooth Scroll Behavior *\/\r\n html {\r\n scroll-behavior: smooth;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <section class=\"hero-banner\">\r\n <div class=\"hero-overlay\"><\/div>\r\n <div class=\"hero-content\">\r\n \r\n \r\n <h1 class=\"hero-title\">Tamazirt Surf Shop & School<\/h1>\r\n \r\n \r\n <p class=\"hero-subtitle\">Taghazout's Premier Surf Experience<\/p>\r\n \r\n \r\n <p class=\"hero-description\">\r\n Quality surfboard rentals, fun surf lessons in Taghazout, and a handpicked mix of locally crafted shirts and souvenirs. \r\n Whether you're a first-timer or chasing your next wave, we've got you covered. \r\n Come visit us, say hi, and dive into the surf spirit \u2014 no stress, just stoke.\r\n <\/p>\r\n \r\n \r\n <a href=\"https:\/\/tamazirtsurfshopschool.com\/pl\/surf-rentals\/\" class=\"hero-btn\">\r\n Visit Our Shop\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M5 13h11.86l-3.63 4.36L14 18l6-6-6-6-1.77 1.64L16.86 11H5v2z\"\/>\r\n <\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/section>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fa95ebe e-flex e-con-boxed e-con e-parent\" data-id=\"fa95ebe\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5fc88fd elementor-widget elementor-widget-shortcode\" data-id=\"5fc88fd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><pre class=\"ti-widget\"><template id=\"trustindex-google-widget-html\"><div class=\"ti-widget ti-goog ti-review-text-mode-readmore ti-text-align-left\" data-no-translation=\"true\" data-time-locale=\"%d %s ago|today|day|days|week|weeks|month|months|year|years\" data-plugin-version=\"13.2.8\" data-layout-id=\"34\" data-layout-category=\"slider\" data-set-id=\"light-background\" data-pid=\"\" data-language=\"en\" data-close-locale=\"Close\" data-review-target-width=\"300\" data-css-version=\"2\" data-reply-by-locale=\"Owner's reply\" data-only-rating-locale=\"This user only left a rating.\" data-pager-autoplay-timeout=\"6\"> <div class=\"ti-widget-container ti-col-3\"> <div class=\"ti-header ti-header-grid source-Google\"> <div class=\"ti-fade-container\"> <div class=\"ti-rating-text\"> <strong class=\"ti-rating ti-rating-large\"> EXCELLENT <\/strong> <\/div> <span class=\"ti-stars star-lg\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><\/span> <div class=\"ti-rating-text\"> <span class=\"nowrap\">Based on <strong>32 reviews<\/strong><\/span> <\/div> <div class=\"ti-large-logo\"> <div class=\"ti-v-center\"> <trustindex-image class=\"ti-logo-fb\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/logo.svg\" width=\"150\" height=\"25\" loading=\"lazy\" alt=\"Google\"><\/trustindex-image> <\/div> <\/div> <\/div> <\/div> <div class=\"ti-reviews-container\"> <div class=\"ti-controls\"> <div class=\"ti-next\" aria-label=\"Next review\" role=\"button\" tabindex=\"0\"><\/div> <div class=\"ti-prev\" aria-label=\"Previous review\" role=\"button\" tabindex=\"0\"><\/div> <\/div> <div class=\"ti-reviews-container-wrapper\"> <div data-empty=\"0\" data-time=\"1774742400\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocJP6fDBYzTp74SpQ3d_zrejZXkpVWvPqhepe0v8EPiihg20Ug=w40-h40-c-rp-mo-br100\" alt=\"School of Dough CIC profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> School of Dough CIC <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Surf hire - board and wetsuit during short stay in taghazout to recharge! Super friendly, excellent price and good choice of boards. Strongly recommend - big shout out! \ud83c\udfc4\u200d\u2642\ufe0f \ud83e\udd19<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774742400\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a-\/ALV-UjUjg2NSPP4-Wn7lG3vuVxcusZprnyLeNFvtl0GPfTNI-FmWfveU2A=w40-h40-c-rp-mo-br100\" alt=\"Madison Boles profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Madison Boles <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Such great people!<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774742400\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a-\/ALV-UjXc2nmOf7yeGW5jrs3ulLK8cRcV_IIC7LCV5iygFESN1AfpUPnt=w40-h40-c-rp-mo-br100\" alt=\"Emilia Di Paola profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Emilia Di Paola <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">What great service. If you need a board rental head over to tamazirt surf shop and school !<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774656000\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocI3_U4ph3xgD4H7V0eNHY-54gUF_pCz5OJ_OmFNrmnZ8leMRw=w40-h40-c-rp-mo-br100\" alt=\"Josse Bender profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Josse Bender <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Top Preis<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774483200\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocLprSyU-NDMt1W39eqwYWQSit15oXWJ2xjzKdLm-GYG3MYLqQ=w40-h40-c-rp-mo-br100\" alt=\"Helene Weichelt profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Helene Weichelt <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">It was so great, very friendly!<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774224000\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocKJZ1HZOdwu8h3YvCxlIcoV9kdpToBbDWEa9t9PKEXty8J9Ww=w40-h40-c-rp-mo-br100\" alt=\"jessica hart profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> jessica hart <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Beautiful little shop very reasonable prices. Well worth a visit \u263a\ufe0f<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1774137600\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocItLP4Hll_fN77BqZw5fOIOMwFWvdqdTUEFhb6efBM5y4zVdw=w40-h40-c-rp-mo-br100\" alt=\"Redwa Sunsurf profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> Redwa Sunsurf <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Guys i realy remember this shop it\u2019s super nice they have nice equipment for surf good boards and also instructure I had really good lessons I learned alot<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <div data-empty=\"0\" data-time=\"1773705600\" class=\"ti-review-item source-Google ti-image-layout-thumbnail\" data-id=\"cfcd208495d565ef66e7dff9f98764da\"> <div class=\"ti-inner\"> <div class=\"ti-review-header\"> <div class=\"ti-platform-icon ti-with-tooltip\"> <span class=\"ti-tooltip\">Posted on <\/span> <trustindex-image data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/icon.svg\" alt=\"\" width=\"20\" height=\"20\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-img\"> <trustindex-image data-imgurl=\"https:\/\/lh3.googleusercontent.com\/a\/ACg8ocKGKsaieMexY_E9aTTUYFO7slJtYoBQ_j_k0RW58lKWSv_Y7w=w40-h40-c-rp-mo-ba2-br100\" alt=\"alessandro solinas profile picture\" loading=\"lazy\"><\/trustindex-image> <\/div> <div class=\"ti-profile-details\"> <div class=\"ti-name\"> alessandro solinas <\/div> <div class=\"ti-date\"><\/div> <\/div> <\/div> <span class=\"ti-stars\"><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><trustindex-image class=\"ti-star\" data-imgurl=\"https:\/\/cdn.trustindex.io\/assets\/platform\/Google\/star\/f.svg\" alt=\"Google\" width=\"17\" height=\"17\" loading=\"lazy\"><\/trustindex-image><span class=\"ti-verified-review ti-verified-platform\"><span class=\"ti-verified-tooltip\">Trustindex verifies that the original source of the review is Google.<\/span><\/span><\/span> <div class=\"ti-review-text-container ti-review-content\">Il top per qualit\u00e0 e prezzo Karim e i suoi amici sono stati davvero disponibili e gentili le migliori tavole da surf ai migliori prezzi<\/div> <span class=\"ti-read-more\" data-container=\".ti-review-content\" data-collapse-text=\"Hide\" data-open-text=\"Read more\"><\/span> <\/div> <\/div> <\/div> <div class=\"ti-controls-line\"> <div class=\"dot\"><\/div> <\/div> <\/div> <div class=\"ti-verified-by ti-verified-by-row\" data-style=\"1\"> <div class=\"ti-inner\"> Verified by Trustindex <span class=\"ti-info-icon\"><\/span> <div class=\"ti-disclaimer\">Trustindex verified badge is the Universal Symbol of Trust. Only the greatest companies can get the verified badge who has a review score above 4.5, based on customer reviews over the past 12 months. <a href=\"https:\/\/www.trustindex.io\/?a=sys&c=wp-verified-badge&url=\/the-trustindex-verified-badge\/\" target=\"_blank\" rel=\"noopener\">Read more<\/a><\/div> <\/div> <\/div> <\/div> <\/div> <\/template><\/pre><div data-src=\"https:\/\/cdn.trustindex.io\/loader.js?wp-widget\" data-template-id=\"trustindex-google-widget-html\" data-css-url=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/trustindex-google-widget.css?1774876167\"><\/div><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1632805 e-con-full e-flex e-con e-parent\" data-id=\"1632805\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9ea62ad elementor-widget elementor-widget-html\" data-id=\"9ea62ad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Tamazirt Surf Shop & School \u00b7 Why Choose Us<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n .whyus-section {\r\n width: 100%;\r\n min-height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 5rem 2rem;\r\n background: #e8f0f5;\r\n font-family: 'Poppins', sans-serif;\r\n color: #2b2b2b;\r\n }\r\n\r\n .whyus-container {\r\n width: 100%;\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n align-items: center;\r\n gap: clamp(2rem, 5vw, 5rem);\r\n }\r\n\r\n \/* ===== LEFT SIDE - COLLAGE IMAGE DESIGN ===== *\/\r\n .whyus-collage {\r\n position: relative;\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n grid-template-rows: 1fr 1fr;\r\n gap: clamp(14px, 2vw, 22px);\r\n min-height: clamp(360px, 42vw, 520px);\r\n align-content: stretch;\r\n --badge-x: 50%;\r\n --badge-y: 50%;\r\n --badge-size: clamp(110px, 14vw, 150px);\r\n }\r\n\r\n .whyus-img-box {\r\n position: relative;\r\n overflow: hidden;\r\n box-shadow: 0 10px 25px rgba(224,122,44,.08);\r\n background: #cbdde6;\r\n transition: transform 0.3s ease;\r\n }\r\n\r\n .whyus-img-box:hover {\r\n transform: scale(1.02);\r\n }\r\n\r\n .whyus-img-box img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n transition: transform 0.5s ease;\r\n }\r\n\r\n .whyus-img-box:hover img {\r\n transform: scale(1.05);\r\n }\r\n\r\n .whyus-img-1 {\r\n grid-column: 1 \/ 2;\r\n grid-row: 1 \/ 2;\r\n border-radius: 120px 22px 22px 22px;\r\n }\r\n\r\n .whyus-img-3 {\r\n grid-column: 1 \/ 2;\r\n grid-row: 2 \/ 3;\r\n border-radius: 22px 22px 22px 120px;\r\n }\r\n\r\n .whyus-img-2 {\r\n grid-column: 2 \/ 3;\r\n grid-row: 1 \/ 3;\r\n border-radius: 22px;\r\n align-self: center;\r\n height: 86%;\r\n transform: translateY(2%);\r\n z-index: 1;\r\n }\r\n\r\n \/* Orange Ring *\/\r\n .whyus-ring {\r\n position: absolute;\r\n width: clamp(140px, 18vw, 200px);\r\n height: clamp(140px, 18vw, 200px);\r\n border-radius: 999px;\r\n border: clamp(12px, 1.4vw, 18px) solid #E07A2C;\r\n top: clamp(10px, 2vw, 18px);\r\n left: 56%;\r\n transform: translateX(-10%);\r\n z-index: 0;\r\n opacity: .8;\r\n }\r\n\r\n \/* Experience Badge *\/\r\n .whyus-exp-badge {\r\n position: absolute;\r\n width: var(--badge-size);\r\n height: var(--badge-size);\r\n border-radius: 999px;\r\n background: #0a2f44;\r\n color: #f39c12;\r\n display: grid;\r\n place-items: center;\r\n text-align: center;\r\n box-shadow: 0 18px 40px rgba(0,0,0,.20);\r\n border: 8px solid #fff;\r\n left: var(--badge-x);\r\n top: var(--badge-y);\r\n transform: translate(-50%, -50%);\r\n z-index: 4;\r\n }\r\n\r\n .whyus-exp-inner {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 6px;\r\n }\r\n\r\n .whyus-exp-badge .whyus-num {\r\n font-weight: 900;\r\n font-size: clamp(28px, 3.2vw, 42px);\r\n line-height: 1;\r\n margin: 0;\r\n color: #E07A2C;\r\n }\r\n\r\n .whyus-exp-badge .whyus-txt {\r\n margin: 0;\r\n font-weight: 900;\r\n font-size: clamp(11px, 1.2vw, 14px);\r\n line-height: 1.15;\r\n color: #f39c12;\r\n }\r\n\r\n \/* Dots Decoration *\/\r\n .whyus-dots-top {\r\n position: absolute;\r\n left: 30%;\r\n top: -5%;\r\n width: 4rem;\r\n height: 3rem;\r\n background-image: radial-gradient(#1e6b8f 2px, transparent 2px);\r\n background-size: 12px 12px;\r\n opacity: 0.4;\r\n z-index: 1;\r\n }\r\n\r\n .whyus-dots-bottom {\r\n position: absolute;\r\n left: 8%;\r\n bottom: -5%;\r\n width: 5rem;\r\n height: 4rem;\r\n background-image: radial-gradient(#0a5c7a 2px, transparent 2px);\r\n background-size: 14px 14px;\r\n opacity: 0.3;\r\n z-index: 1;\r\n }\r\n\r\n \/* ===== RIGHT SIDE - CONTENT ===== *\/\r\n .whyus-content {\r\n width: 100%;\r\n max-width: 580px;\r\n }\r\n\r\n .whyus-topline {\r\n font-size: clamp(0.7rem, 2vw, 0.9rem);\r\n font-weight: 700;\r\n color: #E07A2C;\r\n letter-spacing: 0.1em;\r\n text-transform: uppercase;\r\n margin-bottom: 0.5rem;\r\n }\r\n\r\n .whyus-title {\r\n font-size: clamp(2rem, 5vw, 3rem);\r\n font-weight: 800;\r\n line-height: 1.2;\r\n color: #0a2f44;\r\n margin-bottom: 1rem;\r\n }\r\n\r\n .whyus-subtitle {\r\n font-size: 1rem;\r\n line-height: 1.6;\r\n color: #2c4a5e;\r\n font-weight: 400;\r\n margin-bottom: 2rem;\r\n }\r\n\r\n \/* Features with Background *\/\r\n .features-list {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 1.2rem;\r\n }\r\n\r\n .feature-item {\r\n display: flex;\r\n gap: 1.2rem;\r\n align-items: flex-start;\r\n background: #ffffff;\r\n padding: 1.2rem 1.5rem;\r\n border-radius: 1.2rem;\r\n transition: all 0.3s ease;\r\n border: 1px solid rgba(30, 107, 143, 0.1);\r\n box-shadow: 0 4px 12px rgba(10, 92, 122, 0.05);\r\n }\r\n\r\n .feature-item:hover {\r\n transform: translateX(8px);\r\n border-color: rgba(224, 122, 44, 0.3);\r\n box-shadow: 0 8px 20px rgba(10, 92, 122, 0.1);\r\n }\r\n\r\n .feature-icon {\r\n flex-shrink: 0;\r\n width: 55px;\r\n height: 55px;\r\n background: linear-gradient(135deg, #0a2f44 0%, #1e6b8f 100%);\r\n border-radius: 18px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-item:hover .feature-icon {\r\n background: linear-gradient(135deg, #E07A2C 0%, #f39c12 100%);\r\n transform: scale(1.05);\r\n }\r\n\r\n .feature-icon svg {\r\n width: 28px;\r\n height: 28px;\r\n fill: white;\r\n }\r\n\r\n .feature-text {\r\n flex: 1;\r\n }\r\n\r\n .feature-text h3 {\r\n font-size: 1.2rem;\r\n font-weight: 700;\r\n color: #0a2f44;\r\n margin-bottom: 0.4rem;\r\n transition: color 0.3s ease;\r\n }\r\n\r\n .feature-item:hover .feature-text h3 {\r\n color: #E07A2C;\r\n }\r\n\r\n .feature-text p {\r\n font-size: 0.85rem;\r\n line-height: 1.5;\r\n color: #4a5b68;\r\n }\r\n\r\n \/* Responsive *\/\r\n @media (min-width: 981px) {\r\n .whyus-collage {\r\n min-height: 460px;\r\n }\r\n .whyus-img-2 {\r\n height: 78%;\r\n transform: translateY(6%);\r\n }\r\n }\r\n\r\n @media (max-width: 980px) {\r\n .whyus-container {\r\n grid-template-columns: 1fr;\r\n gap: 2.5rem;\r\n }\r\n .whyus-collage {\r\n max-width: 550px;\r\n margin: 0 auto;\r\n min-height: 420px;\r\n }\r\n .whyus-content {\r\n max-width: 100%;\r\n text-align: center;\r\n }\r\n .features-list {\r\n max-width: 550px;\r\n margin: 0 auto;\r\n }\r\n .feature-item {\r\n text-align: left;\r\n }\r\n }\r\n\r\n @media (max-width: 640px) {\r\n .whyus-section {\r\n padding: 3rem 1.2rem;\r\n }\r\n .whyus-collage {\r\n min-height: 380px;\r\n --badge-size: 122px;\r\n }\r\n .whyus-img-2 {\r\n height: 82%;\r\n }\r\n .whyus-ring {\r\n left: 58%;\r\n top: 8px;\r\n }\r\n .whyus-exp-badge {\r\n border-width: 6px;\r\n }\r\n .whyus-exp-badge .whyus-num {\r\n font-size: 36px;\r\n }\r\n .whyus-exp-badge .whyus-txt {\r\n font-size: 13px;\r\n }\r\n .feature-item {\r\n padding: 1rem;\r\n gap: 1rem;\r\n }\r\n .feature-icon {\r\n width: 45px;\r\n height: 45px;\r\n border-radius: 14px;\r\n }\r\n .feature-icon svg {\r\n width: 22px;\r\n height: 22px;\r\n }\r\n .feature-text h3 {\r\n font-size: 1rem;\r\n }\r\n .feature-text p {\r\n font-size: 0.8rem;\r\n }\r\n }\r\n\r\n \/* Animation *\/\r\n @keyframes fadeInLeft {\r\n from {\r\n opacity: 0;\r\n transform: translateX(-30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateX(0);\r\n }\r\n }\r\n\r\n @keyframes fadeInRight {\r\n from {\r\n opacity: 0;\r\n transform: translateX(30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateX(0);\r\n }\r\n }\r\n\r\n .whyus-collage {\r\n animation: fadeInLeft 0.6s ease-out forwards;\r\n }\r\n\r\n .whyus-content {\r\n animation: fadeInRight 0.6s ease-out forwards;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n <section class=\"whyus-section\">\r\n <div class=\"whyus-container\">\r\n\r\n \r\n <div class=\"whyus-collage\">\r\n <div class=\"whyus-ring\"><\/div>\r\n <div class=\"whyus-dots-top\"><\/div>\r\n <div class=\"whyus-dots-bottom\"><\/div>\r\n\r\n \r\n <div class=\"whyus-img-box whyus-img-1\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/sandboarding.jpg\" alt=\"Surf lesson at Tamazirt Surf Shop Taghazout\">\r\n <\/div>\r\n\r\n \r\n <div class=\"whyus-img-box whyus-img-2\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.05-1.jpeg\" alt=\"Premium surfboards at Tamazirt Surf Shop\">\r\n <\/div>\r\n\r\n \r\n <div class=\"whyus-img-box whyus-img-3\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.08.jpeg\" alt=\"Surfing experience Taghazout Morocco\">\r\n <\/div>\r\n\r\n \r\n <div class=\"whyus-exp-badge\">\r\n <div class=\"whyus-exp-inner\">\r\n <div class=\"whyus-num\">8+<\/div>\r\n <div class=\"whyus-txt\">Years of<br\/>Surf Excellence<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"whyus-content\">\r\n <div class=\"whyus-topline\">Why Choose Us<\/div>\r\n <h2 class=\"whyus-title\">The Tamazirt Surf Shop & School Difference<\/h2>\r\n <p class=\"whyus-subtitle\">\r\n Experience authentic Moroccan surf culture with passionate locals who live and breathe the ocean.\r\n <\/p>\r\n\r\n <div class=\"features-list\">\r\n \r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"feature-text\">\r\n <h3>Expert Local Instructors<\/h3>\r\n <p>Certified Moroccan surf guides with years of experience teaching all levels, from first-timers to advanced riders.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M18.92 6.01C18.72 5.42 18.16 5 17.5 5h-11c-.66 0-1.21.42-1.42 1.01L3 12v8c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-1h12v1c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-8l-2.08-5.99zM6.5 16c-.83 0-1.5-.67-1.5-1.5S5.67 13 6.5 13s1.5.67 1.5 1.5S7.33 16 6.5 16zm11 0c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zM5 11l1.5-4.5h11L19 11H5z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"feature-text\">\r\n <h3>Premium Equipment<\/h3>\r\n <p>Top-quality surfboards, SUPs, and wetsuits from leading brands, meticulously maintained for optimal performance.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-2-10L6 18l8-4 4-8-8 4z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"feature-text\">\r\n <h3>Authentic Moroccan Vibe<\/h3>\r\n <p>Immerse yourself in local culture with handpicked souvenirs, artisan goods, and genuine Taghazout hospitality.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-604140f e-con-full e-flex e-con e-parent\" data-id=\"604140f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-748c4d9 elementor-widget elementor-widget-html\" data-id=\"748c4d9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n <title>Yalla Surf \u00b7 Photo Gallery | Surfing in Taghazout<\/title>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n .gallery-section {\r\n width: 100%;\r\n background: linear-gradient(145deg, #f8fbfe 0%, #eef3fa 100%);\r\n font-family: 'Poppins', sans-serif;\r\n padding: 5rem 2rem;\r\n }\r\n\r\n .gallery-container {\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n }\r\n\r\n \/* Section Header *\/\r\n .gallery-header {\r\n text-align: center;\r\n margin-bottom: 3rem;\r\n }\r\n\r\n .gallery-header .badge {\r\n display: inline-block;\r\n background: rgba(224, 122, 44, 0.12);\r\n color: #E07A2C;\r\n font-size: 0.75rem;\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n letter-spacing: 1.5px;\r\n padding: 0.3rem 1rem;\r\n border-radius: 30px;\r\n margin-bottom: 1rem;\r\n }\r\n\r\n .gallery-header h2 {\r\n font-size: clamp(2rem, 5vw, 2.8rem);\r\n font-weight: 800;\r\n color: #0a2f44;\r\n margin-bottom: 0.75rem;\r\n letter-spacing: -0.02em;\r\n }\r\n\r\n .gallery-header p {\r\n font-size: 1.1rem;\r\n color: #4a6f86;\r\n max-width: 580px;\r\n margin: 0 auto;\r\n }\r\n\r\n .gallery-header .divider {\r\n width: 70px;\r\n height: 3px;\r\n background: #E07A2C;\r\n margin: 1rem auto 0;\r\n border-radius: 3px;\r\n }\r\n\r\n \/* Gallery Grid - 4 columns on desktop *\/\r\n .gallery-grid {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 1.5rem;\r\n }\r\n\r\n \/* Gallery Item *\/\r\n .gallery-item {\r\n position: relative;\r\n border-radius: 1.2rem;\r\n overflow: hidden;\r\n cursor: pointer;\r\n aspect-ratio: 1 \/ 1;\r\n box-shadow: 0 12px 25px -10px rgba(0, 0, 0, 0.1);\r\n transition: all 0.4s cubic-bezier(0.2, 0.9, 0.4, 1.1);\r\n }\r\n\r\n .gallery-item:hover {\r\n transform: translateY(-8px);\r\n box-shadow: 0 25px 35px -12px rgba(0, 0, 0, 0.2);\r\n }\r\n\r\n .gallery-item img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n transition: transform 0.6s ease;\r\n display: block;\r\n }\r\n\r\n .gallery-item:hover img {\r\n transform: scale(1.08);\r\n }\r\n\r\n \/* Overlay effect on hover *\/\r\n .gallery-overlay {\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n background: linear-gradient(to top, rgba(10, 47, 68, 0.85), transparent);\r\n padding: 1.5rem 1rem 1rem;\r\n transform: translateY(100%);\r\n transition: transform 0.4s ease;\r\n text-align: center;\r\n }\r\n\r\n .gallery-item:hover .gallery-overlay {\r\n transform: translateY(0);\r\n }\r\n\r\n .gallery-overlay svg {\r\n width: 28px;\r\n height: 28px;\r\n fill: white;\r\n opacity: 0.9;\r\n }\r\n\r\n \/* Lightbox Modal (optional but adds professionalism) *\/\r\n .lightbox {\r\n display: none;\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0, 0, 0, 0.9);\r\n z-index: 1000;\r\n justify-content: center;\r\n align-items: center;\r\n cursor: pointer;\r\n opacity: 0;\r\n transition: opacity 0.3s ease;\r\n }\r\n\r\n .lightbox.active {\r\n display: flex;\r\n opacity: 1;\r\n }\r\n\r\n .lightbox img {\r\n max-width: 90%;\r\n max-height: 90%;\r\n object-fit: contain;\r\n border-radius: 8px;\r\n box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);\r\n }\r\n\r\n .lightbox-close {\r\n position: absolute;\r\n top: 20px;\r\n right: 30px;\r\n color: white;\r\n font-size: 40px;\r\n cursor: pointer;\r\n font-weight: 300;\r\n transition: transform 0.2s;\r\n }\r\n\r\n .lightbox-close:hover {\r\n transform: scale(1.1);\r\n }\r\n\r\n \/* Responsive Design *\/\r\n @media (max-width: 1024px) {\r\n .gallery-section {\r\n padding: 4rem 1.8rem;\r\n }\r\n .gallery-grid {\r\n gap: 1.2rem;\r\n }\r\n }\r\n\r\n @media (max-width: 900px) {\r\n .gallery-grid {\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 1.2rem;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .gallery-section {\r\n padding: 3rem 1.2rem;\r\n }\r\n .gallery-grid {\r\n grid-template-columns: repeat(2, 1fr);\r\n gap: 1rem;\r\n }\r\n .gallery-header h2 {\r\n font-size: 1.8rem;\r\n }\r\n .gallery-header p {\r\n font-size: 0.95rem;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .gallery-section {\r\n padding: 2.5rem 1rem;\r\n }\r\n .gallery-grid {\r\n grid-template-columns: 1fr;\r\n gap: 1rem;\r\n max-width: 380px;\r\n margin: 0 auto;\r\n }\r\n .gallery-item {\r\n aspect-ratio: 4 \/ 3;\r\n }\r\n }\r\n\r\n \/* Animation on scroll *\/\r\n @keyframes fadeInUp {\r\n from {\r\n opacity: 0;\r\n transform: translateY(30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n .gallery-item {\r\n animation: fadeInUp 0.6s ease forwards;\r\n opacity: 0;\r\n }\r\n\r\n .gallery-item:nth-child(1) { animation-delay: 0.05s; }\r\n .gallery-item:nth-child(2) { animation-delay: 0.1s; }\r\n .gallery-item:nth-child(3) { animation-delay: 0.15s; }\r\n .gallery-item:nth-child(4) { animation-delay: 0.2s; }\r\n .gallery-item:nth-child(5) { animation-delay: 0.25s; }\r\n .gallery-item:nth-child(6) { animation-delay: 0.3s; }\r\n .gallery-item:nth-child(7) { animation-delay: 0.35s; }\r\n .gallery-item:nth-child(8) { animation-delay: 0.4s; }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n <section class=\"gallery-section\">\r\n <div class=\"gallery-container\">\r\n \r\n <div class=\"gallery-header\">\r\n <div class=\"badge\">Yalla Surf Moments<\/div>\r\n <h2>Capturing the Stoke<\/h2>\r\n <p>Authentic moments from our surf sessions, shop, and the beautiful Taghazout coastline<\/p>\r\n <div class=\"divider\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"gallery-grid\">\r\n \r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.09-3.jpeg\" \r\n alt=\"Surf instructor teaching at Yalla Surf Shop School\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.05-1.jpeg\" \r\n alt=\"Surfing action in Taghazout Bay\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.08-1.jpeg\" \r\n alt=\"Surfboard and equipment at Yalla Surf Shop\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.10-1.jpeg\" \r\n alt=\"Sunset surfing in Taghazout\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.17.21.jpeg\" \r\n alt=\"Group surf lesson with Yalla instructors\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.17.22.jpeg\" \r\n alt=\"Yalla Surf Shop interior and gear\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-27-at-15.11.12.jpeg\" \r\n alt=\"Wave riding in Taghazout\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"gallery-item\" onclick=\"openLightbox(this)\">\r\n <img decoding=\"async\" src=\"https:\/\/tamazirtsurfshopschool.com\/wp-content\/uploads\/2026\/03\/sandboarding.jpg\" \r\n alt=\"Sandboarding adventure near Taghazout\" \r\n loading=\"lazy\">\r\n <div class=\"gallery-overlay\">\r\n <svg viewbox=\"0 0 24 24\">\r\n <path d=\"M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z\"\/>\r\n <path d=\"M12 4C6.48 4 2 8.48 2 14s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <div id=\"lightbox\" class=\"lightbox\" onclick=\"closeLightbox()\">\r\n <span class=\"lightbox-close\">×<\/span>\r\n <img decoding=\"async\" id=\"lightbox-img\" src=\"\" alt=\"Gallery image\">\r\n <\/div>\r\n\r\n <script>\r\n function openLightbox(element) {\r\n const img = element.querySelector('img');\r\n const lightbox = document.getElementById('lightbox');\r\n const lightboxImg = document.getElementById('lightbox-img');\r\n lightboxImg.src = img.src;\r\n lightbox.classList.add('active');\r\n document.body.style.overflow = 'hidden';\r\n }\r\n\r\n function closeLightbox() {\r\n const lightbox = document.getElementById('lightbox');\r\n lightbox.classList.remove('active');\r\n document.body.style.overflow = 'auto';\r\n }\r\n\r\n \/\/ Close with Escape key\r\n document.addEventListener('keydown', function(e) {\r\n if (e.key === 'Escape') {\r\n closeLightbox();\r\n }\r\n });\r\n <\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Tamazirt Surf | Ocean Blue Slider \u2013 Book Surf Lessons Tamazirt Surf Shop School \u00b7 Surf Lessons & Premium Gear +1,280+ Happy surfers Tamazirt Surf Shop School \u2726 \u2726 \u2726 \u2726 Surf Lessons & Premium Gear in Taghazout Tamazirt Surf Shop School offers expert surf lessons for all levels, premium board rentals & wetsuits, and […]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":80,"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":357,"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/pages\/8\/revisions\/357"}],"wp:attachment":[{"href":"https:\/\/tamazirtsurfshopschool.com\/pl\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}