/* ===== VARIABLES ===== */
/* ===== CUSTOM HEBREW FONT (YehudaCLM) ===== */
/* Custom Hebrew font Yehuda CLM (Light 300 / Bold 700) */
@font-face {
    font-family: 'Yehuda CLM';
    src: url('../fonts/yehudaclm-light-webfont.woff') format('woff'),
         url('../fonts/yehudaclm-light-webfont.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0590-05FF, U+200C-200F, U+20AA; /* Basic Latin + Hebrew + control + shekel */
}
@font-face {
    font-family: 'Yehuda CLM';
    src: url('../fonts/yehudaclm-bold-webfont.woff') format('woff'),
         url('../fonts/yehudaclm-bold-webfont.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0590-05FF, U+200C-200F, U+20AA;
}

:root {
    /* Colors - Luxury Jazz Theme */
    --primary-gold: #C9A861;
    --primary-gold-dark: #B8941F;
    --secondary-bronze: #CD7F32;
    --deep-navy: #1a1a2e;
    --dark-charcoal: #16213e;
    --soft-cream: #f7f5f3;
    --warm-white: #fafafa;
    --accent-blue: #0f3460;
    --text-light: #e0e0e0;
    --text-dark: #333333;
    --gradient-primary: linear-gradient(135deg, #D4AF37 0%, #B8941F 100%);
    --gradient-secondary: linear-gradient(135deg, #CD7F32 0%, #D4AF37 100%);
    --gradient-dark: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    
    /* Typography */
    --font-primary: 'Playfair Display', serif;
    --font-secondary: 'Inter', sans-serif;
    
    /* Spacing */
    --section-padding: 80px 0;
    --container-padding: 0 20px;
    
    /* Shadows */
    --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.1);
    --shadow-medium: 0 15px 40px rgba(0, 0, 0, 0.15);
    --shadow-strong: 0 20px 50px rgba(0, 0, 0, 0.2);
    --shadow-gold: 0 10px 30px rgba(212, 175, 55, 0.3);
    
    /* Transitions */
    --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== RESET & BASE ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

body {
    font-family: var(--font-secondary);
    line-height: 1.6;
    color: var(--text-dark);
    background-color: var(--warm-white);
    overflow-x: hidden;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--container-padding);
}

/* ===== NAVIGATION ===== */
.navbar {
    position: fixed;
    top: 0;
    width: 100%;
    background: rgba(26, 26, 46, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 15px 0;
    transition: var(--transition-smooth);
}

.navbar.scrolled {
    background: rgba(26, 26, 46, 0.98);
    box-shadow: var(--shadow-medium);
}

.nav-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.nav-logo h2 {
    /* Match subtitle font family (secondary) but keep luxury gold color */
    font-family: var(--font-secondary);
    color: var(--primary-gold);
    font-size: 1.5rem; /* balanced size for all pages */
    font-weight: bold;   /* bold emphasis */
    letter-spacing: .5px;
    margin-bottom: 2px;
    line-height: 1.1;
}

/* Hebrew-specific nav logo font (align with hero Hebrew aesthetic) */
html[lang='he'] .nav-logo h2 {
        font-family: 'Yehuda CLM', var(--font-secondary), sans-serif;
        font-weight: bold;
}

/* Responsive tweak: reduce size on narrow screens to avoid wrapping */
@media (max-width: 600px) {
    .nav-logo h2 { font-size: 1.7rem; }
}

.nav-logo .subtitle {
    color: var(--text-light);
    font-size: 0.9rem;
    font-weight: 300;
    letter-spacing: 2px;
}

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

.nav-link {
    color: var(--text-light);
    text-decoration: none;
    font-weight: 500;
    font-size: 0.9rem;
    padding: 10px 0;
    position: relative;
    transition: var(--transition-smooth);
}

.nav-link:visited {
    color: var(--text-light);
    text-decoration: none;
}

.nav-link:hover {
    color: var(--primary-gold);
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 2px;
    background: var(--gradient-primary);
    transition: var(--transition-smooth);
}

.nav-link:hover::after {
    width: 100%;
}

/* Language Switcher */
.language-switcher {
    display: flex !important;
    gap: 10px;
    margin-right: 20px;
    align-items: center;
    order: 999; /* Make sure it appears at the end */
}

.lang-btn {
    background: linear-gradient(135deg, var(--primary-gold), var(--secondary-bronze));
    color: var(--text-dark);
    border: none;
    padding: 8px 12px;
    border-radius: 20px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9rem;
    transition: var(--transition-smooth);
    text-decoration: none;
    display: inline-block !important;
    min-width: 35px;
    text-align: center;
}

.lang-btn:hover {
    background: linear-gradient(135deg, var(--secondary-bronze), var(--primary-gold));
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(212, 175, 55, 0.4);
}

.lang-btn.active {
    background: var(--text-light);
    color: var(--primary-gold);
    box-shadow: 0 3px 10px rgba(212, 175, 55, 0.3);
}

.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 4px;
}

.hamburger .bar {
    width: 25px;
    height: 3px;
    background: var(--primary-gold);
    transition: var(--transition-smooth);
}

/* ===== BUTTONS ===== */
.btn {
    display: inline-block;
    padding: 15px 30px;
    text-decoration: none;
    border-radius: 50px;
    font-weight: 600;
    font-size: 1rem;
    text-align: center;
    transition: var(--transition-smooth);
    border: 2px solid transparent;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: var(--transition-smooth);
}

.btn:hover::before {
    left: 100%;
}

.btn-primary {
    background: var(--gradient-primary);
    color: white;
    box-shadow: var(--shadow-gold);
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 40px rgba(212, 175, 55, 0.4);
}

.btn-secondary {
    background: transparent;
    color: var(--primary-gold);
    border: 2px solid var(--primary-gold);
}

.btn-secondary:hover {
    background: var(--primary-gold);
    color: white;
    transform: translateY(-3px);
    box-shadow: var(--shadow-gold);
}

.btn-outline {
    background: transparent;
    color: var(--deep-navy);
    border: 2px solid var(--deep-navy);
}

.btn-outline:hover {
    background: var(--deep-navy);
    color: white;
    transform: translateY(-3px);
    box-shadow: var(--shadow-medium);
}

/* ===== HERO SECTION ===== */
.hero {
    min-height: 100vh;
    background: var(--gradient-dark);
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
}

/* Full width variant */
.hero-full {
    padding-top: 0;
}

.hero-background-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
}

.hero-background-video .hero-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover;
    filter: brightness(0.55) contrast(1.05) saturate(1.1);
}

.hero-content.single-column {
        .hero-inner { position:relative; padding:46px 0 44px; }
    z-index: 2;
    max-width: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    padding: 0 20px;
}

.hero-text.center { text-align: center; }

.hero-buttons { justify-content: center; }

.hero-video-controls { z-index: 3; }

/* Reposition video controls for background mode */
.hero-full .hero-video-controls {
    position: absolute;
    bottom: 20px;
    left: 20px;
}

/* Scroll indicator clickable anchor */
.scroll-indicator { cursor: pointer; }
.scroll-indicator:hover .scroll-arrow { color: var(--text-light); }

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="50" cy="50" r="0.5" fill="%23D4AF37" opacity="0.12"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');
    opacity: 0.18; /* lighter so הרקע פחות כהה */
}

.hero-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.hero-title {
    font-family: var(--font-primary);
    font-size: 4rem;
    color: var(--primary-gold);
    margin-bottom: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
    letter-spacing: 1px; /* subtle spacing */
}

/* Modern override for hero title (Rubik or future modern font) */
/* Base modern style (neutral fallback fonts) */
.hero-title.modern {
    font-family: 'Rubik', 'Heebo', 'Assistant', var(--font-secondary), sans-serif;
    font-weight: 600;
    letter-spacing: .5px;
}

/* Apply Yehuda CLM ONLY when page language is Hebrew */
html[lang='he'] .hero-title.modern {
    font-family: 'Yehuda CLM', 'Rubik', 'Heebo', 'Assistant', var(--font-secondary), sans-serif;
    font-weight: 700; /* Use bold variant for emphasis */
}

/* Utility class if you want to apply Yehuda CLM elsewhere */
/* Utility class for applying the new Hebrew font manually */
.font-hebrew { font-family: 'Yehuda CLM', 'Rubik', 'Heebo', 'Assistant', var(--font-secondary), sans-serif !important; }

/* HERO SUBTITLE (clean, single definition) */
.hero-subtitle {
    font-size: 1.6rem;
    color: var(--soft-cream);
    margin-bottom: 12px;
    font-weight: 400;
    letter-spacing: .7px;
    line-height: 1.22;
    text-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* Option: gold variant if desired */
.hero-subtitle.gold { color: var(--primary-gold); }

.hero-description {
    font-size: 1.08rem;
    color: var(--text-light);
    margin-bottom: 32px; /* less vertical space */
    line-height: 1.65; /* slightly tighter */
    opacity: 0.92;
 }

/* Rotating text container (separate from description) */
.hero-rotating {
    height: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 16px;
    position: relative;
}
.hero-rotating .rotating-current {
    font-size: 1.6rem;
    color: var(--soft-cream);
    font-weight: 500;
    letter-spacing: 1px;
    opacity: 0;
    animation: fadeRotateIn 0.7s ease forwards;
}
@keyframes fadeRotateIn {
    0% { opacity: 0; transform: translateY(12px) scale(.98); filter: blur(4px); }
    60% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
    100% { opacity: 1; }
}
.rotating-exit { animation: fadeRotateOut .5s ease forwards; }
@keyframes fadeRotateOut {
    0% { opacity: 1; transform: translateY(0) scale(1); }
    100% { opacity: 0; transform: translateY(-10px) scale(.97); }
}

.hero-buttons {
    display: flex;
    gap: 20px;
}

.hero-image {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px !important;
}

.profile-image {
    width: 400px;
    height: 400px;
    border-radius: 50%;
    object-fit: cover;
    border: 5px solid var(--primary-gold);
    box-shadow: var(--shadow-gold);
    transition: var(--transition-smooth);
    position: relative;
}

/* New hero video wrapper */
.hero-video-wrapper {
    position: relative;
    width: 100%;
    max-width: 520px;
    aspect-ratio: 1/1; /* keep square for balanced composition */
    margin: 40px auto 0 auto;
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,0.45), 0 0 0 4px rgba(212,175,55,0.4);
    background: radial-gradient(circle at 30% 30%, rgba(212,175,55,0.15), rgba(26,26,46,0.9));
}

.hero-video-wrapper::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(145deg, rgba(26,26,46,0.4) 0%, rgba(26,26,46,0.1) 60%, rgba(212,175,55,0.15) 100%);
    pointer-events: none;
    z-index: 2;
}

.hero-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: saturate(110%) contrast(105%);
    opacity: 0;
    transition: opacity 1.2s ease-in;
}

.hero-video.fade-in {
    opacity: 1;
}

.hero-video.fade-out {
    opacity: 0;
    transition: opacity 1s ease-out;
}

/* Reduce circular image prominence now not used for hero */
.profile-image { display: none; }

/* Hero video controls */
.hero-video-controls {
    position: absolute;
    bottom: 12px;
    left: 12px;
    display: flex;
    gap: 10px;
    z-index: 5;
}

.hero-video-controls .video-btn {
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(212,175,55,0.6);
    color: var(--primary-gold);
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1.1rem;
    transition: var(--transition-smooth);
    position: relative;
    box-shadow: 0 6px 18px rgba(0,0,0,0.4);
}

.hero-video-controls .video-btn:hover {
    transform: translateY(-3px) scale(1.05);
    background: rgba(0,0,0,0.65);
    box-shadow: 0 10px 28px rgba(0,0,0,0.55), 0 0 0 2px rgba(212,175,55,0.35);
}

.hero-video-controls .video-btn:active {
    transform: scale(0.92);
}

.hero-video-controls .video-btn i {
    pointer-events: none;
}

@media (max-width: 768px) {
  .hero-video-wrapper { max-width: 100%; border-radius: 20px; }
  .hero-video-controls { bottom: 10px; left: 10px; }
  .hero-video-controls .video-btn { width: 40px; height: 40px; font-size: 1rem; }
}

.profile-image:hover {
    transform: scale(1.05);
    box-shadow: 0 15px 40px rgba(212, 175, 55, 0.4);
}

.image-placeholder {
    width: 400px;
    height: 400px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 1.1rem;
    text-align: center;
    box-shadow: var(--shadow-gold);
    position: relative;
    overflow: hidden;
}

.image-placeholder i {
    font-size: 80px;
    margin-bottom: 20px;
    opacity: 0.8;
}

.scroll-indicator {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.scroll-arrow {
    color: var(--primary-gold);
    font-size: 2rem;
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
    60% {
        transform: translateY(-5px);
    }
}

/* ===== SECTIONS ===== */
.section-title {
    font-family: var(--font-primary);
    font-size: 3rem;
    text-align: center;
    margin-bottom: 60px;
    color: var(--deep-navy);
    position: relative;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: var(--gradient-primary);
    border-radius: 2px;
}
/* About page timeline title font refinement */
.about-main .timeline-section .section-title { font-family:'Playfair Display',serif; letter-spacing:.6px; }
html[lang='he'] .about-main .timeline-section .section-title { font-family:'Yehuda CLM','Playfair Display',serif; }
/* Timeline item titles font refinement */
.about-main .timeline .timeline-title { font-family:'Playfair Display',serif; letter-spacing:.4px; font-weight:600; }
html[lang='he'] .about-main .timeline .timeline-title { font-family:'Yehuda CLM','Playfair Display',serif; }

/* ===== SERVICES SECTION ===== */
.services {
    padding: var(--section-padding);
    background: var(--soft-cream);
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
    margin-top: 60px;
}

.service-card {
    background: white;
    padding: 40px 30px;
    border-radius: 20px;
    text-align: center;
    box-shadow: var(--shadow-soft);
    transition: var(--transition-smooth);
    position: relative;
    overflow: hidden;
}

.service-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--gradient-primary);
    transform: scaleX(0);
    transition: var(--transition-smooth);
}

.service-card:hover::before {
    transform: scaleX(1);
}

.service-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-medium);
}

.service-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    color: white;
    font-size: 2.5rem;
    box-shadow: var(--shadow-gold);
    line-height: 1;
}

/* Service card heading */
.service-card h3 {
    font-family: var(--font-primary);
    font-size: 1.8rem;
    margin-bottom: 20px;
    color: var(--deep-navy);
}

/* ===== EVENTS GRID / CARDS ===== */
.events-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 32px;
    margin-top: 32px;
}

.event-card {
    background: #101317;
    border: 1px solid rgba(201,168,97,0.35);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 16px rgba(0,0,0,0.35);
    transition: transform .4s ease, box-shadow .4s ease, border-color .4s ease;
    position: relative;
}
.event-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 28px -4px rgba(0,0,0,0.55);
    border-color: var(--primary-gold);
}

.event-card-media {
    position: relative;
    aspect-ratio: 16/9;
    background: #1d2228;
    overflow: hidden;
}
.event-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 1.2s ease;
}
.event-card:hover .event-card-media img { transform: scale(1.08); }

/* Date badge (day + month stacked) */
.event-date-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 62px;
    height: 74px;
    background: var(--primary-gold);
    color: #1a1f24;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    box-shadow: 0 6px 18px -4px rgba(0,0,0,0.45);
    line-height: 1.05;
    letter-spacing: .5px;
}
.event-date-badge .day {
    font-size: 1.55rem;
    font-weight: 700;
    margin-bottom: 4px;
}
.event-date-badge .month {
    font-size: .75rem;
    font-weight: 600;
}
html[dir='rtl'] .event-date-badge { right: 10px; left: auto; }

.event-card-body {
    padding: 20px 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.event-card-title { margin: 0 0 4px; font-size: 1.15rem; line-height: 1.3; }
.event-card-link { color: var(--soft-cream); text-decoration: none; transition: color .3s; }
.event-card-link:hover { color: var(--primary-gold); }

.event-meta { font-size: .9rem; line-height: 1.4; color: var(--soft-cream); display: flex; flex-direction: column; gap: 4px; }
.event-location { font-size: .85rem; opacity: .9; color: var(--soft-cream); }
.event-address { display: inline-block; margin-inline-start: 4px; }
html[dir='rtl'] .event-address { margin-inline-start: 0; margin-inline-end: 4px; }

.event-description { font-size: .92rem; color: var(--soft-cream); opacity: .95; line-height: 1.5; margin: 0; }

.event-actions { margin-top: auto; }
.btn.btn-ticket {
    display: inline-block;
    background: var(--gradient-primary);
    color: #1d1f21;
    font-weight: 600;
    padding: 10px 18px;
    border-radius: 12px;
    text-decoration: none;
    font-size: .9rem;
    letter-spacing: .5px;
    box-shadow: 0 4px 14px -4px rgba(0,0,0,0.5), 0 0 0 1px rgba(201,168,97,0.35) inset;
    transition: background .5s ease, transform .25s ease, box-shadow .4s ease;
}
.btn.btn-ticket:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 22px -6px rgba(0,0,0,0.65), 0 0 0 1px rgba(201,168,97,0.6) inset;
}
.btn.btn-ticket:active { transform: translateY(-1px); }

@media (max-width: 640px) {
    .events-grid { grid-template-columns: 1fr; }
    .event-card { border-radius: 16px; }
    .event-card-title { font-size: 1.05rem; }
}

.service-card p {
    margin-bottom: 25px;
    line-height: 1.8;
    color: var(--text-dark);
}

.service-link {
    color: var(--primary-gold);
    text-decoration: none;
    font-weight: 600;
    transition: var(--transition-smooth);
}

.service-link:hover {
    color: var(--primary-gold-dark);
}

/* ===== ABOUT PREVIEW SECTION ===== */
.about-preview {
    padding: var(--section-padding);
    background: white;
}

.about-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.about-text h2 {
    font-family: var(--font-primary);
    font-size: 2.5rem;
    margin-bottom: 30px;
    color: var(--deep-navy);
}

.about-text p {
    margin-bottom: 20px;
    line-height: 1.8;
    font-size: 1.1rem;
}

.about-image .image-placeholder {
    width: 300px;
    height: 300px;
    border-radius: 20px;
    background: var(--gradient-secondary);
}

/* ===== CONTACT PREVIEW SECTION ===== */
.contact-preview {
    padding: var(--section-padding);
    background: var(--gradient-dark);
    color: white;
    text-align: center;
}

.contact-preview .section-title {
    color: var(--primary-gold);
}

.contact-info {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin: 40px 0;
    flex-wrap: wrap;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 1.1rem;
}

.contact-item i {
    color: var(--primary-gold);
    font-size: 1.3rem;
}

/* ===== FOOTER ===== */
.footer {
    background: var(--deep-navy);
    color: var(--text-light);
    padding: 50px 0 20px;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
    margin-bottom: 30px;
}

.footer-section h3,
.footer-section h4 {
    color: var(--primary-gold);
    margin-bottom: 20px;
    font-family: var(--font-primary);
}

.footer-section ul {
    list-style: none;
}

.footer-section ul li {
    margin-bottom: 10px;
}

.footer-section ul li a {
    color: var(--text-light);
    text-decoration: none;
    transition: var(--transition-smooth);
}

.footer-section ul li a:hover {
    color: var(--primary-gold);
}

.social-links {
    display: flex;
    gap: 15px;
}

.social-link {
    width: 45px;
    height: 45px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    text-decoration: none;
    transition: var(--transition-smooth);
    box-shadow: var(--shadow-gold);
}

.social-link:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(212, 175, 55, 0.4);
}

.footer-bottom {
    text-align: center;
    padding-top: 30px;
    border-top: 1px solid rgba(212, 175, 55, 0.3);
    color: var(--text-light);
    opacity: 0.8;
}

/* ===== ANIMATIONS ===== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
}

.fade-in-right {
    animation: fadeInRight 0.8s ease-out forwards;
}

/* ===== PAGE HEADERS ===== */
.page-header {
    background: var(--gradient-dark);
    color: white;
    padding: 120px 0 80px;
    position: relative;
    overflow: hidden;
}

.page-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="50" cy="50" r="0.5" fill="%23D4AF37" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');
    opacity: 0.3;
    .hero-overlay-tint { position: absolute; inset: 0; background: radial-gradient(circle at 40% 50%, rgba(0,0,0,0.25), rgba(0,0,0,0.65)); mix-blend-mode: multiply; z-index: 1; }
}

.page-title {
    font-family: var(--font-primary);
    font-size: 3.5rem;
    margin-bottom: 20px;
    color: var(--primary-gold);
    position: relative;
    z-index: 2;
}

.page-subtitle {
    font-size: 1.3rem;
    opacity: 0.9;
    position: relative;
    z-index: 2;
}

/* ===== ABOUT PAGE STYLES ===== */
.about-full {
    padding: var(--section-padding);
}

.about-intro {
    margin-bottom: 80px;
}

.intro-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.intro-text h2 {
    font-family: var(--font-primary);
    font-size: 2.5rem;
    margin-bottom: 30px;
    color: var(--deep-navy);
}

.intro-text .lead {
    font-size: 1.2rem;
    font-weight: 500;
    margin-bottom: 25px;
    color: var(--primary-gold-dark);
    line-height: 1.8;
}

.intro-text p {
    margin-bottom: 20px;
    line-height: 1.8;
    font-size: 1.1rem;
}

/* ===== ABOUT PAGE INTRO SECTION ===== */
.intro-section {
    padding: 60px 0;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

.intro-content {
    max-width: 100%;
    margin: 0 auto;
    padding: 50px 60px;
    background: white;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Hebrew content alignment */
.intro-content[data-lang="he"] {
    direction: rtl;
}

/* English content alignment */
.intro-content[data-lang="en"] {
    direction: ltr;
}

.intro-text {
    font-size: 1.3rem;
    line-height: 1.8;
    color: var(--text-dark);
    margin: 0;
    font-weight: 400;
    letter-spacing: 0.3px;
    width: 100%;
    display: block;
    hyphens: none;
    word-break: keep-all;
    overflow-wrap: normal;
    white-space: normal;
    text-align: justify;
}

/* Hebrew text styling */
.intro-content[data-lang="he"] .intro-text {
    direction: rtl;
    text-align: right;
    word-spacing: 0.1em;
    word-break: keep-all;
    overflow-wrap: break-word;
    hyphens: none;
}

/* English text styling */
.intro-content[data-lang="en"] .intro-text {
    direction: ltr;
    text-align: justify;
    word-spacing: 0.2em;
}

/* Language suggestion banner (progressive enhancement) */
.lang-suggest-banner button {
    background: var(--primary-gold, #C9A861);
    color: #000;
    border: none;
    padding: 4px 10px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
}
.lang-suggest-banner button.dismiss {
    background: transparent;
    color: #fff;
    font-weight: 400;
}

/* ===== TIMELINE ===== */
.experience-section {
    margin-bottom: 80px;
}

.timeline {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
}

.timeline::before {
    content: '';
    position: absolute;
    right: 50%;
    transform: translateX(50%);
    width: 4px;
    height: 100%;
    background: var(--gradient-primary);
    border-radius: 2px;
}

.timeline-item {
    position: relative;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    gap: 30px;
}

.timeline-item:nth-child(odd) {
    flex-direction: row-reverse;
}

.timeline-year {
    background: var(--gradient-primary);
    color: white;
    padding: 15px 25px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 1.1rem;
    white-space: nowrap;
    box-shadow: var(--shadow-gold);
    position: relative;
    z-index: 2;
}

.timeline-content {
    background: white;
    padding: 30px;
    border-radius: 15px;
    box-shadow: var(--shadow-soft);
    flex: 1;
    position: relative;
    transition: var(--transition-smooth);
}

.timeline-content:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-medium);
}

.timeline-content h3 {
    font-family: var(--font-primary);
    font-size: 1.5rem;
    margin-bottom: 15px;
    color: var(--deep-navy);
}

.timeline-content p {
    line-height: 1.7;
    color: var(--text-dark);
}

/* ===== SKILLS SECTION ===== */
.skills-section {
    margin-bottom: 80px;
    background: var(--soft-cream);
    padding: 60px 0;
    border-radius: 20px;
}

.skills-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
}

.skill-item {
    text-align: center;
}

.skill-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    color: white;
    font-size: 2.5rem;
    box-shadow: var(--shadow-gold);
    line-height: 1;
}

.skill-item h3 {
    font-family: var(--font-primary);
    font-size: 1.5rem;
    margin-bottom: 20px;
    color: var(--deep-navy);
}

.skill-bar {
    background: rgba(26, 26, 46, 0.1);
    height: 8px;
    border-radius: 4px;
    margin: 20px 0;
    overflow: hidden;
}

.skill-progress {
    height: 100%;
    background: var(--gradient-primary);
    border-radius: 4px;
    width: 0;
    transition: width 1.5s ease-in-out;
}

.skill-item p {
    color: var(--text-dark);
    line-height: 1.6;
    margin-top: 15px;
}

/* ===== PHILOSOPHY SECTION ===== */
.philosophy-section {
    margin-bottom: 80px;
}

.philosophy-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
}

.philosophy-item {
    background: white;
    padding: 40px 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: var(--shadow-soft);
    transition: var(--transition-smooth);
    position: relative;
    overflow: hidden;
}

.philosophy-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--gradient-primary);
    transform: scaleX(0);
    transition: var(--transition-smooth);
}

.philosophy-item:hover::before {
    transform: scaleX(1);
}

.philosophy-item:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-medium);
}

.philosophy-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-secondary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    color: white;
    font-size: 1.8rem;
}

.philosophy-item h3 {
    font-family: var(--font-primary);
    font-size: 1.3rem;
    margin-bottom: 15px;
    color: var(--deep-navy);
}

.philosophy-item p {
    line-height: 1.7;
    color: var(--text-dark);
}

/* ===== ACHIEVEMENTS SECTION ===== */
.achievements-section {
    margin-bottom: 80px;
}

.achievements-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
}

.achievement-item {
    background: var(--gradient-dark);
    color: white;
    padding: 40px 30px;
    border-radius: 15px;
    text-align: center;
    transition: var(--transition-smooth);
    position: relative;
    overflow: hidden;
}

.achievement-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--gradient-primary);
    opacity: 0;
    transition: var(--transition-smooth);
}

.achievement-item:hover::before {
    opacity: 0.1;
}

.achievement-item:hover {
    transform: translateY(-10px);
}

.achievement-icon {
    width: 70px;
    height: 70px;
    background: var(--primary-gold);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    color: var(--deep-navy);
    font-size: 1.8rem;
    position: relative;
    z-index: 2;
}

.achievement-item h3 {
    font-family: var(--font-primary);
    font-size: 1.3rem;
    margin-bottom: 15px;
    color: var(--primary-gold);
    position: relative;
    z-index: 2;
}

.achievement-item p {
    line-height: 1.7;
    opacity: 0.9;
    position: relative;
    z-index: 2;
}

/* ===== CTA SECTION ===== */
.cta-section {
    background: var(--gradient-primary);
    color: white;
    padding: 80px 0;
    text-align: center;
}

.cta-section h2 {
    font-family: var(--font-primary);
    font-size: 2.5rem;
    margin-bottom: 20px;
}

.cta-section p {
    font-size: 1.2rem;
    margin-bottom: 40px;
    opacity: 0.9;
}

.cta-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.cta-buttons .btn {
    background: white;
    color: var(--deep-navy);
    border: 2px solid white;
}

.cta-buttons .btn:hover {
    background: transparent;
    color: white;
}

/* ===== LESSONS PAGE STYLES ===== */
.lessons-overview {
    padding: var(--section-padding);
    background: white;
}

.overview-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.overview-text h2 {
    font-family: var(--font-primary);
    font-size: 2.5rem;
    margin-bottom: 30px;
    color: var(--deep-navy);
}

.overview-text .lead {
    font-size: 1.2rem;
    font-weight: 500;
    margin-bottom: 25px;
    color: var(--primary-gold-dark);
    line-height: 1.8;
}

.overview-features {
    list-style: none;
    margin-top: 30px;
}

.overview-features li {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    font-size: 1.1rem;
}

.overview-features i {
    color: var(--primary-gold);
    font-size: 1.2rem;
}

.lessons-types {
    padding: var(--section-padding);
    background: var(--soft-cream);
}

.lessons-grid {
    display: flex;
    flex-wrap: nowrap;
    gap: 30px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px;
    scroll-snap-type: x mandatory;
}

.lessons-grid::-webkit-scrollbar {
    height: 10px;
}
.lessons-grid::-webkit-scrollbar-track {
    background: var(--soft-cream);
    border-radius: 10px;
}
.lessons-grid::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, var(--primary-gold), var(--accent-gold));
    border-radius: 10px;
}

.lesson-card {
    flex: 0 0 350px;
    scroll-snap-align: start;
}

.lesson-card {
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-soft);
    transition: var(--transition-smooth);
    position: relative;
}

/* הדגשה מוזהבת לסקסופון */
.sax-highlight {
    border: 3px solid var(--primary-gold);
    box-shadow: 0 6px 20px -4px rgba(218,165,32,0.55), 0 0 0 4px rgba(218,165,32,0.15) inset;
}
.sax-highlight .lesson-header {
    background: linear-gradient(135deg, #2c2100 0%, #5a4300 55%, #8a6500 100%);
    color: #fff;
}
.sax-highlight:hover {
    transform: translateY(-10px) scale(1.015);
    box-shadow: 0 10px 26px -5px rgba(218,165,32,0.65), 0 0 0 4px rgba(218,165,32,0.20) inset;
}

.lesson-card.featured {
    transform: scale(1.05);
    border: 3px solid var(--primary-gold);
}

/* Featured style no longer used (removed) */

.featured-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background: var(--gradient-primary);
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    z-index: 2;
}

.lesson-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-medium);
}

/* remove hover transform coupling for removed featured class */

/* Trial lesson CTA inside featured card */
.lesson-cta {
    margin-top: 18px;
    text-align: center;
}

.lesson-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--gradient-primary);
    color: #fff;
    padding: 14px 28px;
    border-radius: 40px;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    box-shadow: 0 6px 18px -4px rgba(218,165,32,0.45);
    position: relative;
    overflow: hidden;
    transition: background .4s ease, transform .3s ease, box-shadow .3s ease;
    text-decoration: none;
}

.lesson-cta-btn:before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.35), transparent 60%);
    opacity: 0;
    transition: opacity .5s ease;
}

.lesson-cta-btn:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 28px -6px rgba(218,165,32,0.55);
}

.lesson-cta-btn:hover:before { opacity: 1; }

.lesson-cta-btn:active { transform: translateY(-1px); }

/* Breathing animation (only on featured card button) */
/* Featured animation removed */

@keyframes lessonPulse {
    0%, 100% { box-shadow: 0 6px 18px -4px rgba(218,165,32,0.40); }
    50% { box-shadow: 0 8px 24px -4px rgba(218,165,32,0.60); }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    .lesson-cta-btn { animation: none; }
}

/* WhatsApp link section */
.lessons-whatsapp {
    margin-top: 35px;
    text-align: center;
}

.whatsapp-link {
    display: inline-block;
    background: #25D366;
    color: #fff;
    padding: 14px 28px;
    border-radius: 40px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 6px 16px -4px rgba(0,0,0,0.25);
    transition: background .3s ease, transform .3s ease;
}
.whatsapp-link:hover { background:#1ebe59; transform: translateY(-3px); }
.whatsapp-link:active { transform: translateY(-1px); }

/* Floating WhatsApp button */
.floating-whatsapp {
    position: fixed;
    bottom: 22px;
    inset-inline-end: 22px; /* RTL/LTR friendly */
    background: #25D366;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.6rem;
    text-decoration: none;
    box-shadow: 0 8px 22px -6px rgba(0,0,0,0.35);
    z-index: 1200;
    transition: transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.floating-whatsapp:hover {
    transform: translateY(-4px);
    background: #1ebe59;
    box-shadow: 0 12px 28px -8px rgba(0,0,0,0.45);
}
.floating-whatsapp:active { transform: translateY(-1px); }
@media (max-width: 520px) {
    .floating-whatsapp { width:54px; height:54px; font-size:1.4rem; bottom:16px; inset-inline-end:16px; }
}

/* Testimonials Section */
.testimonials {
    padding: var(--section-padding);
    background: #fffefb;
    position: relative;
}
.testimonials:before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 70% 20%, rgba(218,165,32,0.08), transparent 55%);
    pointer-events: none;
}
.testimonials .section-title { margin-bottom: 45px; }
.testimonials-grid {
    display: grid;
    gap: 28px;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.testimonial-item {
    background: #ffffff;
    border: 1px solid rgba(218,165,32,0.25);
    border-radius: 18px;
    padding: 26px 24px 20px;
    position: relative;
    box-shadow: 0 6px 16px -6px rgba(0,0,0,0.15);
    transition: transform .35s ease, box-shadow .35s ease;
}
.testimonial-item:before {
    content: "\201C"; /* opening quote */
    position: absolute;
    top: -18px;
    inset-inline-start: 22px;
    font-size: 4.5rem;
    line-height: 1;
    color: rgba(218,165,32,0.18);
    font-family: Georgia, serif;
    pointer-events: none;
}
.testimonial-item p {
    margin: 0 0 14px;
    font-size: 0.95rem;
    line-height: 1.55;
    font-weight: 500;
}
.testimonial-meta {
    font-size: 0.8rem;
    letter-spacing: 0.5px;
    color: #7a6530;
    font-weight: 600;
    text-transform: uppercase;
}
.testimonial-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 28px -8px rgba(0,0,0,0.25);
}
@media (prefers-reduced-motion: reduce) {
    .testimonial-item, .floating-whatsapp { transition: none; }
}

.lesson-header {
    padding: 40px 30px 20px;
    text-align: center;
    background: var(--gradient-dark);
    color: white;
}

.lesson-icon {
    width: 80px;
    height: 80px;
    background: var(--primary-gold);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    color: var(--deep-navy);
    font-size: 2.5rem;
    line-height: 1;
}

.lesson-header h3 {
    font-family: var(--font-primary);
    font-size: 1.8rem;
    margin-bottom: 10px;
}

.lesson-content {
    padding: 30px;
}

.lesson-content > p {
    font-size: 1.1rem;
    margin-bottom: 25px;
    color: var(--text-dark);
}

.lesson-features {
    list-style: none;
    margin-bottom: 30px;
}

.lesson-features li {
    padding: 8px 0;
    border-bottom: 1px solid rgba(26, 26, 46, 0.1);
    font-size: 1rem;
}

.lesson-features li:last-child {
    border-bottom: none;
}

.lesson-price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0;
    border-top: 2px solid var(--soft-cream);
}

.lesson-price .price {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-gold);
    font-family: var(--font-primary);
}

.lesson-price .duration {
    color: var(--text-dark);
    font-size: 0.9rem;
}

/* Learning Paths */
.learning-paths {
    padding: var(--section-padding);
    background: white;
}

.paths-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.path-card {
    background: var(--gradient-dark);
    color: white;
    border-radius: 15px;
    overflow: hidden;
    transition: var(--transition-smooth);
}

.path-card:hover {
    transform: translateY(-5px);
}

.path-header {
    padding: 30px;
    text-align: center;
    background: rgba(212, 175, 55, 0.1);
}

.path-header h3 {
    font-family: var(--font-primary);
    font-size: 1.8rem;
    margin-bottom: 10px;
    color: var(--primary-gold);
}

.path-duration {
    font-size: 1rem;
    opacity: 0.8;
}

.path-content {
    padding: 30px;
}

.path-content p {
    margin-bottom: 25px;
    font-size: 1.1rem;
}

.path-goals {
    list-style: none;
}

.path-goals li {
    padding: 8px 0;
    padding-right: 20px;
    position: relative;
}

.path-goals li::before {
    content: '→';
    position: absolute;
    right: 0;
    color: var(--primary-gold);
    font-weight: bold;
}

/* Lesson Formats */
.lesson-formats {
    padding: var(--section-padding);
    background: var(--soft-cream);
}

.formats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.format-card {
    background: white;
    padding: 40px 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: var(--shadow-soft);
    transition: var(--transition-smooth);
}

.format-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-medium);
}

.format-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-secondary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    color: white;
    font-size: 2rem;
}

.format-card h3 {
    font-family: var(--font-primary);
    font-size: 1.5rem;
    margin-bottom: 15px;
    color: var(--deep-navy);
}

.format-card > p {
    margin-bottom: 25px;
    line-height: 1.6;
}

.format-benefits {
    list-style: none;
}

.format-benefits li {
    padding: 8px 0;
    color: var(--text-dark);
    font-size: 0.95rem;
}

/* Testimonials */
.testimonials {
    padding: var(--section-padding);
    background: var(--gradient-dark);
    color: white;
}

.testimonials .section-title {
    color: var(--primary-gold);
}

.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.testimonial-card {
    background: rgba(255, 255, 255, 0.1);
    padding: 30px;
    border-radius: 15px;
    backdrop-filter: blur(10px);
    transition: var(--transition-smooth);
}

.testimonial-card:hover {
    transform: translateY(-5px);
    background: rgba(255, 255, 255, 0.15);
}

.testimonial-content {
    margin-bottom: 25px;
}

.testimonial-content p {
    font-size: 1.1rem;
    line-height: 1.7;
    font-style: italic;
}

.testimonial-author {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.author-info h4 {
    margin-bottom: 5px;
    color: var(--primary-gold);
}

.author-info span {
    font-size: 0.9rem;
    opacity: 0.8;
}

.testimonial-rating {
    color: var(--primary-gold);
}

.testimonial-rating i {
    margin-left: 2px;
}

/* FAQ */
.faq {
    padding: var(--section-padding);
    background: white;
}

.faq-container {
    max-width: 800px;
    margin: 0 auto;
}

.faq-item {
    margin-bottom: 20px;
    border: 1px solid rgba(26, 26, 46, 0.1);
    border-radius: 10px;
    overflow: hidden;
}

.faq-question {
    padding: 25px 30px;
    background: var(--soft-cream);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: var(--transition-smooth);
}

.faq-question:hover {
    background: rgba(212, 175, 55, 0.1);
}

.faq-question h3 {
    font-family: var(--font-primary);
    font-size: 1.2rem;
    color: var(--deep-navy);
    margin: 0;
}

.faq-question i {
    color: var(--primary-gold);
    transition: var(--transition-smooth);
}

.faq-answer {
    padding: 0 30px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    background: white;
}

.faq-item.active .faq-answer {
    padding: 25px 30px;
}

.faq-answer p {
    line-height: 1.7;
    color: var(--text-dark);
    margin: 0;
}

/* ===== ACTIVE NAVIGATION ===== */
.nav-link.active {
    color: var(--primary-gold);
    position: relative;
}

.nav-link.active::after {
    width: 100%;
}

/* ===== UTILITY CLASSES ===== */
.text-center { text-align: center; }
.text-right { text-align: right; }
.mb-20 { margin-bottom: 20px; }
.mb-30 { margin-bottom: 30px; }
.mb-40 { margin-bottom: 40px; }
.mt-20 { margin-top: 20px; }
.mt-30 { margin-top: 30px; }
.mt-40 { margin-top: 40px; }

/* ===== ABOUT PAGE HERO ===== */
.hero-about {
    background: var(--gradient-dark);
    min-height: 15vh;
    display: flex;
    align-items: center;
    position: relative;
    margin-top: 80px; /* Account for fixed navbar */
}

.hero-about .hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
    padding: 15px 20px;
}

.hero-about .hero-title {
    font-family: var(--font-primary);
    font-size: 2.8rem;
    color: var(--primary-gold);
    margin-bottom: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

.hero-about .hero-subtitle {
    font-size: 1.1rem;
    color: var(--text-light);
    margin-bottom: 0;
    line-height: 1.5;
    max-width: 600px;
    margin: 0 auto;
}

/* Portrait inside About hero */
.about-portrait {
    margin-top: 25px;
    display: flex;
    justify-content: center;
}
.about-portrait img {
    width: 190px;
    height: 190px;
    object-fit: cover;
    object-position: top center; /* Show more of the head */
    border-radius: 50%;
    border: 4px solid rgba(255,255,255,0.25);
    box-shadow: 0 6px 18px rgba(0,0,0,0.35);
    background: #222;
}
@media (max-width: 600px) {
    .about-portrait img { width: 150px; height:150px; }
}

/* ===== New About Page Layout ===== */
.about-main { padding-top: 120px; }
.about-profile {
        display: flex;
        gap: 50px;
        align-items: flex-start;
        margin-bottom: 70px;
        flex-wrap: wrap;
}
.about-profile-image { flex: 0 0 260px; display:flex; justify-content:center; }
.about-profile-img {
        width: 240px; height:240px; border-radius:50%; object-fit:cover; object-position: top center;
        border: 5px solid rgba(255,255,255,0.25); box-shadow:0 8px 22px rgba(0,0,0,0.45); background:#222;
}
.about-profile-text { flex: 1; min-width:260px; }
.about-page-title { font-size:2.4rem; margin-top:0; color:var(--primary-gold); margin-bottom:25px; }
.about-profile-text p { line-height:1.7; font-size:1.05rem; white-space:pre-line; }
@media (max-width:900px){
    .about-profile { gap:30px; }
    .about-profile-img { width:200px; height:200px; }
    .about-page-title { font-size:2rem; }
}
@media (max-width:600px){
    .about-profile { flex-direction:column; align-items:center; text-align:center; }
    .about-profile-text { text-align:center; }
    .about-profile-text p { text-align:center; }
}

/* ===== JAZZ CLUB EVENTS ===== */
.club-intro {
    margin-bottom: 60px;
    text-align: center;
}

/* ===== HOME ABOUT PREVIEW IMAGE ===== */
.about-image-wrapper { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    padding: 10px; 
}
.about-thumb { 
    width: 220px; 
    height: 220px; 
    border-radius: 50%; 
    object-fit: cover; 
    object-position: top center; /* Align face higher to avoid cutting hair */
    box-shadow: 0 6px 18px rgba(0,0,0,0.35); 
    border: 4px solid rgba(255,255,255,0.25); 
    background:#222; 
}
/* Fine‑tuning helpers: add one of these classes to the <img> if further adjustment needed */
.portrait-shift-10 { object-position: 50% 10%; }
.portrait-shift-15 { object-position: 50% 15%; }
.portrait-shift-20 { object-position: 50% 20%; }
@media (max-width: 700px) { .about-thumb { width: 170px; height:170px; } }

.club-intro h2 {
    color: var(--text-dark);
    margin-bottom: 20px;
    font-size: 2rem;
    font-weight: 600;
}

.club-intro .intro-text {
    font-size: 1.1rem;
    line-height: 1.7;
    color: var(--text-dark);
    margin-bottom: 30px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.features-list {
    list-style: none;
    padding: 0;
    max-width: 600px;
    margin: 0 auto 40px;
}

.features-list li {
    background: var(--bg-light);
    margin-bottom: 10px;
    padding: 15px 20px;
    border-radius: 8px;
    border-left: 4px solid var(--primary-gold);
    font-size: 1rem;
    color: var(--text-dark);
}

.events-section {
    margin-top: 80px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.events-section h2,
.vouchers-section h2 {
    font-size: 2.2rem;
    color: var(--text-dark);
    margin-bottom: 40px;
    text-align: center;
    font-weight: 600;
}

.vouchers-section {
    margin-top: 60px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 40px;
    border-top: 2px solid #eee;
}

/* Simple list-based events display like Shablul */
.events-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.event-item {
    margin-bottom: 15px;
    padding: 0;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
}

.event-item:last-child {
    border-bottom: none;
}

.event-link {
    display: block;
    text-decoration: none;
    color: var(--primary-gold);
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.5;
    transition: all 0.3s ease;
    padding: 8px 0;
}

.event-link:hover {
    color: var(--secondary-gold);
    text-decoration: underline;
}

.event-details {
    font-size: 0.95rem;
    color: var(--text-gray);
    margin-top: 5px;
    line-height: 1.4;
}

.event-description {
    color: var(--text-gray);
    font-size: 0.9rem;
    line-height: 1.4;
    margin-top: 3px;
}

.event-date {
    font-weight: 600;
    color: var(--text-dark);
}
/* Higher contrast date/time inside jazz club dark cards */
body.jazz-club-page .event-date { color:var(--soft-cream); text-shadow:0 1px 3px rgba(0,0,0,.6); }
body.jazz-club-page .event-card.past .event-date { color:rgba(255,255,255,.85); }

.event-location {
    margin-top: 3px;
}

.event-price {
    margin-top: 3px;
    color: var(--primary-gold);
    font-weight: 500;
}

/* Status indicators */
.event-status {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 500;
    margin-right: 8px;
}

.event-status.upcoming {
    background: #e8f5e8;
    color: #2e7d2e;
}

.event-status.sold-out {
    background: #ffe8e8;
    color: #d32f2f;
}

.event-status.few-tickets {
    background: #fff3cd;
    color: #856404;
}

/* RTL Support for Events */
[data-lang="he"] .events-list {
    direction: rtl;
    text-align: right;
}

[data-lang="he"] .event-status {
    margin-right: 0;
    margin-left: 8px;
}

/* Responsive Events */
@media (max-width: 768px) {
    .events-section,
    .vouchers-section {
        margin: 60px 15px 0;
    }
    
    .events-section h2,
    .vouchers-section h2 {
        font-size: 1.8rem;
    }
    
    .event-link {
        font-size: 1rem;
    }
    
    .club-intro h2 {
        font-size: 1.7rem;
    }
    
    .club-intro {
        margin: 0 15px 40px;
    }
    
    .vouchers-section {
        margin-top: 40px;
    }
}
    /* ===== JAZZ CLUB PAGE RE-DESIGN ===== */
    body.jazz-club-page { background:#0c0f13; color:var(--text-light); }
    .jazz-hero { position:relative; min-height:38vh; display:flex; align-items:flex-end; }
    .jazz-hero-bg { position:absolute; inset:0; background:linear-gradient(rgba(12,15,19,0.55), rgba(12,15,19,0.85)), var(--hero-image, url('../images/jazz-club-bg.jpg')) center/cover no-repeat; filter:brightness(.85) contrast(1.05); }
    .jazz-hero-overlay { position:absolute; inset:0; background:radial-gradient(circle at 30% 40%, rgba(201,168,97,0.15), transparent 60%); pointer-events:none; }
    .hero-inner { position:relative; padding:18px 0 32px; }
    .jazz-hero-title { font-family:var(--font-primary); font-size:clamp(2.4rem,5vw,3.6rem); margin:0; line-height:1.1; letter-spacing:.5px; color:var(--soft-cream); text-shadow:0 4px 24px rgba(0,0,0,.55); }
    html[lang='he'] .jazz-hero-title { font-family:'Yehuda CLM', var(--font-primary), serif; }
    .jazz-hero-subtitle { max-width:720px; font-size:1.05rem; opacity:.88; margin:18px 0 0; font-weight:400; color:var(--text-light); }
    .hero-accent-line { width:120px; height:4px; background:var(--gradient-primary); margin:28px 0 0; border-radius:3px; box-shadow:0 0 0 1px rgba(201,168,97,.4),0 6px 16px -4px rgba(0,0,0,.6); }
    .jazz-club-page .club-intro { background:#11161d; padding:42px 38px; border:1px solid rgba(201,168,97,.18); border-radius:22px; box-shadow:0 10px 34px -10px rgba(0,0,0,.6); backdrop-filter:blur(4px); margin-top:-40px; position:relative; z-index:2; }
    .jazz-club-page .club-intro h2 { font-family:var(--font-primary); font-size:1.9rem; margin:0 0 18px; letter-spacing:.6px; color:var(--primary-gold); }
    html[lang='he'] .jazz-club-page .club-intro h2 { font-family:'Yehuda CLM', var(--font-primary), serif; }
    .jazz-club-page .club-intro .intro-text { font-size:.95rem; line-height:1.65; margin-bottom:22px; color:var(--text-light); }
    .jazz-club-page .features-list { list-style:none; padding:0; margin:0 0 28px; display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
    .jazz-club-page .features-list li { background:#0e1318; padding:14px 16px; border:1px solid rgba(201,168,97,.16); border-radius:14px; font-size:.85rem; color:var(--soft-cream); display:flex; gap:10px; position:relative; }
    .jazz-club-page .features-list li:before { content:'♪'; color:var(--primary-gold); font-size:1rem; line-height:1; position:relative; top:2px; }
    .jazz-club-page .events-section { margin-top:70px; }
    .jazz-club-page .events-section .section-title { font-family:var(--font-primary); font-size:2.2rem; color:var(--primary-gold); margin:0 0 28px; letter-spacing:.8px; text-shadow:0 4px 18px rgba(0,0,0,.5); }
    html[lang='he'] .jazz-club-page .events-section .section-title { font-family:'Yehuda CLM', var(--font-primary), serif; }
    .jazz-club-page .event-card { background:linear-gradient(160deg,#131a21 0%,#0c1116 70%); border:1px solid rgba(201,168,97,.28); }
    .jazz-club-page .event-card:hover { border-color:var(--primary-gold); box-shadow:0 12px 38px -10px rgba(0,0,0,.75); }
    .jazz-club-page .event-card-body { padding:22px 22px 26px; }
    .jazz-club-page .event-card-title { font-family:var(--font-primary); }
    html[lang='he'] .jazz-club-page .event-card-title { font-family:'Yehuda CLM', var(--font-primary), serif; }
    .jazz-club-page .event-card-link { font-weight:600; }
    .jazz-club-page .event-meta, .jazz-club-page .event-description { color:var(--text-light); }
    .jazz-club-page .event-date-badge { background:var(--gradient-primary); color:#111; box-shadow:0 6px 18px -6px rgba(0,0,0,.65); }
    .jazz-club-page .btn.btn-ticket { background:var(--gradient-secondary); color:#111; }
    .jazz-club-page .btn.btn-ticket:hover { box-shadow:0 10px 28px -6px rgba(0,0,0,.7); }
    .jazz-club-page .vouchers-section { margin-top:70px; background:#11161d; padding:40px 34px; border:1px solid rgba(201,168,97,.18); border-radius:20px; box-shadow:0 8px 30px -12px rgba(0,0,0,.55); }
    .jazz-club-page .vouchers-section h2 { font-family:var(--font-primary); font-size:1.8rem; color:var(--primary-gold); margin:0 0 24px; }
    html[lang='he'] .jazz-club-page .vouchers-section h2 { font-family:'Yehuda CLM', var(--font-primary), serif; }
    .jazz-club-page .events-list { list-style:none; padding:0; margin:0; display:grid; gap:18px; }
    .jazz-club-page .event-item { background:#0d1217; padding:16px 20px; border:1px solid rgba(201,168,97,.14); border-radius:14px; transition:background .4s ease, box-shadow .5s ease; }
    .jazz-club-page .event-item:hover { background:#131a21; box-shadow:0 8px 24px -8px rgba(0,0,0,.6); }
    .jazz-club-page .event-link { color:var(--soft-cream); text-decoration:none; font-weight:600; letter-spacing:.5px; }
    .jazz-club-page .event-link:hover { color:var(--primary-gold); }
    .jazz-club-page .event-description { font-size:.8rem; opacity:.85; margin-top:6px; }
    /* Past events styling */
    .jazz-club-page .events-section.past-events-section { margin-top:60px; }
    .jazz-club-page .events-divider { width:100%; height:2px; background:linear-gradient(90deg,transparent,rgba(201,168,97,.35),transparent); margin:55px 0 40px; position:relative; }
    .jazz-club-page .events-divider:before { content:''; position:absolute; left:50%; transform:translateX(-50%); top:-10px; width:70px; height:20px; background:rgba(12,15,19,.9); border:1px solid rgba(201,168,97,.4); border-radius:12px; box-shadow:0 6px 18px -6px rgba(0,0,0,.6); }
    .jazz-club-page .events-divider span { position:absolute; left:50%; transform:translate(-50%,-50%); top:50%; font-size:.75rem; letter-spacing:1px; color:var(--soft-cream); font-weight:600; }
html[lang='he'] .about-page-title { font-family:'Yehuda CLM','Playfair Display',serif; }
.about-page-title { font-family:'Playfair Display',serif; letter-spacing:.5px; }
.about-tagline { font-family:'Inter',sans-serif; font-size:1.05rem; line-height:1.5; margin:-10px 0 26px; color:var(--text-color); font-weight:500; }
html[lang='he'] .about-tagline { font-family:'Yehuda CLM','Inter',sans-serif; }
    .jazz-club-page .events-section .past-title { color:#999; text-shadow:none; }
    .jazz-club-page .event-card.past { position:relative; filter:grayscale(.65) brightness(.9); opacity:.78; }
    .jazz-club-page .event-card.past:hover { filter:grayscale(.4) brightness(.95); opacity:.85; }
    .jazz-club-page .event-card.past .event-card-link { cursor:default; pointer-events:none; }
    .jazz-club-page .past-ribbon { position:absolute; top:8px; left:8px; background:rgba(0,0,0,.55); color:var(--soft-cream); padding:4px 10px; font-size:.7rem; letter-spacing:.5px; border:1px solid rgba(201,168,97,.35); border-radius:4px; text-transform:uppercase; font-weight:600; }
    html[lang='he'] .jazz-club-page .past-ribbon { font-size:.72rem; }
    /* Carousel */
    .jazz-club-page .carousel-section { margin-top:55px; }
    .jazz-club-page .events-carousel-wrapper { position:relative; }
    .jazz-club-page .events-carousel { display:flex; gap:28px; overflow-x:auto; padding:14px 6vw 30px; scroll-snap-type:x mandatory; scrollbar-width:none; }
    .jazz-club-page .events-carousel::-webkit-scrollbar { display:none; }
    .jazz-club-page .events-carousel .event-card { min-width:340px; max-width:340px; flex:0 0 340px; scroll-snap-align:center; }
    @media (max-width:600px){ .jazz-club-page .events-carousel .event-card { min-width:82%; max-width:82%; flex:0 0 82%; } }
    .jazz-club-page .events-carousel.dragging { cursor:grabbing; }
    /* Wide screen pair view: remove scroll snapping to avoid half cards */
    @media (min-width:1100px){
        .jazz-club-page .events-carousel { scroll-snap-type:none; }
        .jazz-club-page .events-carousel .event-card { scroll-snap-align:initial; }
    }
    .jazz-club-page .carousel-pagination { display:flex; justify-content:center; gap:10px; margin-top:4px; padding:8px 0 4px; }
    .jazz-club-page .carousel-dot { width:14px; height:14px; border-radius:50%; background:#444; border:none; cursor:pointer; position:relative; transition:background .3s, transform .3s; }
    .jazz-club-page .carousel-dot.active { background:var(--primary-gold); transform:scale(1.15); box-shadow:0 0 0 4px rgba(201,168,97,.25); }
    .jazz-club-page .carousel-dot:focus-visible { outline:2px solid var(--primary-gold); outline-offset:3px; }
    /* Visually hidden utility for accessibility announcements */
    .visually-hidden { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); border:0; white-space:nowrap; }
    @media (min-width:1100px){ .jazz-club-page .carousel-pagination { margin-top:12px; } }
    .jazz-club-page .carousel-nav { position:absolute; top:50%; transform:translateY(-50%); width:46px; height:46px; border:none; background:rgba(12,15,19,.85); color:var(--soft-cream); font-size:1.8rem; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 8px 24px -8px rgba(0,0,0,.6); backdrop-filter:blur(4px); transition:background .3s; z-index:5; }
    .jazz-club-page .carousel-nav:focus-visible { outline:2px solid var(--primary-gold); outline-offset:3px; }
    .jazz-club-page .carousel-nav:hover { background:rgba(201,168,97,.85); color:#111; }
    .jazz-club-page .carousel-nav.prev { left:8px; }
    .jazz-club-page .carousel-nav.next { right:8px; }
    .jazz-club-page .upcoming-glow { position:absolute; inset:0; pointer-events:none; box-shadow:0 0 0 2px rgba(201,168,97,.5),0 0 22px -4px rgba(201,168,97,.6); border-radius:4px; mix-blend-mode:screen; opacity:.65; }
    .jazz-club-page .event-card.upcoming { border-color:var(--primary-gold); }
    .jazz-club-page .event-card.upcoming:hover { box-shadow:0 14px 40px -10px rgba(0,0,0,.8); }
    /* Date/Time icons */
    .jazz-club-page .event-meta { display:flex; flex-direction:column; gap:6px; }
    .jazz-club-page .event-datetime { display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:.85rem; }
    .jazz-club-page .event-date-icon i, .jazz-club-page .event-time-icon i { color:var(--primary-gold); font-size:.9rem; }
    .jazz-club-page .event-time-text { font-weight:600; color:var(--soft-cream); }
    .jazz-club-page .event-card.past .event-time-text { color:rgba(255,255,255,.8); }
    @media (max-width:800px){
        .jazz-hero-title { font-size:clamp(2rem,7vw,3rem); }
        .jazz-club-page .club-intro { padding:34px 26px; margin-top:-30px; }
        .jazz-club-page .events-section .section-title { font-size:1.9rem; }
        .jazz-club-page .vouchers-section { padding:32px 24px; }
    }
    @media (max-width:520px){
        .jazz-hero-title { font-size:clamp(1.8rem,8vw,2.4rem); }
        .jazz-hero-subtitle { font-size:.95rem; }
        .hero-accent-line { width:90px; }
        .jazz-club-page .club-intro h2 { font-size:1.6rem; }
    }