/*
Theme Name: Aviv Haneshama Theme
Theme URI: http://example.com/aviv-haneshama-theme/
Author: AL
Author URI: https://www.facebook.com/kabbalh
Description: אתר לכבוד אביב הנשמה, נבנה ע"י אהרון ל.
Version: 1.10.3
License: GNU General Public License v2 or later
Text Domain: aviv-haneshama-theme
*/

:root {
    --color-primary: #9e3b1b;
    --color-primary-hover: #7f2e14;
    --color-secondary: #0088cb;
    --color-accent: #ffcb05;
    --color-bg-beige: #f5f4ef;
    --color-bg-white: #ffffff;
    --color-text-dark: #191d20;
    --color-text-muted: #535658;
    --color-border: #e2e8f0;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.05), 0 2px 4px -1px rgba(0,0,0,0.03);
    --shadow-lg: 0 20px 25px -5px rgba(0,0,0,0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.03);
    --shadow-premium: 0 30px 60px -15px rgba(158, 59, 27, 0.08), 0 15px 30px -10px rgba(0, 0, 0, 0.04);
    --transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Base resets & typography */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    overflow-x: hidden;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Heebo', 'Inter', system-ui, -apple-system, sans-serif;
    background-color: var(--color-bg-beige);
    color: var(--color-text-dark);
    line-height: 1.7;
    direction: rtl;
    text-align: right;
    overflow-x: visible;
    position: relative;
    width: 100%;
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
    transition: var(--transition);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Scroll Reveal Initial States */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Header styling */
.site-header {
    background-color: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(226, 232, 240, 0.8);
    position: sticky;
    top: 0;
    z-index: 1000;`r`n    position: sticky;`r`n    width: 100%;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 95px;
}

.site-logo {
    display: flex;
    align-items: center;
    transition: var(--transition);
}

.site-logo:hover {
    transform: scale(1.03);
}

.site-logo img {
    height: 75px;
    width: auto;
}

.nav-menu-wrap {
    display: flex;
    align-items: center;
    gap: 30px;
}

.main-navigation ul {
    list-style: none;
    display: flex;
    gap: 15px;
}

.main-navigation a {
    font-weight: 500;
    font-size: 1.1rem;
    padding: 8px 16px;
    position: relative;
    color: var(--color-text-dark);
    transition: color 0.3s ease;
}

/* Sliding underline hover animation */
.main-navigation a::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 50%;
    width: 0;
    height: 2px;
    
    transition: width 0.3s ease, right 0.3s ease;
}

.main-navigation a:hover {
    color: var(--color-primary);
}

.main-navigation a:hover::after,
.main-navigation .current-menu-item > a::after {
    width: 100%;
    right: 0;
}

.main-navigation .current-menu-item > a {
    color: var(--color-primary);
    font-weight: 600;
}

.social-links {
    display: flex;
    gap: 10px;
    align-items: center;
}

.social-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: var(--color-bg-white);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.social-icon img {
    width: 16px;
    height: 16px;
    transition: var(--transition);
}

.social-icon:hover {
    transform: translateY(-4px) scale(1.1);
    
    border-color: var(--color-primary);
    box-shadow: 0 8px 15px rgba(158, 59, 27, 0.2);
}

.social-icon:hover img {
    filter: brightness(0) invert(1);
}

.menu-toggle {
    display: none;
    background: none;
    border: none;
    font-size: 1.8rem;
    cursor: pointer;
    color: var(--color-text-dark);
    transition: var(--transition);
}

/* Footer styling */
.site-footer {
    background-color: var(--color-bg-white);
    border-top: 1px solid var(--color-border);
    padding: 70px 0 30px 0;
    margin-top: 80px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1.3fr 2fr;
    gap: 50px;
    margin-bottom: 50px;
}

.footer-widget h3 {
    font-size: 1.3rem;
    margin-bottom: 25px;
    color: var(--color-primary);
    position: relative;
    padding-bottom: 10px;
}

.footer-widget h3::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50px;
    height: 2px;
    
}

.footer-about p {
    margin-bottom: 20px;
    font-size: 1rem;
    color: var(--color-text-muted);
}

.footer-contact-list {
    list-style: none;
}

.footer-contact-list li {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--color-text-muted);
}

.footer-contact-list i {
    color: var(--color-primary);
    width: 16px;
    text-align: center;
}

.footer-contact-list a:hover {
    color: var(--color-primary);
}

.newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 15px;
}

.newsletter-form p {
    font-size: 0.95rem;
    color: var(--color-text-muted);
}

.form-group-inline {
    display: flex;
    gap: 8px;
}

.form-input {
    flex-grow: 1;
    padding: 12px 18px;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    font-family: inherit;
    font-size: 1rem;
    background-color: var(--color-bg-beige);
    outline: none;
    transition: var(--transition);
}

.form-input:focus {
    border-color: var(--color-primary);
    background-color: var(--color-bg-white);
    box-shadow: 0 0 0 3px rgba(158, 59, 27, 0.1);
}

.btn-primary {
    
    color: var(--color-bg-white);
    border: none;
    padding: 12px 26px;
    border-radius: 8px;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: var(--shadow-sm);
}

.btn-primary:hover {
    background-color: var(--color-primary-hover);
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(158, 59, 27, 0.2);
}

.footer-bottom {
    border-top: 1px solid var(--color-border);
    padding-top: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 40px 20px;
    color: var(--color-text-muted);
    font-size: 0.9rem;
}

.footer-bottom-links {
    display: flex;
    gap: 40px 20px;
}

.footer-bottom-links a:hover {
    color: var(--color-primary);
}

/* Hero Split Layout */
.hero-section {
    background-image: linear-gradient(rgba(245, 244, 239, 0.92), rgba(245, 244, 239, 0.92)), url('assets/images/hero_bg.jpg');
    background-size: cover;
    background-position: center;
    padding: 100px 0;
    border-bottom: 1px solid var(--color-border);
}

/* Special tight padding when logo is placed above the columns */
.hero-section.hero-logo-above-active {
    padding-top: 30px;
    padding-bottom: 60px;
}

.hero-split-container {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 50px;
    align-items: flex-start; /* Aligns tops of photo and text column */
}

.hero-text-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: right;
}

.hero-logo {
    margin-bottom: 25px;
    animation: fadeInDown 1s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.hero-logo img {
    /* Auto-removes white background of JPG logos */
    mix-blend-mode: multiply; 
}

.hero-title {
    font-size: 3.5rem;
    font-weight: 800;
    color: var(--color-primary);
    line-height: 1.2;
    margin-bottom: 20px;
    letter-spacing: -1px;
}

.hero-subtitle {
    font-size: 1.35rem;
    font-weight: 400;
    color: var(--color-text-muted);
    line-height: 1.8;
    margin-bottom: 30px;
}

.hero-image-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.hero-image-col img {
    width: 100%;
    max-width: 480px;
    height: auto;
    border-radius: 20px;
    box-shadow: var(--shadow-premium);
    transition: var(--transition);
}

.hero-image-col img:hover {
    transform: translateY(-8px) scale(1.02);
}

/* Intro Section (Section 2) Split Layout */
.intro-split-container {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 60px;
    align-items: center;
}

.intro-image-col {
    display: flex;
    justify-content: center;
    align-items: center;
}

.intro-image-col img {
    width: 100%;
    max-width: 420px;
    height: auto;
    border-radius: 20px;
    box-shadow: var(--shadow-premium);
    transition: var(--transition);
}

.intro-image-col img:hover {
    transform: translateY(-8px) scale(1.02);
}

.intro-text-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: right;
}

/* Double Banners: Online & Groups learning section */
.learning-methods-section {
    margin-top: 60px;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

.learning-methods-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

.method-banner {
    background-size: cover;
    background-position: center;
    padding: 90px 70px;
    min-height: 600px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: var(--transition);
}

.method-content {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.method-title {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 25px;
    text-align: center;
}

.method-banner.online .method-title {
    color: #191d20;
}

.method-banner.groups .method-title {
    color: #ffffff;
}

.method-text {
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 35px;
    text-align: justify;
    text-justify: inter-word;
}

.method-banner.online .method-text {
    color: var(--color-text-muted);
}

.method-banner.groups .method-text {
    color: rgba(255, 255, 255, 0.9);
}

.section-padding {
    padding: 100px 0;
}

.section-title {
    font-size: 2.4rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 60px;
    position: relative;
    color: var(--color-primary);
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background-color: var(--color-accent);
}

.section-bg-white {
    background-color: var(--color-bg-white);
}

/* Cards & Layout grids */
.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.card {
    background-color: var(--color-bg-white);
    border: 1px solid rgba(226, 232, 240, 0.8);
    border-radius: 16px;
    padding: 45px 30px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-premium);
    border-color: rgba(158, 59, 27, 0.3);
}

.card-icon {
    font-size: 2.8rem;
    color: var(--color-primary);
    margin-bottom: 25px;
    transition: var(--transition);
    display: inline-block;
}

.card:hover .card-icon {
    transform: scale(1.15) rotate(-5deg);
}

.card-title {
    font-size: 1.45rem;
    margin-bottom: 18px;
    font-weight: 700;
    color: var(--color-text-dark);
}

.card-text {
    color: var(--color-text-muted);
    font-size: 1rem;
    line-height: 1.7;
}

/* Rabbi Profile Section (Strip) */
.profile-section {
    background-color: var(--color-bg-white);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-premium);
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    margin-top: 40px;
    border: 1px solid var(--color-border);
}

.profile-img-wrap {
    position: relative;
    min-height: 480px;
    overflow: hidden;
}

.profile-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: var(--transition);
}

.profile-section:hover .profile-img-wrap img {
    transform: scale(1.05);
}

.profile-content {
    padding: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.profile-quote {
    font-style: italic;
    font-size: 1.35rem;
    font-weight: 500;
    border-right: 4px solid var(--color-primary);
    padding-right: 20px;
    margin-bottom: 30px;
    color: var(--color-text-muted);
    line-height: 1.6;
}

/* Contact form section */
.contact-section-layout {
    display: grid;
    grid-template-columns: 1.2fr 1.8fr;
    gap: 60px;
    background-color: var(--color-bg-white);
    border-radius: 20px;
    padding: 60px;
    box-shadow: var(--shadow-premium);
    border: 1px solid var(--color-border);
}

.contact-info-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 480px;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
}

.contact-info-panel h3 {
    font-size: 2.3rem;
    margin-bottom: 20px;
    color: var(--color-primary);
}

.contact-info-panel p {
    color: var(--color-text-muted);
    margin-bottom: 30px;
    font-size: 1.15rem;
    line-height: 1.6;
}

.contact-info-panel .footer-contact-list {
    font-size: 1.15rem;
}

.contact-form-panel form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.contact-form-panel .form-group-full {
    grid-column: span 2;
}

.contact-form-panel label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: var(--color-text-dark);
}

.contact-form-panel textarea {
    resize: vertical;
    min-height: 130px;
}

/* Courses Page */
.courses-intro {
    text-align: center;
    max-width: 850px;
    margin: 0 auto 60px auto;
    font-size: 1.1rem;
    color: var(--color-text-muted);
    line-height: 1.8;
}

.course-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.course-card {
    background-color: var(--color-bg-white);
    border: 1px solid var(--color-border);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    transition: var(--transition);
}

.course-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-premium);
    border-color: rgba(158, 59, 27, 0.2);
}

.course-image {
    height: 250px;
    background-color: var(--color-bg-beige);
    position: relative;
    overflow: hidden;
}

.course-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: var(--transition);
}

.course-card:hover .course-image img {
    transform: scale(1.06);
}

.course-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    
    
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    z-index: 2;
}

.course-badge.free {
    background-color: var(--color-secondary);
}

.course-body {
    padding: 35px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.course-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 15px;
    color: var(--color-text-dark);
}

.course-description {
    color: var(--color-text-muted);
    font-size: 1rem;
    margin-bottom: 30px;
    flex-grow: 1;
    line-height: 1.7;
}

/* About Page team styles */
.about-intro-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-bottom: 70px;
}

.team-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.team-card {
    background-color: var(--color-bg-white);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 45px 30px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.team-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-premium);
}

.team-avatar {
    width: 130px;
    height: 130px;
    border-radius: 50%;
    margin: 0 auto 25px auto;
    object-fit: cover;
    border: 4px solid var(--color-bg-beige);
    box-shadow: 0 0 0 3px var(--color-primary);
    transition: var(--transition);
}

.team-card:hover .team-avatar {
    transform: scale(1.08);
}

.team-name {
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 8px;
    color: var(--color-text-dark);
}

.team-role {
    color: var(--color-primary);
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 20px;
}

.team-desc {
    color: var(--color-text-muted);
    font-size: 0.95rem;
    line-height: 1.6;
}

/* Bookstore Page product styles */
.store-header {
    margin-bottom: 50px;
}

.store-intro {
    font-size: 1.15rem;
    color: var(--color-text-muted);
    margin-bottom: 35px;
    max-width: 950px;
    line-height: 1.8;
}

.store-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: var(--color-bg-white);
    padding: 20px 30px;
    border-radius: 16px;
    border: 1px solid var(--color-border);
    margin-bottom: 45px;
    flex-wrap: wrap;
    gap: 40px 20px;
    box-shadow: var(--shadow-sm);
}

.store-search-box {
    display: flex;
    align-items: center;
    position: relative;
    width: 320px;
}

.store-search-box input {
    width: 100%;
    padding: 12px 18px 12px 45px;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    font-family: inherit;
    outline: none;
    background-color: var(--color-bg-beige);
    transition: var(--transition);
}

.store-search-box input:focus {
    border-color: var(--color-primary);
    background-color: var(--color-bg-white);
}

.store-product-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 30px;
}

.product-card {
    background-color: var(--color-bg-white);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    position: relative;
}

.product-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-premium);
    border-color: rgba(158, 59, 27, 0.2);
}

.product-image {
    padding: 25px;
    background-color: #faf9f6;
    height: 270px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.product-image img {
    max-height: 100%;
    object-fit: contain;
    box-shadow: 0 8px 16px rgba(0,0,0,0.1);
    transition: var(--transition);
}

.product-card:hover .product-image img {
    transform: scale(1.08) translateY(-4px);
    box-shadow: 0 15px 25px rgba(158, 59, 27, 0.15);
}

.product-sale-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    
    
    padding: 5px 12px;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: 4px;
    z-index: 2;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.product-info {
    padding: 25px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.product-title {
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--color-text-dark);
    flex-grow: 1;
    min-height: 48px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.4;
}

.product-price-row {
    margin-bottom: 20px;
    font-size: 1.2rem;
    font-weight: 700;
}

.price-regular {
    color: var(--color-text-dark);
}

.price-sale-container {
    display: flex;
    gap: 10px;
    align-items: baseline;
}

.price-old {
    text-decoration: line-through;
    color: var(--color-text-muted);
    font-size: 0.95rem;
    font-weight: 400;
}

.price-new {
    color: var(--color-primary);
}

.product-btn {
    width: 100%;
    padding: 12px;
    background-color: var(--color-bg-beige);
    color: var(--color-text-dark);
    border: 1px solid var(--color-border);
    border-radius: 8px;
    font-family: inherit;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    text-align: center;
}

.product-btn:hover {
    
    
    border-color: var(--color-primary);
    box-shadow: 0 4px 10px rgba(158, 59, 27, 0.15);
}

/* Responsive queries */
@media (max-width: 1024px) {
    .grid-3, .team-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .store-product-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .hero-section {
        padding: 30px 0 !important; /* Force tight spacing on all mobile configurations */
    }
    .header-container {
        height: 75px;
    }
    .menu-toggle {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .main-navigation {
        display: none;
        position: absolute;
        top: 75px;
        left: 0;
        right: 0;
        background-color: var(--color-bg-white);
        border-bottom: 1px solid var(--color-border);
        box-shadow: var(--shadow-md);
        padding: 0 !important; /* Full width edge-to-edge content */
    }
    .main-navigation.active {
        display: block;
    }
    .main-navigation ul {
        flex-direction: column;
        gap: 0 !important; /* Remove gap for clean row dividers */
    }
    .main-navigation a::after {
        display: none;
    }
    .social-links {
        display: none;
    }
    .hero-title {
        font-size: 2.5rem;
    }
    .hero-split-container {
        grid-template-columns: 1fr;
    }
    .hero-text-col {
        text-align: center;
    }
    .intro-split-container {
        grid-template-columns: 1fr;
    }
    .intro-text-col {
        text-align: center;
    }
    .learning-methods-grid {
        grid-template-columns: 1fr;
    }
    .method-banner {
        min-height: 480px;
        padding: 50px 30px;
    }
    .method-title {
        font-size: 2.3rem;
    }
    .grid-3, .team-grid, .course-grid, .store-product-grid {
        grid-template-columns: 1fr;
    }
    .profile-section {
        grid-template-columns: 1fr;
    }
    .profile-img-wrap {
        min-height: 320px;
    }
    .contact-section-layout {
        grid-template-columns: 1fr;
        padding: 35px;
    }
    .contact-form-panel form {
        grid-template-columns: 1fr;
    }
    .contact-form-panel .form-group-full {
        grid-column: span 1;
    }
    .footer-grid {
        grid-template-columns: 1fr;
    }
    .footer-widget h3 {
        font-size: 1.15rem;
        line-height: 1.4;
    }
    .form-group-inline {
        flex-direction: column;
        gap: 12px;
    }
    .footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: 15px;
        padding-top: 20px;
    }
    .footer-bottom-links, .social-links-footer {
        justify-content: center;
        flex-wrap: wrap;
    }
}

/* Animations */
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Gallery Slider Section */
.gallery-slider-container {
    position: relative;
    width: 100%;
    height: 520px;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-premium);
    background-color: #eae7df;
}

.gallery-slides {
    position: relative;
    width: 100%;
    height: 100%;
}

.gallery-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1;
}

.gallery-slide.active {
    opacity: 1;
    z-index: 2;
}

.gallery-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Arrows */
.gallery-prev, .gallery-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid var(--color-border);
    width: 54px;
    height: 54px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 10;
    transition: var(--transition);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-dark);
    font-size: 1.1rem;
}

.gallery-prev:hover, .gallery-next:hover {
    
    
    box-shadow: 0 8px 20px rgba(158, 59, 27, 0.25);
    transform: translateY(-50%) scale(1.05);
}

.gallery-prev {
    right: 25px;
}

.gallery-next {
    left: 25px;
}

/* Dots */
.gallery-dots {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 10;
    background-color: rgba(0, 0, 0, 0.06);
    padding: 6px 12px;
    border-radius: 20px;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.gallery-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.25);
    cursor: pointer;
    transition: var(--transition);
}

.gallery-dot:hover {
    background-color: rgba(255, 255, 255, 0.5);
}

.gallery-dot.active {
    background-color: rgba(255, 255, 255, 0.7);
    transform: scale(1.2);
}

@media (max-width: 768px) {
    .gallery-slider-container {
        height: 320px;
    }
    .gallery-prev, .gallery-next {
        width: 44px;
        height: 44px;
        font-size: 0.95rem;
    }
    .gallery-prev { right: 15px; }
    .gallery-next { left: 15px; }
}


/* ==========================================================================
   Sub-menu / Dropdown Styles (Delicate Tab) - FIXED
   ========================================================================== */
.primary-menu li {
    position: relative;
}
.primary-menu .sub-menu {
    display: block !important;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: calc(100% + 20px);
    right: 50%;
    transform: translateX(50%);
    min-width: 210px; /* Compact width to prevent feeling bulky */
    background: #ffffff !important; /* Pure solid white dropdown card */
    box-shadow: 0 10px 30px rgba(0,0,0,0.06) !important; /* Faint, clean shadow */
    z-index: 1000;
    list-style: none;
    padding: 5px 0 !important; /* Continuous list spacing */
    margin: 0 !important;
    border-radius: 12px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    pointer-events: none;
    border: 1px solid rgba(0,0,0,0.06) !important; /* Thin clean gray border */
}
.primary-menu .sub-menu::before {
    content: '';
    position: absolute;
    top: -6px;
    right: 50%;
    margin-right: -6px;
    width: 12px;
    height: 12px;
    background: #ffffff; /* Matches container */
    transform: rotate(45deg);
    box-shadow: -2px -2px 5px rgba(0,0,0,0.02);
    border-left: 1px solid rgba(0,0,0,0.06);
    border-top: 1px solid rgba(0,0,0,0.06);
    z-index: -1;
}
/* Invisible hover bridge to keep dropdown open when crossing the gap */
.primary-menu .sub-menu::after {
    content: '';
    position: absolute;
    top: -25px;
    left: 0;
    width: 100%;
    height: 25px;
    background: transparent;
    z-index: -1;
}
.primary-menu li:hover > .sub-menu,
.primary-menu li:focus-within > .sub-menu {
    visibility: visible;
    opacity: 1;
    top: calc(100% + 10px);
    pointer-events: auto;
}
.primary-menu .sub-menu li {
    padding: 0;
    display: block;
    margin: 0; /* Continuous block highlight */
    width: 100%;
}
.primary-menu .sub-menu a {
    display: block !important;
    padding: 10px 20px !important; /* Generous stable padding */
    font-size: 0.94rem;
    font-weight: 500;
    color: #333333; /* Clean dark text color */
    transition: background-color 0.2s ease, color 0.2s ease;
    text-align: right;
    border-bottom: none !important;
    border-right: none !important;
}
.primary-menu .sub-menu a::after {
    display: none !important; /* disable sliding underline inside sub-menu */
}
.primary-menu .sub-menu a:hover {
    color: var(--color-primary) !important;
    padding-right: 20px !important; /* Stable padding (no text shifting) to feel light and solid */
    background-color: rgba(73, 146, 143, 0.08) !important; /* Delicate transparent green hover background */
}
.primary-menu .menu-item-has-children > a {
    padding-left: 25px !important;
}
.primary-menu .menu-item-has-children > a::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
    width: 5px;
    height: 5px;
    border-left: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    opacity: 0.7;
    transition: transform 0.3s ease;
}
.primary-menu .menu-item-has-children:hover > a::before {
    transform: translateY(-50%) rotate(135deg);
    filter: drop-shadow(0 0 3px rgba(73, 146, 143, 0.8));
}

@media (max-width: 991px) {
    .primary-menu .menu-item-has-children {
        position: relative;
    }
    .primary-menu > li {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        width: 100% !important;
        border-bottom: 1px solid rgba(0,0,0,0.04) !important;
        box-sizing: border-box !important;
    }
    /* Alternating row backgrounds for primary mobile menu items */
    .primary-menu > li:nth-child(odd) {
        background-color: #ffffff !important;
    }
    .primary-menu > li:nth-child(even) {
        background-color: #f7faf9 !important; /* Very soft brand green-gray shade */
    }
    .primary-menu > li > a {
        flex: 1 !important;
        display: block !important;
        padding: 12px 24px !important; /* Touch area with compact height */
        font-size: 1.02rem !important;
        font-weight: 600 !important;
        color: var(--color-text-dark) !important;
        box-sizing: border-box !important;
    }
    
    .primary-menu .sub-menu {
        position: static;
        visibility: visible;
        opacity: 0;
        max-height: 0;
        overflow: hidden;
        transform: none;
        box-shadow: none;
        background-color: transparent;
        padding: 0 !important;
        margin: 0 !important;
        border: none;
        border-radius: 0;
        transition: max-height 0.4s ease, opacity 0.4s ease;
        width: 100% !important; /* Wrap to new row below flex header */
    }
    .primary-menu .sub-menu::before {
        display: none;
    }
    .primary-menu li:hover > .sub-menu {
        top: auto;
        opacity: 0;
        max-height: 0;
    }
    .primary-menu li.mobile-dropdown-open > .sub-menu {
        opacity: 1;
        max-height: 800px;
        padding: 0 !important;
        margin-right: 0 !important;
        border-right: none;
        background-color: rgba(0, 0, 0, 0.015) !important;
        border-top: 1px solid rgba(0,0,0,0.02) !important;
        border-bottom: 1px solid rgba(0,0,0,0.02) !important;
    }
    .primary-menu li.mobile-dropdown-open > .sub-menu a {
        padding: 10px 38px 10px 15px !important; /* Indent sub items */
        font-size: 0.94rem !important;
        color: #666 !important;
        font-weight: 500 !important;
        border-bottom: none !important;
    }
    .primary-menu li.mobile-dropdown-open > .sub-menu a::before {
        content: '—';
        display: inline-block;
        margin-left: 8px;
        color: #ccc;
        font-weight: 300;
    }
    .primary-menu .menu-item-has-children > a {
        display: block; /* Overridden by flex flex-wrap above */
    }
    .primary-menu .menu-item-has-children > a::before {
        display: none; /* hide desktop chevron */
    }
    .mobile-dropdown-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 50px !important;
        height: 45px !important; /* Matches link touch area height */
        background: transparent !important;
        border: none !important;
        cursor: pointer !important;
        font-size: 0.95rem !important;
        color: var(--color-text-dark) !important;
        margin: 0 !important;
        transition: transform 0.3s ease;
        padding-left: 15px !important;
        box-sizing: border-box !important;
    }
    .primary-menu li.mobile-dropdown-open > .mobile-dropdown-toggle i {
        transform: rotate(180deg);
    }
    .primary-menu li.mobile-dropdown-open > .mobile-dropdown-toggle {
        color: var(--color-primary) !important;
    }
}

@media (min-width: 992px) {
    .mobile-dropdown-toggle {
        display: none !important;
    }
}
/* ==========================================================================
   Courses Section
   ========================================================================== */
.aviv-courses-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin: 40px 0;
}

.course-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.course-image {
    width: 100%;
    padding-top: 100%; /* Square aspect ratio */
    background-size: cover;
    background-position: center;
}

.course-content {
    padding: 30px 20px 20px 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.course-title {
    font-size: 22px;
    margin: 0 0 30px 0;
    color: #333;
    font-weight: 400;
    text-align: right;
    line-height: 1.4;
}

.course-subtitle {
    font-size: 15px;
    color: #333;
    margin-bottom: 20px;
    text-align: left;
}

.course-btn {
    display: block;
    width: 100%;
    background-color: #0d5c3f; /* Dark green */
    color: #fff;
    text-align: center;
    padding: 14px 0;
    text-decoration: none;
    font-weight: normal;
    font-size: 16px;
    border-radius: 4px;
    margin-top: auto;
    transition: background-color 0.2s ease;
}

.course-btn:hover {
    background-color: #0a4630;
    color: #fff;
}

@media (max-width: 992px) {
    .aviv-courses-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .aviv-courses-grid {
        grid-template-columns: 1fr;
    }
}


/* ========================================================================
   MOBILE OVERFLOW FIX - prevent horizontal scroll on all devices
   ======================================================================== */
@media (max-width: 768px) {
    html {
        width: 100%;
        max-width: 100%;
    }
    body {
        position: relative;
        width: 100%;
        max-width: 100%;
    }

    .site-header {
        position: sticky;
        width: 100%;
        max-width: 100%;
    }

    .container {
        padding: 0 15px;
        max-width: 100%;
    }

    .store-search-box {
        width: 100%;
        max-width: 100%;
    }


}

/* === SMTP Form Grid Override (Version 1.8.2) === */
.contact-form-panel .ssf-form-container {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
}
.contact-form-panel .ssf-form-container h2 {
    display: none !important;
}
.contact-form-panel .ssf-form-container form {
    display: block !important;
}
.contact-form-panel .ssf-form-container form button[type="submit"] {
    width: 100% !important;
    background-color: var(--color-primary) !important;
    color: white !important;
    font-size: 1.15rem !important;
    font-weight: 600 !important;
    padding: 14px 24px !important;
    border-radius: 4px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    margin-top: 10px !important;
}
.contact-form-panel .ssf-form-container form button[type="submit"]:hover {
    background-color: #832e13 !important;
    transform: translateY(-2px) !important;
}

/* === SSF Form: robust field layout at ANY width (v1.9.5) ===
   The forms plugin gives phone/email inline width:calc(50% - 10px) with
   min-width:200px, which breaks when the panel is narrower than ~410px
   (e.g. phones in desktop-site mode at 980px, tablets 769-992px).
   These rules work without a media query, so no breakpoint gap remains. */
.contact-form-panel .ssf-form-container form > div[style*="flex"] {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}
.contact-form-panel .ssf-form-container form > div[style*="flex"] > div {
    box-sizing: border-box !important;
    max-width: 100% !important;
}
/* Half-width fields: share a row when there is room, expand to a full row when not */
.contact-form-panel .ssf-form-container form > div[style*="flex"] > div[style*="calc"] {
    flex: 1 1 200px !important;
    width: auto !important;
    min-width: 0 !important;
}
.contact-form-panel .ssf-form-container input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([name="ssf_captcha_ans"]),
.contact-form-panel .ssf-form-container textarea,
.contact-form-panel .ssf-form-container select {
    box-sizing: border-box !important;
    max-width: 100% !important;
}
/* === Narrow-screen overflow fix (v1.9.6) ===
   The long unbreakable email address forces a min-content width of ~334px
   on the grid track, inflating BOTH panels past the card and the viewport
   on screens narrower than ~400px. Let grid items shrink and let the
   email/address text wrap instead. */
.contact-section-layout > * {
    min-width: 0;
}
.footer-contact-list li {
    flex-wrap: wrap;
}
.footer-contact-list li a,
.footer-contact-list li span {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* === Books catalog: toolbar with live search (v1.10.3) ===
   Rendered by the [books_catalog] shortcode, so it appears both on the
   book archive and on the WordPress page that embeds the catalog.
   RTL: category filters on the right, search box on the left. */
.books-catalog-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}
.books-catalog-toolbar .book-category-filters {
    margin-bottom: 0 !important;
    justify-content: flex-start;
    flex: 1;
}
.books-search-box {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--color-bg-white);
    border: 1px solid var(--color-border);
    border-radius: 30px;
    padding: 10px 18px;
    min-width: 280px;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.books-search-box:focus-within {
    border-color: var(--color-primary);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.books-search-box i {
    color: var(--color-text-muted);
}
.books-search-box input {
    border: none;
    outline: none;
    background: transparent;
    font-family: inherit;
    font-size: 1rem;
    color: var(--color-text-dark);
    width: 100%;
}
@media (max-width: 768px) {
    .books-catalog-toolbar {
        flex-direction: column;
        align-items: stretch;
    }
    .books-catalog-toolbar .book-category-filters {
        justify-content: center;
    }
    .books-search-box {
        min-width: 0;
    }
}

/* === Condensed menu on narrow desktops (v1.9.9) ===
   With 10 menu items the row wraps to two lines on 4:3 / narrow desktop
   screens. Tighten font and spacing between 769-1200px so everything
   stays on one line; wide desktops are unaffected. */
@media (min-width: 769px) and (max-width: 1200px) {
    .main-navigation .primary-menu {
        gap: 4px;
    }
    .main-navigation .primary-menu > li > a {
        font-size: 0.95rem;
        padding: 8px 7px;
        white-space: nowrap;
    }
    .nav-menu-wrap {
        gap: 15px;
    }
}

/* === Desktop header: bigger logo (v1.9.8) ===
   The customizer sets the nav logo to 44px, which looks lost next to the
   menu in the 95px-tall desktop header. Enlarge it while staying inside
   the header bounds. Desktop only. */
@media (min-width: 769px) {
    .site-logo {
        flex-shrink: 0;
        margin-left: 25px;
    }
    .site-logo img {
        width: 70px !important;
        height: auto !important;
        max-height: 80px;
    }
}

/* === Mobile header: logo size & spacing (v1.9.7) ===
   On narrow screens the header row runs out of space and flex-shrink
   crushes the logo (44px -> ~33px) flush against the Facebook icon.
   Keep the logo full size, nudge it toward the right edge, and give it
   breathing room from the social icons. Mobile only. */
@media (max-width: 768px) {
    .site-header .header-container.container {
        padding: 0 15px;
    }
    .site-logo {
        flex-shrink: 0;
        margin-left: 10px;
    }
    .site-logo img {
        width: 52px !important;
    }
    .nav-menu-wrap {
        gap: 12px;
    }
}

/* Collapse the contact card to one column earlier, so a narrow form panel
   never has to squeeze next to the info panel (covers 769-992px). */
@media (max-width: 992px) {
    .contact-section-layout {
        grid-template-columns: 1fr;
        padding: 35px 25px;
    }
    .contact-form-panel form {
        grid-template-columns: 1fr;
    }
    .contact-form-panel .form-group-full {
        grid-column: span 1;
    }
}

/* === Courses Buttons Grid (8 Buttons) === */
.courses-buttons-section {
    background-color: var(--color-bg-white);
}
.courses-buttons-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 40px 20px;
    margin-top: 40px;
}
.course-sq-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    
    
    padding: 20px 10px;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 600;
    font-size: 1.1rem;
    line-height: 1.4;
    transition: all 0.3s ease;
    
    min-height: 100px;
    
}

@media (max-width: 992px) {
    .courses-buttons-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 576px) {
    .courses-buttons-grid {
        grid-template-columns: 1fr;
    }
    .course-sq-btn {
        min-height: 100px;
        font-size: 1.15rem;
    }
}

/* === Premium Button Styles === */
.course-sq-btn {
    background-color: transparent;
    color: var(--color-text-dark);
    box-shadow: none;
    border: none;
}

/* 1. Solid (Classic) */
.course-sq-btn.style-solid {
    background-color: var(--color-primary);
    color: white;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    border: 2px solid transparent;
}
.course-sq-btn.style-solid:hover {
    background-color: white;
    color: var(--color-primary);
    border-color: var(--color-primary);
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

/* 2. Outline */
.course-sq-btn.style-outline {
    background-color: transparent;
    color: var(--color-primary);
    border: 2px solid var(--color-primary);
}
.course-sq-btn.style-outline:hover {
    background-color: var(--color-primary);
    color: white;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.12);
}

/* 3. Gradient */
.course-sq-btn.style-gradient {
    background: linear-gradient(135deg, var(--color-primary) 0%, #d85731 100%);
    color: white;
    border: none;
    box-shadow: 0 5px 15px rgba(216, 87, 49, 0.3);
}
.course-sq-btn.style-gradient:hover {
    background: linear-gradient(135deg, #d85731 0%, var(--color-primary) 100%);
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 8px 25px rgba(216, 87, 49, 0.4);
}

/* 4. Glassmorphism */
.course-sq-btn.style-glass {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    color: var(--color-text-dark);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.07);
}
.course-sq-btn.style-glass:hover {
    background: rgba(255, 255, 255, 0.95);
    transform: translateY(-3px);
    box-shadow: 0 12px 40px 0 rgba(31, 38, 135, 0.12);
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
}

/* 5. 3D */
.course-sq-btn.style-3d {
    background-color: var(--color-primary);
    color: white;
    border: none;
    box-shadow: 0 6px 0 #6e2710, 0 10px 15px rgba(0,0,0,0.2);
    transform: translateY(0);
}
.course-sq-btn.style-3d:hover {
    transform: translateY(2px);
    box-shadow: 0 4px 0 #6e2710, 0 8px 10px rgba(0,0,0,0.2);
}
.course-sq-btn.style-3d:active {
    transform: translateY(6px);
    box-shadow: 0 0 0 transparent, 0 3px 5px rgba(0,0,0,0.2);
}

/* Mobile Show More Button */
.courses-show-more-wrapper {
    display: none;
    text-align: center;
    margin-top: 30px;
}
.courses-show-more-btn {
    background-color: transparent;
    color: var(--color-primary);
    border: 2px solid var(--color-primary);
    padding: 10px 25px;
    border-radius: 30px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.courses-show-more-btn:hover {
    background-color: var(--color-primary);
    color: white;
}
@media (max-width: 576px) {
    .courses-show-more-wrapper {
        display: block !important;
    }
    .courses-buttons-grid:not(.show-all-mobile) .course-sq-btn:nth-child(n+5) {
        display: none !important;
    }
}

/* --- Hotfix for Button Backgrounds --- */
.btn-primary {
    background-color: var(--color-primary) !important;
}
.main-navigation a::after,
.main-navigation a:hover::after,
.main-navigation .current-menu-item > a::after {
    background-color: var(--color-primary) !important;
}
.social-icon:hover {
    background-color: var(--color-primary) !important;
}
.footer-widget h3::after {
    background-color: var(--color-primary) !important;
}

/* === Courses Slider Section === */
.courses-slider-section {
    position: relative;
    overflow: hidden; 
}
.courses-slider-wrapper {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 20px 5px 40px;
    scrollbar-width: none; 
    -ms-overflow-style: none;  
}
.courses-slider-wrapper::-webkit-scrollbar {
    display: none; 
}
.course-slide-card {
    flex: 0 0 280px;
    scroll-snap-align: start;
    background-color: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    text-decoration: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
}
.course-slide-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}
.course-slide-img {
    height: 160px;
    background-size: cover;
    background-position: center;
    background-color: #ccc;
}
.course-slide-content {
    padding: 20px 15px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
}
.course-slide-badge {
    background-color: #f1ebd8;
    color: #6e2710;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 20px;
    margin-top: -35px;
    margin-bottom: 15px;
    position: relative;
    z-index: 2;
    border: 2px solid white;
}
.course-slide-title {
    color: #6e2710;
    font-size: 1.3rem;
    font-weight: 800;
    margin-bottom: 10px;
    line-height: 1.2;
}
.course-slide-instructor {
    color: #49928f;
    font-size: 0.95rem;
    font-weight: 600;
}

/* Slider Nav Arrows */
.slider-nav-btn {
    position: absolute;
    top: 55%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #49928f;
    color: white;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 3px 10px rgba(0,0,0,0.2);
    transition: background-color 0.3s ease;
}
.slider-nav-btn:hover {
    background-color: #387572;
}
.slider-prev {
    right: -15px;
}
.slider-next {
    left: -15px;
}
@media (max-width: 992px) {
    .slider-nav-btn {
        display: none; 
    }
}
/* Purchase Cards specific tweaks */
.purchase-card {
    border: 1px solid #eaeaea;
}
.purchase-badge {
    background-color: var(--color-primary);
    color: white;
}

/* === Books Catalog Shortcode Grid === */
.books-catalog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 30px;
    margin-top: 15px;
}
.book-card-item {
    background-color: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(73, 146, 143, 0.15); /* Brand color subtle glow */
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    border: 1px solid rgba(73, 146, 143, 0.2);
    display: flex;
    flex-direction: column;
    animation: bookGlowPulse 4s infinite alternate;
}
.book-card-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 35px rgba(73, 146, 143, 0.35); /* Stronger glow on hover */
    animation-play-state: paused;
}

@keyframes bookGlowPulse {
    0% { box-shadow: 0 4px 20px rgba(73, 146, 143, 0.15); }
    100% { box-shadow: 0 4px 25px rgba(73, 146, 143, 0.25); border-color: rgba(73, 146, 143, 0.3); }
}
.book-card-image {
    height: 300px;
    background-size: cover;
    background-position: top center;
    background-color: #f5f5f5;
    border-bottom: 1px solid #eee;
}
.book-card-info {
    padding: 20px 15px;
    text-align: center;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.book-card-title {
    font-size: 1.1rem;
    color: var(--color-primary);
    margin-bottom: 15px;
    font-weight: 700;
    line-height: 1.3;
}
.book-card-price {
    font-size: 1.2rem;
    font-weight: 800;
    color: #49928f;
}

/* Expand header container to prevent menu breaking into a new line */
.header-container.container {
    max-width: 1550px;
    padding: 0 40px;
}

/* === Single Book Page === */
.single-book-page { min-height: 60vh; }
.single-book-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--color-primary);
    text-decoration: none;
    margin-bottom: 30px;
    font-size: 0.95rem;
    font-weight: 600;
    transition: opacity 0.2s;
}
.single-book-back:hover { opacity: 0.7; }
.single-book-layout {
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 60px;
    align-items: start;
}
.single-book-image-wrap { position: sticky; top: 120px; }
.single-book-img {
    width: 100%;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.15);
    display: block;
    max-height: 600px;
    object-fit: cover;
}
.single-book-img-placeholder {
    width: 100%;
    aspect-ratio: 2/3;
    background: #f5f5f5;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 5rem;
}
.single-book-title {
    font-size: 2rem;
    color: var(--color-primary);
    font-weight: 900;
    line-height: 1.2;
    margin-bottom: 20px;
}
.single-book-price {
    font-size: 1.8rem;
    font-weight: 800;
    color: #49928f;
    margin-bottom: 30px;
    display: inline-block;
    background: #e5f1ec;
    padding: 8px 24px;
    border-radius: 30px;
}
.single-book-description {
    font-size: 1.05rem;
    line-height: 1.9;
    color: var(--color-text);
    margin-bottom: 30px;
    border-top: 1px solid #eee;
    padding-top: 25px;
}
.single-book-info-box {
    background: #fff9ec;
    border: 1px solid #f0d9a0;
    border-radius: 10px;
    padding: 18px 22px;
    font-size: 1rem;
    color: #7a5c10;
    font-weight: 600;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    line-height: 1.6;
    margin-top: 25px;
}
.single-book-info-icon { font-size: 1.4rem; flex-shrink: 0; }
@media (max-width: 768px) {
    .single-book-layout { grid-template-columns: 1fr; gap: 30px; }
    .single-book-image-wrap { position: static; max-width: 260px; margin: 0 auto; }
    .single-book-title { font-size: 1.6rem; }
}

/* Book card as link */
a.book-card-item {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
}
a.book-card-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

/* === Single Book Page Lightbox & Layout Adjustment === */
.single-book-layout {
    grid-template-columns: 1fr 420px !important; /* Text stretches on right, Image remains fixed on left */
}
.single-book-img {
    cursor: zoom-in;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.single-book-img:hover {
    transform: scale(1.02);
    box-shadow: 0 25px 65px rgba(0,0,0,0.2);
}
.book-lightbox {
    display: none;
    position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.9);
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    cursor: zoom-out;
}
.book-lightbox.active {
    display: flex;
    opacity: 1;
}
.book-lightbox-img {
    max-width: 90%;
    max-height: 90%;
    border-radius: 8px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
    transform: scale(0.9);
    transition: transform 0.3s ease;
}
.book-lightbox.active .book-lightbox-img {
    transform: scale(1);
}
@media (max-width: 768px) {
    .single-book-layout {
        display: flex;
        flex-direction: column-reverse; /* Put image first on mobile view */
    }
}

/* === Unified Contact Form & Section Mobile Fixes === */
@media (max-width: 768px) {
    /* 1. Section and Column Layouts */
    .contact-section-layout {
        grid-template-columns: 1fr !important;
        padding: 25px 20px !important;
        box-sizing: border-box !important;
        gap: 30px !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .contact-form-panel {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .ssf-form-container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        float: none !important;
    }

    /* 2. Form Wrapper and Internal Structure */
    .wpcf7 form, 
    .ssf-form-container form,
    .contact-form-panel form {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Force flex rows and grids inside the form to stack vertically */
    .wpcf7 form [style*="display: flex"],
    .wpcf7 form [style*="display:flex"],
    .ssf-form-container form [style*="display: flex"],
    .ssf-form-container form [style*="display:flex"],
    .wpcf7 form .row,
    .wpcf7 form .columns,
    .wpcf7 form .flex,
    .ssf-form-container form .row,
    .ssf-form-container form .flex,
    .ssf-form-container form .ssf-row,
    .ssf-form-container form .ssf-row-wrap {
        display: block !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Force form field columns and wraps to stack at 100% width */
    .wpcf7 form .col,
    .wpcf7 form .column,
    .wpcf7 form > p,
    .wpcf7 form > div,
    .ssf-form-container form > div,
    .ssf-form-container form > p,
    .ssf-form-container form .ssf-col,
    .ssf-form-container form [class*="ssf-col-"],
    .ssf-form-container form .ssf-field-wrap,
    .ssf-form-container form [style*="width"],
    .ssf-form-container form [style*="float"] {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        float: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 15px !important;
    }

    /* 3. Inputs, select fields, and textareas */
    .wpcf7 form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
    .wpcf7 form textarea,
    .wpcf7 form select,
    .ssf-form-container form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
    .ssf-form-container form textarea,
    .ssf-form-container form select {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 4. Google ReCAPTCHA Rescaling for Mobile */
    .wpcf7-recaptcha, 
    .g-recaptcha,
    .g-recaptcha > div {
        max-width: 100% !important;
        transform: scale(0.85) !important;
        transform-origin: right top !important;
    }
    
    /* Ensure recaptcha hidden response textarea stays hidden */
    .g-recaptcha-response,
    #g-recaptcha-response {
        display: none !important;
    }
}

/* === Mobile Back to Top Button === */
#back-to-top {
    display: none !important;
}

@media (max-width: 900px) {
    #back-to-top {
        display: flex !important;
        position: fixed;
        bottom: 20px;
        left: 20px; /* RTL layout: left side is ideal for floating buttons */
        background-color: var(--color-primary, #6b9e9b);
        color: white;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        z-index: 9999;
        cursor: pointer;
        transition: all 0.3s ease;
        opacity: 0;
        visibility: hidden;
        box-shadow: 0 4px 12px rgba(0,0,0,0.2);
        align-items: center;
        justify-content: center;
        text-decoration: none;
    }
    #back-to-top i {
        font-size: 11px;
        color: white !important;
    }
    #back-to-top.show {
        opacity: 1;
        visibility: visible;
    }
}

/* ============================================================================
   WEEKLY SCHEDULE (לו"ז שבועי) STYLES
   ============================================================================ */
.weekly-schedule-container {
    display: flex;
    flex-direction: column;
    gap: 25px;
    direction: rtl;
    width: 100%;
    margin: 30px auto;
    box-sizing: border-box;
}

.schedule-day-row {
    display: flex;
    gap: 15px;
    align-items: stretch;
    width: 100%;
    box-sizing: border-box;
}

.schedule-day-header {
    width: 130px;
    min-width: 130px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #ffffff;
    font-weight: 700;
    font-size: 1.25rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    padding: 15px 10px;
    box-sizing: border-box;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
    position: relative;
    overflow: hidden;
}

.schedule-items-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    flex: 1;
    align-items: stretch;
    box-sizing: border-box;
}

.schedule-lecture-card {
    flex: 1;
    min-width: 200px;
    max-width: 255px;
    background: #ffffff;
    border-radius: 15px;
    border: 1px solid rgba(0, 0, 0, 0.03);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
    padding: 14px 18px;
    box-sizing: border-box;
    text-decoration: none !important;
    color: var(--color-text-dark, #333333) !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

/* Add interactive hover glow & lift to all lecture cards */
.schedule-lecture-card:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 10px 22px rgba(169, 68, 66, 0.15) !important; /* Soft brand-colored glow shadow */
    border-color: rgba(169, 68, 66, 0.12) !important;
}

.lecture-time-name {
    font-size: 0.96rem;
    font-weight: 700;
    color: var(--color-primary, #a94442);
    margin-bottom: 5px;
    line-height: 1.3;
}

.lecture-topic {
    font-size: 0.85rem;
    font-weight: 500;
    color: #555555;
    line-height: 1.4;
}

/* Highlighted card state (matches reference pink/rose highlight) */
.schedule-lecture-card.highlighted {
    background-color: #f6e3e5 !important;
    border-color: rgba(169, 68, 66, 0.12) !important;
    box-shadow: 0 4px 12px rgba(169, 68, 66, 0.06);
}

a.schedule-lecture-card.highlighted:hover {
    background-color: #f3d6db !important;
}

/* Mobile Responsiveness for Schedule */
@media (max-width: 768px) {
    .weekly-schedule-container {
        gap: 20px;
    }
    
    .schedule-day-row {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    
    .schedule-day-header {
        width: 100%;
        min-width: 100%;
        height: 55px;
        padding: 10px;
        font-size: 1.15rem;
        border-radius: 12px;
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06);
    }
    
    .schedule-items-wrapper {
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }
    
    .schedule-lecture-card {
        max-width: 100% !important;
        min-width: 100% !important;
        padding: 14px 20px;
        border-radius: 12px;
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.03);
    }
}

/* ============================================================================
   HEADER SEARCH SYSTEM (DESKTOP & MOBILE)
   ============================================================================ */
/* Desktop Search Toggle Button */
.desktop-search-toggle:hover {
    background-color: rgba(73, 146, 143, 0.06);
    color: var(--color-primary) !important;
}

/* Desktop Search Dropdown */
.desktop-search-dropdown {
    display: none;
    position: absolute;
    left: 0;
    top: calc(100% + 12px);
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
    border-radius: 10px;
    padding: 10px;
    min-width: 260px;
    z-index: 9999;
}

.desktop-search-dropdown.active {
    display: block;
    animation: avivSearchFadeIn 0.2s ease-out;
}

@keyframes avivSearchFadeIn {
    from {
        opacity: 0;
        transform: translateX(0) translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateX(0) translateY(0);
    }
}

/* Mobile Search Wrap (Hidden on Desktop, Visible on Mobile) */
.mobile-search-wrap {
    display: none !important;
}

@media (max-width: 991px) {
    .mobile-search-wrap {
        display: block !important;
        padding: 15px 20px;
        background-color: #ffffff;
        border-bottom: 1px solid rgba(0, 0, 0, 0.04);
        box-sizing: border-box;
        width: 100%;
    }
    
    .mobile-search-form input[type="text"] {
        border: 1px solid rgba(0, 0, 0, 0.1) !important;
        font-family: inherit;
    }
    
    .mobile-search-form button {
        transition: background-color 0.2s ease;
    }
    
    .mobile-search-form button:hover {
        background-color: var(--color-primary-hover) !important;
    }
}
/* === Book catalog cards: kab.co.il-style hover (v1.10.2) ===
   Matches sefer.kab.co.il product tiles: the cover zooms in (scale 1.09)
   inside a light tile with overflow hidden, and a round action button
   slides up from the bottom of the image. */
.book-card-item {
    position: relative;
    background-color: #fff;
}
.book-card-image {
    background-size: contain;
    background-position: center;
    background-color: #f7f7f5;
    border-bottom: none;
    transition: transform 0.6s ease;
}
.book-card-item:hover .book-card-image {
    transform: scale(1.09);
}
/* Round "view book" button sliding up over the bottom of the image */
.book-card-item::after {
    content: '';
    position: absolute;
    top: 244px; /* image is 300px tall: 300 - 42 - 14 */
    left: 50%;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background-color: #ffffff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='%23333333' d='M288 80c-65.2 0-118.8 29.6-159.9 67.7C89.6 183.5 63 226 49.4 256c13.6 30 40.2 72.5 78.6 108.3C169.2 402.4 222.8 432 288 432s118.8-29.6 159.9-67.7C486.4 328.5 513 286 526.6 256c-13.6-30-40.2-72.5-78.6-108.3C406.8 109.6 353.2 80 288 80zM95.4 112.6C142.5 68.8 207.2 32 288 32s145.5 36.8 192.6 80.6c46.8 43.5 78.1 95.4 93 131.1c3.3 7.9 3.3 16.7 0 24.6c-14.9 35.7-46.2 87.7-93 131.1C433.5 443.2 368.8 480 288 480s-145.5-36.8-192.6-80.6C48.6 356 17.3 304 2.5 268.3c-3.3-7.9-3.3-16.7 0-24.6C17.3 208 48.6 156 95.4 112.6zM288 336c44.2 0 80-35.8 80-80s-35.8-80-80-80c-.7 0-1.3 0-2 0c1.3 5.1 2 10.5 2 16c0 35.3-28.7 64-64 64c-5.5 0-10.9-.7-16-2c0 .7 0 1.3 0 2c0 44.2 35.8 80 80 80z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 22px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
    transform: translate(-50%, 30px);
    opacity: 0;
    transition: transform 0.45s ease, opacity 0.45s ease;
    pointer-events: none;
    z-index: 2;
}
.book-card-item:hover::after {
    transform: translate(-50%, 0);
    opacity: 1;
}
/* Touch devices have no hover - keep tiles static there */
@media (hover: none) {
    .book-card-item:hover .book-card-image {
        transform: none;
    }
    .book-card-item::after {
        display: none;
    }
}

/* === Single book page: entry animation & floating cover (v1.10.1) === */
@keyframes bookPageEnter {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}
.single-book-info {
    animation: bookPageEnter 0.6s ease both;
}
.single-book-image-wrap {
    animation: bookPageEnter 0.7s 0.15s ease both;
    perspective: 900px;
}
.single-book-img {
    border-radius: 6px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18);
}
.single-book-img:hover {
    transform: scale(1.04) rotateY(-6deg);
    box-shadow: 0 30px 55px rgba(0, 0, 0, 0.25);
}