/* ===========================================
 TRUBAČI STARS - SECTIONS (About,Services,etc.)
 =========================================== */


.about{
 background:var(--bg-primary);
}

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

.about-intro{
 font-size:1.2rem;
 color:var(--text-primary);
 margin-bottom:20px;
}

.about-text p{
 margin-bottom:20px;
 color:var(--text-secondary);
}

.about-features{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:15px;
 margin-top:30px;
}

.feature{
 display:flex;
 align-items:center;
 gap:12px;
 padding:12px 16px;
 background:var(--bg-secondary);
 border-radius:10px;
 font-weight:500;
 color:var(--text-primary);
}

.feature i{
 color:var(--primary-gold);
 font-size:1.1rem;
}

.about-image{
 position:relative;
}

.about-image img{
 border-radius:20px;
 box-shadow:var(--shadow-lg);
}

.about-image-badge{
 position:absolute;
 bottom:-20px;
 left:-20px;
 background:var(--gradient-gold);
 color:#fff;
 padding:25px 30px;
 border-radius:16px;
 text-align:center;
 box-shadow:var(--shadow-gold);
}

.badge-number{
 display:block;
 font-family:var(--font-display);
 font-size:2.5rem;
 font-weight:700;
}

.badge-text{
 font-size:0.85rem;
 opacity:0.9;
}


.services{
 background:var(--bg-secondary);
}

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

.service-card{
 position:relative;
 background:var(--bg-primary);
 border-radius:20px;
 padding:40px 30px;
 text-align:center;
 box-shadow:var(--shadow-sm);
 border:1px solid var(--border-color);
 transition:transform 0.4s cubic-bezier(0.4,0,0.2,1),
 box-shadow 0.4s cubic-bezier(0.4,0,0.2,1);
}

.service-card:hover{
 transform:translateY(-10px);
 box-shadow:var(--shadow-lg);
 border-color:var(--primary-gold);
}

.service-card.featured{
 background:linear-gradient(135deg,#fffbeb 0%,#fff 100%);
 border:2px solid var(--primary-gold);
}

.service-badge{
 position:absolute;
 top:-12px;
 left:50%;
 transform:translateX(-50%);
 background:var(--gradient-gold);
 color:#fff;
 padding:8px 20px;
 border-radius:20px;
 font-size:0.75rem;
 font-weight:600;
 text-transform:uppercase;
 letter-spacing:1px;
}

.service-icon{
 width:80px;
 height:80px;
 margin:0 auto 25px;
 display:flex;
 align-items:center;
 justify-content:center;
 background:var(--bg-accent);
 border-radius:50%;
 font-size:2rem;
 color:var(--primary-gold);
}

.service-card h3{
 font-family:var(--font-display);
 font-size:1.5rem;
 color:var(--text-primary);
 margin-bottom:15px;
}

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

.service-features{
 text-align:left;
}

.service-features li{
 display:flex;
 align-items:center;
 gap:10px;
 padding:8px 0;
 color:var(--text-secondary);
 font-size:0.95rem;
}

.service-features li i{
 color:var(--primary-gold);
 font-size:0.85rem;
}


.gallery{
 background:var(--bg-primary);
}

.gallery-subtitle{
 font-family:var(--font-display);
 font-size:1.4rem;
 color:var(--text-primary);
 margin-bottom:25px;
 display:flex;
 align-items:center;
 gap:10px;
}

.gallery-subtitle i{
 color:var(--primary-gold);
}

.gallery-videos{
 margin-bottom:60px;
}

.gallery-photos{
 margin-bottom:20px;
}


.video-grid{
 display:grid;
 grid-template-columns:repeat(6,1fr);
 gap:15px;
 margin-bottom:30px;
}

.video-item{
 position:relative;
 border-radius:16px;
 overflow:hidden;
 background:#000;
 aspect-ratio:9/16;
}


.video-item.youtube-short iframe{
 width:100%;
 height:100%;
 border:none;
 border-radius:16px;
}

.video-item video{
 width:100%;
 height:100%;
 object-fit:cover;
 transition:transform 0.4s ease;
}

.video-item:hover video{
 transform:scale(1.05);
}

.video-play-btn{
 position:absolute;
 top:50%;
 left:50%;
 transform:translate(-50%,-50%);
 width:70px;
 height:70px;
 background:rgba(212,168,71,0.9);
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 color:#fff;
 font-size:1.5rem;
 transition:all 0.3s ease;
 pointer-events:none;
}

.video-item:hover .video-play-btn{
 background:var(--primary-gold);
 transform:translate(-50%,-50%) scale(1.1);
}

.video-item.playing .video-play-btn{
 opacity:0;
}


.show-more-btn{
 display:none;
 margin:30px auto 0;
}


.hidden-mobile{
 display:block;
}

.gallery-masonry{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:15px;
}

.gallery-column{
 display:flex;
 flex-direction:column;
 gap:15px;
}

.gallery-item{
 border-radius:12px;
 overflow:hidden;
 cursor:pointer;
 transition:var(--transition);
}

.gallery-item:hover{
 transform:scale(1.02);
 box-shadow:var(--shadow-lg);
}

.gallery-item img{
 width:100%;
 height:auto;
 object-fit:cover;
 transition:transform 0.6s cubic-bezier(0.4,0,0.2,1);
}

.gallery-item:hover img{
 transform:scale(1.1);
}


@media (max-width:768px){
 .video-grid{
 grid-template-columns:repeat(3,1fr);
 gap:10px;
}
 
 .video-item{
 aspect-ratio:9/16;
}
 
 .video-play-btn{
 width:50px;
 height:50px;
 font-size:1.2rem;
}
 
 .hidden-mobile{
 display:none !important;
}
 
 .hidden-mobile.show{
 display:block !important;
}
 
 .show-more-btn{
 display:flex;
}
 
 .show-more-btn.hidden{
 display:none;
}
 
 .gallery-masonry{
 grid-template-columns:repeat(3,1fr);
 gap:10px;
}
 
 .gallery-column.hidden-mobile.show{
 display:flex !important;
}
}

@media (max-width:480px){
 .video-grid{
 grid-template-columns:repeat(3,1fr);
 gap:8px;
}
 
 .gallery-masonry{
 grid-template-columns:repeat(3,1fr);
 gap:8px;
}
 
 .video-play-btn{
 width:40px;
 height:40px;
 font-size:1rem;
}
}


.repertoire{
 background:var(--bg-secondary);
}

.repertoire-content{
 max-width:1000px;
 margin:0 auto;
}

.repertoire-text{
 text-align:center;
 margin-bottom:50px;
}

.repertoire-text p{
 color:var(--text-secondary);
 margin-bottom:15px;
 font-size:1.05rem;
}

.repertoire-categories{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:25px;
 margin-bottom:40px;
}

.category-card{
 background:var(--bg-primary);
 padding:30px 20px;
 border-radius:16px;
 text-align:center;
 box-shadow:var(--shadow-sm);
 border:1px solid var(--border-color);
 transition:transform 0.4s cubic-bezier(0.4,0,0.2,1),
 box-shadow 0.4s cubic-bezier(0.4,0,0.2,1);
}

.category-card:hover{
 transform:translateY(-5px);
 border-color:var(--primary-gold);
 box-shadow:var(--shadow-md);
}

.category-icon{
 width:60px;
 height:60px;
 margin:0 auto 15px;
 display:flex;
 align-items:center;
 justify-content:center;
 background:var(--bg-accent);
 border-radius:50%;
 font-size:1.5rem;
 color:var(--primary-gold);
}

.category-card h4{
 color:var(--text-primary);
 margin-bottom:10px;
 font-size:1.1rem;
}

.category-card p{
 color:var(--text-muted);
 font-size:0.9rem;
 line-height:1.6;
}

.repertoire-note{
 display:flex;
 align-items:flex-start;
 gap:15px;
 padding:25px;
 background:var(--bg-accent);
 border-radius:12px;
 border-left:4px solid var(--primary-gold);
}

.repertoire-note i{
 color:var(--primary-gold);
 font-size:1.3rem;
 flex-shrink:0;
 margin-top:3px;
}

.repertoire-note p{
 color:var(--text-secondary);
 margin:0;
}


.testimonials{
 background:var(--bg-primary);
}

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

.testimonial-card{
 background:var(--bg-secondary);
 padding:35px;
 border-radius:20px;
 border:1px solid var(--border-color);
 transition:transform 0.4s cubic-bezier(0.4,0,0.2,1),
 box-shadow 0.4s cubic-bezier(0.4,0,0.2,1);
}

.testimonial-card:hover{
 box-shadow:var(--shadow-md);
 border-color:var(--primary-gold);
 transform:translateY(-10px);
}

.testimonial-stars{
 margin-bottom:20px;
}

.testimonial-stars i{
 color:var(--primary-gold);
 font-size:1rem;
 margin-right:3px;
}

.testimonial-text{
 color:var(--text-secondary);
 font-style:italic;
 line-height:1.8;
 margin-bottom:25px;
}

.testimonial-author{
 border-top:1px solid var(--border-color);
 padding-top:20px;
}

.testimonial-author strong{
 display:block;
 color:var(--text-primary);
 margin-bottom:5px;
}

.testimonial-author span{
 font-size:0.9rem;
 color:var(--text-muted);
}


.why-us{
 background:var(--bg-secondary);
}

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

.why-card{
 background:var(--bg-primary);
 padding:35px;
 border-radius:16px;
 border:1px solid var(--border-color);
 transition:var(--transition);
}

.why-card:hover{
 transform:translateY(-5px);
 box-shadow:var(--shadow-md);
 border-color:var(--primary-gold);
}

.why-number{
 font-family:var(--font-display);
 font-size:3rem;
 font-weight:700;
 color:var(--primary-gold);
 opacity:0.3;
 margin-bottom:10px;
}

.why-card h4{
 font-family:var(--font-display);
 font-size:1.3rem;
 color:var(--text-primary);
 margin-bottom:12px;
}

.why-card p{
 color:var(--text-muted);
 line-height:1.7;
}


.pricing{
 background:linear-gradient(135deg,#fffbeb 0%,#fef9e7 50%,#fff 100%);
 padding:100px 0;
 position:relative;
 overflow:hidden;
}

.pricing::before{
 content:'';
 position:absolute;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background:
 radial-gradient(circle at 10% 20%,rgba(212,168,71,0.1) 0%,transparent 40%),
 radial-gradient(circle at 90% 80%,rgba(212,168,71,0.08) 0%,transparent 40%);
 pointer-events:none;
}

.pricing .section-label,
.pricing .section-title,
.pricing .section-subtitle{
 color:var(--text-primary);
}

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

.pricing-showcase{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:40px;
 align-items:start;
 margin-top:50px;
 position:relative;
 z-index:1;
}

.pricing-main-card{
 background:#fff;
 border:2px solid var(--primary-gold);
 border-radius:30px;
 padding:50px 40px;
 text-align:center;
 position:relative;
 overflow:hidden;
 box-shadow:0 20px 60px rgba(212,168,71,0.15);
}

.pricing-main-card::before{
 content:'';
 position:absolute;
 top:-50%;
 left:-50%;
 width:200%;
 height:200%;
 background:radial-gradient(circle,rgba(212,168,71,0.08) 0%,transparent 70%);
 animation:pulse-glow 4s ease-in-out infinite;
}

@keyframes pulse-glow{
 0%,100%{opacity:0.5;transform:scale(1)}
 50%{opacity:1;transform:scale(1.1)}
}

.pricing-icon-large{
 position:relative;
 z-index:1;
 width:100px;
 height:100px;
 margin:0 auto 30px;
 background:var(--gradient-gold);
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 font-size:2.5rem;
 color:#fff;
 box-shadow:0 10px 40px rgba(212,168,71,0.4);
}

.pricing-range{
 position:relative;
 z-index:1;
 display:flex;
 align-items:center;
 justify-content:center;
 gap:15px;
 margin-bottom:20px;
}

.price-from,
.price-to{
 font-family:var(--font-display);
 font-size:3rem;
 font-weight:700;
 color:var(--primary-gold);
}

.price-separator{
 font-size:2rem;
 color:var(--text-muted);
}

.pricing-note{
 position:relative;
 z-index:1;
 color:var(--text-secondary);
 font-size:1rem;
 margin-bottom:30px;
}

.pricing-features{
 position:relative;
 z-index:1;
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:15px;
 margin-bottom:30px;
}

.pricing-feature{
 display:flex;
 align-items:center;
 gap:10px;
 padding:12px 15px;
 background:var(--bg-secondary);
 border-radius:10px;
 color:var(--text-primary);
 font-size:0.9rem;
 border:1px solid var(--border-color);
}

.pricing-feature i{
 color:var(--primary-gold);
 font-size:1.1rem;
}

.pricing-main-card .btn{
 position:relative;
 z-index:1;
}

.pricing-info-cards{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:20px;
}

.pricing-info-card{
 background:#fff;
 border:1px solid var(--border-color);
 border-radius:20px;
 padding:30px 25px;
 text-align:center;
 transition:all 0.3s ease;
 box-shadow:0 5px 20px rgba(0,0,0,0.05);
}

.pricing-info-card:hover{
 border-color:var(--primary-gold);
 transform:translateY(-5px);
 box-shadow:0 15px 40px rgba(212,168,71,0.15);
}

.info-icon{
 width:60px;
 height:60px;
 margin:0 auto 20px;
 background:linear-gradient(135deg,rgba(212,168,71,0.15),rgba(212,168,71,0.08));
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 font-size:1.5rem;
 color:var(--primary-gold);
}

.pricing-info-card h4{
 font-family:var(--font-display);
 font-size:1.2rem;
 color:var(--text-primary);
 margin-bottom:10px;
}

.pricing-info-card p{
 color:var(--text-muted);
 font-size:0.9rem;
 line-height:1.6;
}


@media (max-width:992px){
 .pricing-showcase{
 grid-template-columns:1fr;
}
 
 .pricing-info-cards{
 grid-template-columns:repeat(4,1fr);
}
}

@media (max-width:768px){
 .pricing-info-cards{
 grid-template-columns:1fr 1fr;
}
 
 .pricing-features{
 grid-template-columns:1fr;
}
 
 .price-from,
 .price-to{
 font-size:2.2rem;
}
}

@media (max-width:480px){
 .pricing-info-cards{
 grid-template-columns:1fr;
}
 
 .pricing-main-card{
 padding:40px 25px;
}
}


.cta-section{
 background:linear-gradient(135deg,#fffbeb 0%,#fef9e7 100%);
 padding:80px 0;
 border-top:1px solid var(--border-color);
 border-bottom:1px solid var(--border-color);
}

.cta-content{
 text-align:center;
 max-width:700px;
 margin:0 auto;
}

.cta-content h2{
 font-family:var(--font-display);
 font-size:2.5rem;
 color:var(--text-primary);
 margin-bottom:15px;
}

.cta-content p{
 color:var(--text-secondary);
 font-size:1.1rem;
 margin-bottom:30px;
}
/* ===========================================
 CITIES SECTION
 =========================================== */
.cities{
 background:var(--bg-secondary);
 padding:100px 0;
}

.cities-intro{
 text-align:center;
 max-width:800px;
 margin:0 auto 50px;
 color:var(--text-secondary);
 font-size:1.1rem;
 line-height:1.8;
}

.cities-grid{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:25px;
 margin-bottom:40px;
}

.city-card{
 background:var(--bg-primary);
 padding:30px 25px;
 border-radius:15px;
 text-align:center;
 box-shadow:0 5px 20px rgba(0,0,0,0.08);
 transition:transform 0.3s ease,box-shadow 0.3s ease;
 border:1px solid var(--border-color);
}

.city-card:hover{
 transform:translateY(-5px);
 box-shadow:0 10px 30px rgba(0,0,0,0.12);
}

.city-card i{
 font-size:2rem;
 color:var(--primary-gold);
 margin-bottom:15px;
}

.city-card h4{
 font-family:var(--font-display);
 font-size:1.3rem;
 color:var(--text-primary);
 margin-bottom:10px;
}

.city-card p{
 color:var(--text-secondary);
 font-size:0.9rem;
 line-height:1.6;
}

.cities-note{
 display:flex;
 align-items:flex-start;
 gap:15px;
 background:linear-gradient(135deg,#fff9e6 0%,#fffbeb 100%);
 padding:25px 30px;
 border-radius:15px;
 border-left:4px solid var(--primary-gold);
}

.cities-note i{
 color:var(--primary-gold);
 font-size:1.5rem;
 margin-top:3px;
}

.cities-note p{
 color:var(--text-secondary);
 line-height:1.7;
}

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

@media (max-width:576px){
 .cities-grid{
 grid-template-columns:1fr;
}
}

/* ===========================================
 SONGS LIST IN REPERTOIRE
 =========================================== */
.songs-list{
 margin-top:50px;
 background:var(--bg-primary);
 padding:40px;
 border-radius:20px;
 box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.songs-title{
 font-family:var(--font-display);
 font-size:1.5rem;
 color:var(--text-primary);
 margin-bottom:30px;
 text-align:center;
}

.songs-title i{
 color:var(--primary-gold);
 margin-right:10px;
}

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

.songs-column h5{
 color:var(--primary-gold);
 font-size:1.1rem;
 margin-bottom:15px;
 padding-bottom:10px;
 border-bottom:2px solid var(--primary-gold);
}

.songs-column ul{
 list-style:none;
 padding:0;
}

.songs-column li{
 color:var(--text-secondary);
 padding:8px 0;
 border-bottom:1px solid var(--border-color);
 font-size:0.95rem;
}

.songs-column li:last-child{
 border-bottom:none;
}

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

@media (max-width:576px){
 .songs-grid{
 grid-template-columns:1fr;
}
 
 .songs-list{
 padding:25px;
}
}

/* ===========================================
 FAQ SECTION
 =========================================== */
.faq{
 background:var(--bg-primary);
 padding:100px 0;
}

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

.faq-item{
 background:var(--bg-secondary);
 border-radius:15px;
 padding:25px 30px;
 border:1px solid var(--border-color);
 transition:box-shadow 0.3s ease;
}

.faq-item:hover{
 box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.faq-question h4{
 font-family:var(--font-display);
 font-size:1.1rem;
 color:var(--text-primary);
 display:flex;
 align-items:flex-start;
 gap:12px;
}

.faq-question i{
 color:var(--primary-gold);
 font-size:1.2rem;
 margin-top:2px;
}

.faq-answer{
 margin-top:15px;
 padding-top:15px;
 border-top:1px solid var(--border-color);
}

.faq-answer p{
 color:var(--text-secondary);
 line-height:1.7;
 font-size:0.95rem;
}

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


.page-hero{
 padding:140px 0 60px;
 text-align:center;
 background:linear-gradient(135deg,#fefefe 0%,#f5f5f5 25%,#fffbeb 50%,#fef9e7 75%,#ffffff 100%);
 position:relative;
}
.page-hero::before{
 content:'';
 position:absolute;
 top:0;left:0;right:0;bottom:0;
 background:radial-gradient(circle at 50% 50%,rgba(212,168,71,0.08) 0%,transparent 60%);
 pointer-events:none;
}
.page-hero .container{position:relative;z-index:1}
.page-hero .section-title{font-size:clamp(2.2rem,5vw,3.5rem);margin-bottom:10px}
.page-hero .section-subtitle{margin:0 auto;font-size:1.15rem}
@media (max-width:768px){.page-hero{padding:120px 0 40px}}
/* =========================================== 
 TRUBAČI STARS - CONTACT SECTION 
 =========================================== */ 
 
.contact{
 background:var(--bg-primary);
}
 
.contact-content{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:60px;
}
 
.contact-intro h3{
 font-family:var(--font-display);
 font-size:1.5rem;
 color:var(--text-primary);
 margin-bottom:15px;
}
 
.contact-intro p{
 color:var(--text-muted);
 margin-bottom:30px;
}
 
.contact-items{
 display:flex;
 flex-direction:column;
 gap:20px;
}
 
.contact-item{
 display:flex;
 align-items:center;
 gap:20px;
 padding:20px;
 background:var(--bg-secondary);
 border-radius:12px;
 transition:var(--transition);
}
 
.contact-item:hover{
 background:var(--bg-accent);
 transform:translateX(5px);
}
 
.contact-icon{
 width:50px;
 height:50px;
 display:flex;
 align-items:center;
 justify-content:center;
 background:var(--bg-primary);
 border-radius:50%;
 font-size:1.2rem;
 color:var(--primary-gold);
 box-shadow:var(--shadow-sm);
}
 
.contact-icon.viber{
 background:linear-gradient(135deg,#7360f2 0%,#59267c 100%);
 color:#fff;
}
 
.contact-icon.whatsapp{
 background:linear-gradient(135deg,#25d366 0%,#128c7e 100%);
 color:#fff;
}
 
.contact-details h4{
 color:var(--text-primary);
 font-size:1rem;
 margin-bottom:5px;
}
 
.contact-details a{
 color:var(--primary-gold);
 font-weight:500;
}
 
.contact-details a:hover{
 text-decoration:underline;
}
 
.contact-note{
 display:flex;
 align-items:flex-start;
 gap:15px;
 padding:20px;
 background:var(--bg-accent);
 border-radius:12px;
 margin-top:30px;
 border-left:4px solid var(--primary-gold);
}
 
.contact-note i{
 color:var(--primary-gold);
 font-size:1.2rem;
 flex-shrink:0;
}
 
.contact-note p{
 color:var(--text-secondary);
 margin:0;
 font-size:0.95rem;
}
 
 
.contact-form-section h3{
 font-family:var(--font-display);
 font-size:1.5rem;
 color:var(--text-primary);
 margin-bottom:25px;
}
 
.contact-form{
 background:var(--bg-secondary);
 padding:35px;
 border-radius:20px;
 border:1px solid var(--border-color);
}
 
.form-row{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:20px;
}
 
.form-group{
 margin-bottom:20px;
}
 
.form-group label{
 display:block;
 font-weight:500;
 color:var(--text-primary);
 margin-bottom:8px;
 font-size:0.95rem;
}
 
.form-group input,
.form-group select,
.form-group textarea{
 width:100%;
 padding:14px 18px;
 border:2px solid var(--border-color);
 border-radius:10px;
 font-family:var(--font-body);
 font-size:1rem;
 color:var(--text-primary);
 background:var(--bg-primary);
 transition:var(--transition);
}
 
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
 outline:none;
 border-color:var(--primary-gold);
 box-shadow:0 0 0 4px rgba(212,168,71,0.1);
}
 
.form-group textarea{
 resize:vertical;
 min-height:120px;
}
/* ===========================================
 TRUBAČI STARS - FOOTER
 =========================================== */

.footer{
 background:var(--bg-secondary);
 border-top:1px solid var(--border-color);
 padding:60px 0 30px;
}

.footer-content{
 display:grid;
 grid-template-columns:2fr 1fr 1fr 1fr 2fr;
 gap:40px;
 margin-bottom:40px;
}

.footer-logo{
 display:flex;
 align-items:center;
 gap:15px;
 font-size:1.5rem;
 color:var(--text-primary);
 margin-bottom:15px;
}

.footer-logo img{
 height:80px;
 width:auto;
 object-fit:contain;
}

.footer-logo-text{
 font-family:var(--font-display);
 font-size:1.5rem;
 font-weight:700;
 background:linear-gradient(135deg,var(--primary-gold) 0%,#f5d485 50%,var(--primary-gold) 100%);
 background-size:200% auto;
 -webkit-background-clip:text;
 -webkit-text-fill-color:transparent;
 background-clip:text;
 letter-spacing:2px;
 text-transform:uppercase;
 text-shadow:0 2px 10px rgba(212,168,71,0.3);
 transition:all 0.3s ease;
}

.footer-logo:hover .footer-logo-text{
 background-position:100% center;
}

.footer-logo i{
 color:var(--primary-gold);
}

.footer-logo strong{
 color:var(--primary-gold);
}

.footer-tagline{
 color:#495057;
 margin-bottom:20px;
}

.footer-social{
 display:flex;
 gap:12px;
}

.footer-social a{
 width:42px;
 height:42px;
 display:flex;
 align-items:center;
 justify-content:center;
 background:var(--bg-primary);
 border:1px solid var(--border-color);
 border-radius:50%;
 color:var(--text-secondary);
 transition:var(--transition);
}

.footer-social a:hover{
 background:var(--primary-gold);
 border-color:var(--primary-gold);
 color:#fff;
 transform:translateY(-3px);
}

.footer-links h3,
.footer-contact h3,

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

.footer-links a{
 color:#495057;
 transition:var(--transition);
 text-decoration:underline;
 text-decoration-color:transparent;
}

.footer-links a:hover{
 color:var(--primary-gold);
 padding-left:5px;
}

.footer-contact p{
 display:flex;
 align-items:center;
 gap:10px;
 color:#495057;
 margin-bottom:10px;
}

.footer-contact i{
 color:var(--primary-gold);
 width:20px;
}

.footer-bottom{
 text-align:center;
 padding-top:30px;
 border-top:1px solid var(--border-color);
}

.footer-bottom p{
 color:#495057;
 font-size:0.9rem;
}

.footer-bottom a{
 color:#7a6318;
 text-decoration:underline;
}

.footer-bottom a:hover{
 text-decoration:underline;
}


.footer-contact .fa-viber{
 color:#7360f2;
}

.footer-contact .fa-whatsapp{
 color:#25d366;
}

/* ===========================================
 FLOATING CALL BUTTON
 =========================================== */
.floating-call-btn{
 position:fixed;
 bottom:30px;
 right:30px;
 z-index:999;
 display:flex;
 align-items:center;
 gap:10px;
 padding:15px 25px;
 background:linear-gradient(135deg,#6b4f0f 0%,#4a3608 100%);
 color:#fff;
 border-radius:50px;
 text-decoration:none;
 font-weight:600;
 font-size:1rem;
 box-shadow:0 8px 30px rgba(212,168,71,0.4);
 transition:all 0.3s ease;
 animation:floatingPulse 2s ease-in-out infinite;
}

.floating-call-btn:hover{
 transform:translateY(-3px) scale(1.05);
 box-shadow:0 12px 40px rgba(212,168,71,0.5);
}

.floating-call-btn i{
 font-size:1.2rem;
 animation:phoneRing 1.5s ease-in-out infinite;
}

.floating-call-text{
 display:inline;
}

@keyframes floatingPulse{
 0%,100%{
 transform:scale(1);
}
 50%{
 transform:scale(1.05);
}
}

@keyframes phoneRing{
 0%,100%{
 transform:rotate(0deg);
}
 10%,30%{
 transform:rotate(-10deg);
}
 20%,40%{
 transform:rotate(10deg);
}
 50%{
 transform:rotate(0deg);
}
}


@media (max-width:768px){
 .floating-call-btn{
 bottom:20px;
 right:20px;
 padding:15px;
 border-radius:50%;
}
 
 .floating-call-text{
 display:none;
}
}


.related-post-title{
 font-size:1rem;
 margin-bottom:8px;
}
/* =========================================== 
 TRUBAČI STARS - LIGHTBOX 
 =========================================== */ 
 
.lightbox{
 display:none;
 position:fixed;
 top:0;
 left:0;
 width:100%;
 height:100%;
 background:rgba(0,0,0,0.9);
 z-index:2000;
 justify-content:center;
 align-items:center;
}
 
.lightbox.active{
 display:flex;
}
 
.lightbox-image{
 max-width:90%;
 max-height:90%;
 border-radius:8px;
}
 
.lightbox-close,
.lightbox-prev,
.lightbox-next{
 position:absolute;
 background:rgba(255,255,255,0.1);
 border:none;
 color:#fff;
 font-size:2rem;
 cursor:pointer;
 padding:15px 20px;
 border-radius:8px;
 transition:var(--transition);
}
 
.lightbox-close:hover,
.lightbox-prev:hover,
.lightbox-next:hover{
 background:var(--primary-gold);
}
 
.lightbox-close{
 top:20px;
 right:20px;
}
 
.lightbox-prev{
 left:20px;
 top:50%;
 transform:translateY(-50%);
}
 
.lightbox-next{
 right:20px;
 top:50%;
 transform:translateY(-50%);
}
/* ===========================================
 TRUBAČI STARS - ANIMATIONS
 =========================================== */


@keyframes fadeInUp{
 from{
 opacity:0;
 transform:translateY(25px);
}
 to{
 opacity:1;
 transform:translateY(0);
}
}

@keyframes fadeInDown{
 from{
 opacity:0;
 transform:translateY(-25px);
}
 to{
 opacity:1;
 transform:translateY(0);
}
}

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

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

@keyframes fadeIn{
 from{
 opacity:0;
}
 to{
 opacity:1;
}
}

@keyframes scaleIn{
 from{
 opacity:0;
 transform:scale(0.9);
}
 to{
 opacity:1;
 transform:scale(1);
}
}

@keyframes slideInUp{
 from{
 opacity:0;
 transform:translateY(50px);
}
 to{
 opacity:1;
 transform:translateY(0);
}
}

@keyframes pulse{
 0%,100%{
 transform:scale(1);
}
 50%{
 transform:scale(1.03);
}
}

@keyframes shimmer{
 0%{
 background-position:-200% 0;
}
 100%{
 background-position:200% 0;
}
}

@keyframes float{
 0%,100%{
 transform:translateY(0);
}
 50%{
 transform:translateY(-8px);
}
}

@keyframes glow{
 0%,100%{
 box-shadow:0 0 5px rgba(212,168,71,0.3);
}
 50%{
 box-shadow:0 0 20px rgba(212,168,71,0.6);
}
}

@keyframes rotateIn{
 from{
 opacity:0;
 transform:rotate(-10deg) scale(0.9);
}
 to{
 opacity:1;
 transform:rotate(0) scale(1);
}
}

@keyframes bounceIn{
 0%{
 opacity:0;
 transform:scale(0.3);
}
 50%{
 transform:scale(1.05);
}
 70%{
 transform:scale(0.9);
}
 100%{
 opacity:1;
 transform:scale(1);
}
}


.animate-fade-in{
 animation:fadeIn 0.8s ease forwards;
}

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

.animate-fade-in-down{
 animation:fadeInDown 0.8s ease forwards;
}

.animate-fade-in-left{
 animation:fadeInLeft 0.8s ease forwards;
}

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

.animate-scale-in{
 animation:scaleIn 0.6s ease forwards;
}

.animate-bounce-in{
 animation:bounceIn 0.8s ease forwards;
}


.delay-100{transition-delay:0.05s;animation-delay:0.05s}
.delay-200{transition-delay:0.1s;animation-delay:0.1s}
.delay-300{transition-delay:0.15s;animation-delay:0.15s}
.delay-400{transition-delay:0.2s;animation-delay:0.2s}
.delay-500{transition-delay:0.25s;animation-delay:0.25s}
.delay-600{transition-delay:0.3s;animation-delay:0.3s}
.delay-700{transition-delay:0.35s;animation-delay:0.35s}
.delay-800{transition-delay:0.4s;animation-delay:0.4s}

/* ===========================================
 SCROLL REVEAL ANIMATIONS (pcshop style)
 =========================================== */


.reveal{
 opacity:0 !important;
 transform:translateY(40px);
 transition:opacity 0.8s cubic-bezier(0.4,0,0.2,1),
 transform 0.8s cubic-bezier(0.4,0,0.2,1);
 will-change:transform,opacity;
}

.reveal.revealed{
 opacity:1 !important;
 transform:translateY(0);
}


.reveal-left{
 opacity:0 !important;
 transform:translateX(-40px);
 transition:opacity 0.8s cubic-bezier(0.4,0,0.2,1),
 transform 0.8s cubic-bezier(0.4,0,0.2,1);
}

.reveal-left.revealed{
 opacity:1 !important;
 transform:translateX(0);
}


.reveal-right{
 opacity:0 !important;
 transform:translateX(40px);
 transition:opacity 0.8s cubic-bezier(0.4,0,0.2,1),
 transform 0.8s cubic-bezier(0.4,0,0.2,1);
}

.reveal-right.revealed{
 opacity:1 !important;
 transform:translateX(0);
}


.reveal-scale{
 opacity:0 !important;
 transform:scale(0.9);
 transition:opacity 0.6s cubic-bezier(0.4,0,0.2,1),
 transform 0.6s cubic-bezier(0.4,0,0.2,1);
}

.reveal-scale.revealed{
 opacity:1 !important;
 transform:scale(1);
}


.stagger-children > .service-card,
.stagger-children > .gallery-column,
.stagger-children > .gallery-item,
.stagger-children > .category-card,
.stagger-children > .testimonial-card,
.stagger-children > .why-card,
.stagger-children > .feature,
.stagger-children > .contact-item,
.stagger-children > .stat,
.stagger-children > div,
.stagger-children > a{
 opacity:0;
 transform:translateY(30px);
 transition:opacity 0.6s cubic-bezier(0.4,0,0.2,1),
 transform 0.6s cubic-bezier(0.4,0,0.2,1);
}

.stagger-children.revealed > .service-card,
.stagger-children.revealed > .gallery-column,
.stagger-children.revealed > .gallery-item,
.stagger-children.revealed > .category-card,
.stagger-children.revealed > .testimonial-card,
.stagger-children.revealed > .why-card,
.stagger-children.revealed > .feature,
.stagger-children.revealed > .contact-item,
.stagger-children.revealed > .stat,
.stagger-children.revealed > div,
.stagger-children.revealed > a{
 opacity:1;
 transform:translateY(0);
}


.stagger-children:not(.revealed) > *:nth-child(1){transition-delay:0.05s}
.stagger-children:not(.revealed) > *:nth-child(2){transition-delay:0.1s}
.stagger-children:not(.revealed) > *:nth-child(3){transition-delay:0.15s}
.stagger-children:not(.revealed) > *:nth-child(4){transition-delay:0.2s}
.stagger-children:not(.revealed) > *:nth-child(5){transition-delay:0.25s}
.stagger-children:not(.revealed) > *:nth-child(6){transition-delay:0.3s}
.stagger-children:not(.revealed) > *:nth-child(7){transition-delay:0.35s}
.stagger-children:not(.revealed) > *:nth-child(8){transition-delay:0.4s}
.stagger-children:not(.revealed) > *:nth-child(9){transition-delay:0.45s}
.stagger-children:not(.revealed) > *:nth-child(10){transition-delay:0.5s}
.stagger-children:not(.revealed) > *:nth-child(11){transition-delay:0.55s}
.stagger-children:not(.revealed) > *:nth-child(12){transition-delay:0.6s}
.stagger-children:not(.revealed) > *:nth-child(13){transition-delay:0.65s}
.stagger-children:not(.revealed) > *:nth-child(14){transition-delay:0.7s}
.stagger-children:not(.revealed) > *:nth-child(15){transition-delay:0.75s}
.stagger-children:not(.revealed) > *:nth-child(16){transition-delay:0.8s}
.stagger-children:not(.revealed) > *:nth-child(17){transition-delay:0.85s}
.stagger-children:not(.revealed) > *:nth-child(18){transition-delay:0.9s}
.stagger-children:not(.revealed) > *:nth-child(19){transition-delay:0.95s}
.stagger-children:not(.revealed) > *:nth-child(20){transition-delay:1s}


.stagger-children.revealed > *{
 transition-delay:0s !important;
}


@media (prefers-reduced-motion:reduce){
 .reveal,
 .reveal-left,
 .reveal-right,
 .reveal-scale{
 opacity:1 !important;
 transform:none !important;
 transition:none !important;
}
 
 .stagger-children > *{
 opacity:1 !important;
 transform:none !important;
 transition:none !important;
}
}
/* =========================================== 
 TRUBAČI STARS - RESPONSIVE DESIGN 
 =========================================== */ 
 
@media (max-width:1024px){
 .about-content{
 grid-template-columns:1fr;
 gap:40px;
}
 
 .about-image{
 order:-1;
}
 
 .services-grid{
 grid-template-columns:1fr;
}
 
 .repertoire-categories{
 grid-template-columns:repeat(2,1fr);
}
 
 .testimonials-grid{
 grid-template-columns:1fr;
}
 
 .why-us-grid{
 grid-template-columns:repeat(2,1fr);
}
 
 .footer-content{
 grid-template-columns:repeat(2,1fr);
}
}
 
@media (max-width:768px){
:root{
 --section-padding:60px;
}
 
 .nav-menu{
 position:fixed;
 top:80px;
 left:0;
 right:0;
 background:var(--bg-primary);
 flex-direction:column;
 padding:20px;
 gap:10px;
 transform:translateY(-150%);
 opacity:0;
 transition:var(--transition);
 border-bottom:1px solid var(--border-color);
 box-shadow:var(--shadow-md);
}
 
 .nav-menu.active{
 transform:translateY(0);
 opacity:1;
}
 
 .nav-link{
 width:100%;
 text-align:center;
 padding:15px;
}
 
 .mobile-menu-toggle{
 display:flex;
}
 
 .mobile-menu-toggle.active span:nth-child(1){
 transform:rotate(45deg) translate(6px,6px);
}
 
 .mobile-menu-toggle.active span:nth-child(2){
 opacity:0;
}
 
 .mobile-menu-toggle.active span:nth-child(3){
 transform:rotate(-45deg) translate(6px,-6px);
}
 
 .hero-cta{
 flex-direction:column;
 align-items:center;
}
 
 .hero-stats{
 gap:30px;
}
 
 .about-features{
 grid-template-columns:1fr;
}
 
 .gallery-masonry{
 grid-template-columns:repeat(2,1fr);
}
 
 .repertoire-categories{
 grid-template-columns:1fr;
}
 
 .contact-content{
 grid-template-columns:1fr;
}
 
 .form-row{
 grid-template-columns:1fr;
}
 
 .why-us-grid{
 grid-template-columns:1fr;
}
 
 .footer-content{
 grid-template-columns:1fr;
 text-align:center;
}
 
 .footer-social{
 justify-content:center;
}
 
 .footer-brand{
 margin-bottom:20px;
}
 
 .footer-logo{
 justify-content:center;
}
}
 
@media (max-width:480px){
 .hero-badge{
 padding:10px 20px;
 font-size:0.75rem;
}
 
 .stat-number{
 font-size:2rem;
}
 
 .btn{
 padding:14px 28px;
 font-size:0.9rem;
}
 
 .gallery-masonry{
 grid-template-columns:1fr;
}
 
 .contact-form{
 padding:25px 20px;
}
}


@media (max-width:768px){
 .usluga-detail{
 grid-template-columns:1fr !important;
 gap:20px !important;
}
 .usluga-detail > div:first-child{
 order:0 !important;
}
}
/* =========================================== 
 TRUBAČI STARS - SEO PAGES STYLES 
 =========================================== */ 
 
 
.seo-hero{
 padding:160px 0 80px;
 background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);
 color:#fff;
 position:relative;
 overflow:hidden;
}
 
.seo-hero::before{
 content:'';
 position:absolute;
 top:0;left:0;right:0;bottom:0;
 background:url('/images/trubaci-01.webp') center/cover no-repeat;
 opacity:0.15;
 z-index:0;
}
 
.seo-hero .container{
 position:relative;
 z-index:1;
}
 
.seo-hero-content{
 max-width:800px;
}
 
.seo-hero .seo-breadcrumb{
 display:flex;
 align-items:center;
 gap:8px;
 margin-bottom:20px;
 font-size:0.9rem;
 color:rgba(255,255,255,0.7);
}
 
.seo-hero .seo-breadcrumb a{
 color:var(--primary-gold);
 text-decoration:none;
}
 
.seo-hero .seo-breadcrumb a:hover{
 text-decoration:underline;
}
 
.seo-hero h1{
 font-family:var(--font-display);
 font-size:clamp(2.2rem,5vw,3.5rem);
 font-weight:700;
 line-height:1.2;
 margin-bottom:20px;
}
 
.seo-hero h1 .gold{
 color:var(--primary-gold);
}
 
.seo-hero .seo-hero-desc{
 font-size:1.15rem;
 line-height:1.8;
 color:rgba(255,255,255,0.85);
 margin-bottom:30px;
}
 
.seo-hero .seo-hero-stats{
 display:flex;
 gap:40px;
 margin-bottom:30px;
}
 
.seo-hero .seo-stat{
 text-align:center;
}
 
.seo-hero .seo-stat-number{
 display:block;
 font-family:var(--font-display);
 font-size:2.5rem;
 font-weight:700;
 color:var(--primary-gold);
}
 
.seo-hero .seo-stat-label{
 font-size:0.85rem;
 color:rgba(255,255,255,0.7);
 text-transform:uppercase;
 letter-spacing:1px;
}
 
.seo-hero .seo-hero-cta{
 display:flex;
 gap:15px;
 flex-wrap:wrap;
}
 
 
.seo-content{
 padding:80px 0;
}
 
.seo-content-grid{
 display:grid;
 grid-template-columns:2fr 1fr;
 gap:60px;
 align-items:start;
}
 
.seo-main-content h2{
 font-family:var(--font-display);
 font-size:1.8rem;
 color:var(--text-primary);
 margin-bottom:20px;
 margin-top:40px;
}
 
.seo-main-content h2:first-child{
 margin-top:0;
}
 
.seo-main-content h2 .gold{
 color:var(--primary-gold);
}
 
.seo-main-content h3{
 font-family:var(--font-display);
 font-size:1.4rem;
 color:var(--text-primary);
 margin-bottom:15px;
 margin-top:30px;
}
 
.seo-main-content p{
 font-size:1.05rem;
 line-height:1.8;
 color:var(--text-secondary);
 margin-bottom:15px;
}
 
.seo-main-content ul{
 margin-bottom:20px;
 padding-left:0;
}
 
.seo-main-content ul li{
 padding:8px 0 8px 30px;
 position:relative;
 font-size:1.05rem;
 color:var(--text-secondary);
 line-height:1.6;
}
 
.seo-main-content ul li::before{
 content:'\f00c';
 font-family:'Font Awesome 6 Free';
 font-weight:900;
 position:absolute;
 left:0;
 color:var(--primary-gold);
 font-size:0.85rem;
}
 
 
.seo-sidebar{
 position:sticky;
 top:100px;
}
 
.seo-sidebar-card{
 background:var(--bg-secondary);
 border-radius:16px;
 padding:30px;
 margin-bottom:20px;
 border:1px solid var(--border-color);
}
 
.seo-sidebar-card h3{
 font-family:var(--font-display);
 font-size:1.3rem;
 margin-bottom:20px;
 color:var(--text-primary);
}
 
.seo-sidebar-card .seo-contact-item{
 display:flex;
 align-items:center;
 gap:12px;
 padding:12px 0;
 border-bottom:1px solid var(--border-light);
}
 
.seo-sidebar-card .seo-contact-item:last-child{
 border-bottom:none;
}
 
.seo-sidebar-card .seo-contact-item i{
 width:40px;
 height:40px;
 background:var(--gradient-gold);
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 color:#fff;
 font-size:0.9rem;
 flex-shrink:0;
}
 
.seo-sidebar-card .seo-contact-item a{
 color:var(--text-primary);
 font-weight:500;
 font-size:1rem;
}
 
.seo-sidebar-card .seo-contact-item a:hover{
 color:var(--primary-gold);
}
 
.seo-sidebar-card .btn{
 margin-top:15px;
}
 
 
.seo-services-grid{
 display:grid;
 grid-template-columns:repeat(2,1fr);
 gap:20px;
 margin:30px 0;
}
 
.seo-service-box{
 background:var(--bg-secondary);
 border-radius:12px;
 padding:25px;
 text-align:center;
 border:1px solid var(--border-color);
 transition:var(--transition);
}
 
.seo-service-box:hover{
 border-color:var(--primary-gold);
 transform:translateY(-3px);
 box-shadow:var(--shadow-gold);
}
 
.seo-service-box i{
 font-size:2rem;
 color:var(--primary-gold);
 margin-bottom:10px;
}
 
.seo-service-box h4{
 font-size:1rem;
 color:var(--text-primary);
 margin-bottom:5px;
}
 
.seo-service-box p{
 font-size:0.85rem;
 color:var(--text-muted);
 margin-bottom:0;
}
 
 
.seo-faq{
 padding:80px 0;
 background:var(--bg-secondary);
}
 
.seo-faq .section-header{
 text-align:center;
 margin-bottom:50px;
}
 
.seo-faq-grid{
 max-width:800px;
 margin:0 auto;
}
 
.seo-faq-item{
 background:var(--bg-primary);
 border-radius:12px;
 margin-bottom:12px;
 border:1px solid var(--border-color);
 overflow:hidden;
 transition:var(--transition);
}
 
.seo-faq-item:hover{
 border-color:var(--primary-gold-light);
}
 
.seo-faq-item.active{
 border-color:var(--primary-gold);
 box-shadow:var(--shadow-gold);
}
 
.seo-faq-question{
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:20px 25px;
 cursor:pointer;
 gap:15px;
}
 
.seo-faq-question h4{
 font-size:1.05rem;
 font-weight:600;
 color:var(--text-primary);
 margin:0;
 flex:1;
}
 
.seo-faq-question i{
 color:var(--primary-gold);
 transition:var(--transition);
 font-size:0.9rem;
}
 
.seo-faq-item.active .seo-faq-question i{
 transform:rotate(180deg);
}
 
.seo-faq-answer{
 max-height:0;
 overflow:hidden;
 transition:max-height 0.3s ease;
}
 
.seo-faq-item.active .seo-faq-answer{
 max-height:500px;
}
 
.seo-faq-answer p{
 padding:0 25px 20px;
 font-size:1rem;
 line-height:1.7;
 color:var(--text-secondary);
 margin:0;
}
 
 
.seo-cta-section{
 padding:80px 0;
 background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);
 color:#fff;
 text-align:center;
}
 
.seo-cta-content h2{
 font-family:var(--font-display);
 font-size:clamp(1.8rem,4vw,2.5rem);
 margin-bottom:15px;
}
 
.seo-cta-content p{
 font-size:1.1rem;
 color:rgba(255,255,255,0.8);
 margin-bottom:30px;
}
 
.seo-cta-buttons{
 display:flex;
 gap:15px;
 justify-content:center;
 flex-wrap:wrap;
}
 
 
.seo-related{
 padding:60px 0;
 background:var(--bg-secondary);
}
 
.seo-related .section-title{
 text-align:center;
 margin-bottom:40px;
}
 
.seo-related-grid{
 display:grid;
 grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
 gap:15px;
}
 
.seo-related-card{
 background:var(--bg-primary);
 border:1px solid var(--border-color);
 border-radius:12px;
 padding:25px 20px;
 text-align:center;
 transition:var(--transition);
 text-decoration:none;
 color:var(--text-primary);
}
 
.seo-related-card:hover{
 border-color:var(--primary-gold);
 transform:translateY(-3px);
 box-shadow:var(--shadow-gold);
 color:var(--primary-gold);
}
 
.seo-related-card i{
 font-size:1.5rem;
 color:var(--primary-gold);
 margin-bottom:10px;
 display:block;
}
 
.seo-related-card h4{
 font-size:0.95rem;
 font-weight:600;
 margin:0;
}
 
 
.seo-testimonial{
 background:var(--bg-accent);
 border-radius:12px;
 padding:25px;
 margin:30px 0;
 border-left:4px solid var(--primary-gold);
}
 
.seo-testimonial p{
 font-style:italic;
 margin-bottom:10px !important;
}
 
.seo-testimonial .seo-testimonial-author{
 font-weight:600;
 color:var(--primary-gold);
 font-size:0.9rem !important;
 font-style:normal;
}
 
 
.seo-why-grid{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:20px;
 margin:30px 0;
}
 
.seo-why-box{
 background:var(--bg-primary);
 border:1px solid var(--border-color);
 border-radius:12px;
 padding:25px;
 text-align:center;
 transition:var(--transition);
}
 
.seo-why-box:hover{
 border-color:var(--primary-gold);
 box-shadow:var(--shadow-sm);
}
 
.seo-why-box .why-icon{
 width:50px;
 height:50px;
 background:var(--gradient-gold);
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 margin:0 auto 12px;
 color:#fff;
 font-size:1.1rem;
}
 
.seo-why-box h4{
 font-size:1rem;
 margin-bottom:5px;
 color:var(--text-primary);
}
 
.seo-why-box p{
 font-size:0.85rem;
 color:var(--text-muted);
 margin:0;
}
 
 
.seo-pricing-highlight{
 background:linear-gradient(135deg,var(--primary-gold),var(--primary-gold-light));
 color:#fff;
 border-radius:16px;
 padding:30px;
 text-align:center;
 margin:30px 0;
}
 
.seo-pricing-highlight .price-range{
 font-family:var(--font-display);
 font-size:2.5rem;
 font-weight:700;
 margin-bottom:5px;
}
 
.seo-pricing-highlight .price-note{
 font-size:0.9rem;
 opacity:0.9;
}
 
 
.seo-gallery-mini{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:10px;
 margin:20px 0;
 border-radius:12px;
 overflow:hidden;
}
 
.seo-gallery-mini img{
 width:100%;
 height:200px;
 object-fit:cover;
 border-radius:8px;
 transition:var(--transition);
}
 
.seo-gallery-mini img:hover{
 transform:scale(1.05);
}
 
 
@media (max-width:768px){
 .seo-hero{
 padding:120px 0 60px;
}
 
 .seo-hero .seo-hero-stats{
 gap:20px;
}
 
 .seo-hero .seo-stat-number{
 font-size:1.8rem;
}
 
 .seo-content-grid{
 grid-template-columns:1fr;
 gap:40px;
}
 
 .seo-sidebar{
 position:static;
}
 
 .seo-services-grid{
 grid-template-columns:1fr;
}
 
 .seo-why-grid{
 grid-template-columns:1fr;
}
 
 .seo-gallery-mini{
 grid-template-columns:repeat(2,1fr);
}
 
 .seo-related-grid{
 grid-template-columns:repeat(2,1fr);
}
 
 .seo-hero .seo-hero-cta{
 flex-direction:column;
}
 
 .seo-cta-buttons{
 flex-direction:column;
 align-items:center;
}
}
 
@media (max-width:480px){
 .seo-hero .seo-hero-stats{
 flex-direction:column;
 gap:15px;
}
 
 .seo-gallery-mini{
 grid-template-columns:1fr;
}
 
 .seo-related-grid{
 grid-template-columns:1fr;
}
}
 
/* =========================================== 
 CONTACT FORM IN CTA SECTION 
 =========================================== */ 
.cta-contact-grid{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:50px;
 align-items:start;
}
 
.cta-section .cta-content{
 text-align:left;
}
 
.cta-section .cta-content h2{
 font-family:var(--font-display);
 font-size:clamp(1.8rem,4vw,2.5rem);
 margin-bottom:15px;
}
 
.cta-section .cta-content p{
 font-size:1.1rem;
 color:rgba(255,255,255,0.8);
 margin-bottom:25px;
}
 
.cta-contact-info{
 margin-top:30px;
 display:flex;
 flex-direction:column;
 gap:12px;
}
 
.cta-contact-item{
 display:flex;
 align-items:center;
 gap:10px;
 color:rgba(255,255,255,0.85);
 font-size:0.95rem;
}
 
.cta-contact-item i{
 width:30px;
 text-align:center;
 color:var(--primary-gold);
 font-size:1rem;
}
 
.cta-contact-item a{
 color:rgba(255,255,255,0.9);
 text-decoration:none;
 transition:color 0.3s;
}
 
.cta-contact-item a:hover{
 color:var(--primary-gold);
}
 
.cta-form-wrap{
 background:rgba(255,255,255,0.08);
 border:1px solid rgba(255,255,255,0.15);
 border-radius:16px;
 padding:30px;
 backdrop-filter:blur(10px);
}
 
.cta-form-wrap h3{
 font-family:var(--font-display);
 font-size:1.4rem;
 color:#fff;
 margin-bottom:20px;
}
 
.cta-form-wrap h3 i{
 color:var(--primary-gold);
 margin-right:8px;
}
 
.cta-form-wrap .form-row{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:12px;
}
 
.cta-form-wrap .form-group{
 margin-bottom:14px;
}
 
.cta-form-wrap label{
 display:block;
 font-size:0.85rem;
 color:rgba(255,255,255,0.7);
 margin-bottom:5px;
 font-weight:500;
}
 
.cta-form-wrap input,
.cta-form-wrap select,
.cta-form-wrap textarea{
 width:100%;
 padding:10px 14px;
 background:rgba(255,255,255,0.1);
 border:1px solid rgba(255,255,255,0.2);
 border-radius:8px;
 color:#fff;
 font-size:0.95rem;
 font-family:inherit;
 transition:all 0.3s;
 box-sizing:border-box;
}
 
.cta-form-wrap input::placeholder,
.cta-form-wrap textarea::placeholder{
 color:rgba(255,255,255,0.4);
}
 
.cta-form-wrap input:focus,
.cta-form-wrap select:focus,
.cta-form-wrap textarea:focus{
 outline:none;
 border-color:var(--primary-gold);
 background:rgba(255,255,255,0.15);
 box-shadow:0 0 0 3px rgba(212,168,71,0.15);
}
 
.cta-form-wrap select option{
 background:#1a1a2e;
 color:#fff;
}
 
.cta-form-wrap .btn-full{
 width:100%;
 padding:12px;
 font-size:1rem;
 font-weight:600;
 margin-top:5px;
 cursor:pointer;
}
 
.cta-form-wrap .btn-full:disabled{
 opacity:0.7;
 cursor:not-allowed;
}
 
.form-status{
 margin-top:12px;
 padding:0;
 border-radius:8px;
 font-size:0.9rem;
 text-align:center;
 transition:all 0.3s;
}
 
.form-status.success{
 padding:12px;
 background:rgba(16,185,129,0.15);
 border:1px solid rgba(16,185,129,0.3);
 color:#6ee7b7;
}
 
.form-status.error{
 padding:12px;
 background:rgba(239,68,68,0.15);
 border:1px solid rgba(239,68,68,0.3);
 color:#fca5a5;
}
 
 
.footer-links ul{
 columns:1;
}
 
.footer-content{
 display:grid;
 grid-template-columns:1.5fr 1fr 1.5fr 1.5fr 1.2fr;
 gap:30px;
}
 
@media (max-width:1200px){
 .footer-content{
 grid-template-columns:1fr 1fr 1fr;
}
}
 
@media (max-width:768px){
 .cta-contact-grid{
 grid-template-columns:1fr;
 gap:30px;
}
 
 .cta-section .cta-content{
 text-align:center;
}
 
 .cta-contact-info{
 align-items:center;
}
 
 .cta-form-wrap .form-row{
 grid-template-columns:1fr;
}
 
 .footer-content{
 grid-template-columns:1fr 1fr;
}
}
 
@media (max-width:480px){
 .footer-content{
 grid-template-columns:1fr;
}
 
 .cta-form-wrap{
 padding:20px;
}
}




.process-steps{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
 gap:25px;
 margin-top:40px;
}
.process-step{
 background:var(--bg-secondary,#f8f9fa);
 border:1px solid var(--border-color,#e9ecef);
 border-radius:14px;
 padding:30px 25px;
 text-align:center;
 transition:transform 0.3s,box-shadow 0.3s,border-color 0.3s;
 position:relative;
}
.process-step:hover{
 transform:translateY(-4px);
 border-color:var(--primary-gold,#D4A847);
 box-shadow:0 12px 30px rgba(212,168,71,0.15);
}
.process-step-number{
 width:56px;
 height:56px;
 line-height:56px;
 border-radius:50%;
 background:linear-gradient(135deg,var(--primary-gold,#D4A847),#b48c32);
 color:#fff;
 font-weight:800;
 font-size:1.5rem;
 margin:0 auto 18px;
 box-shadow:0 6px 16px rgba(212,168,71,0.35);
}
.process-step h4{
 font-family:var(--font-display,'Playfair Display',serif);
 font-size:1.2rem;
 color:var(--text-primary,#1a1a2e);
 margin-bottom:10px;
}
.process-step p{color:var(--text-secondary,#4a4a5a);font-size:0.95rem;line-height:1.6}


.seo-pricing-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
 gap:25px;
 margin:40px 0;
}
.pricing-detail-card{
 background:var(--bg-primary,#fff);
 border:1px solid var(--border-color,#e9ecef);
 border-radius:14px;
 padding:30px 25px;
 text-align:center;
 transition:transform 0.3s,box-shadow 0.3s,border-color 0.3s;
}
.pricing-detail-card:hover{
 transform:translateY(-4px);
 border-color:var(--primary-gold,#D4A847);
 box-shadow:0 14px 30px rgba(212,168,71,0.18);
}
.pricing-detail-card i{font-size:2.4rem;color:var(--primary-gold,#D4A847);margin-bottom:12px}
.pricing-detail-card h4{font-family:var(--font-display,serif);font-size:1.25rem;margin-bottom:8px}
.pricing-detail-card .pricing-price{
 font-family:var(--font-display,serif);
 font-size:1.6rem;
 color:var(--primary-gold,#D4A847);
 font-weight:700;
 margin:8px 0 12px;
}


.seo-repertoire .seo-services-grid{
 grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}


.seo-why-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
 gap:22px;
 margin-top:35px;
}
.seo-why-card{
 background:var(--bg-secondary,#f8f9fa);
 border:1px solid var(--border-color,#e9ecef);
 border-radius:12px;
 padding:26px 22px;
 text-align:center;
 transition:all 0.3s;
}
.seo-why-card:hover{border-color:var(--primary-gold);transform:translateY(-3px)}
.seo-why-card i{font-size:2.2rem;color:var(--primary-gold,#D4A847);margin-bottom:10px}
.seo-why-card h4{font-size:1.05rem;margin-bottom:8px;color:var(--text-primary)}
.seo-why-card p{color:var(--text-secondary);font-size:0.92rem;line-height:1.55}


.seo-testimonials-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
 gap:25px;
 margin-top:35px;
}
.seo-testimonial-card{
 background:var(--bg-primary,#fff);
 border:1px solid var(--border-color);
 border-radius:14px;
 padding:30px 25px;
 box-shadow:0 4px 14px rgba(0,0,0,0.04);
}
.seo-testimonial-card .testimonial-stars{color:var(--primary-gold,#D4A847);margin-bottom:12px}
.seo-testimonial-card .testimonial-text{font-style:italic;color:var(--text-secondary);margin-bottom:18px;line-height:1.6}
.seo-testimonial-card .testimonial-author{font-weight:700;color:var(--text-primary)}


.faq-item{
 background:var(--bg-primary,#fff);
 border:1px solid var(--border-color);
 border-radius:12px;
 margin-bottom:16px;
 padding:20px 25px;
 transition:border-color 0.3s;
}
.faq-item:hover{border-color:var(--primary-gold)}
.faq-question h4{font-size:1.05rem;color:var(--text-primary);margin:0;display:flex;align-items:center;gap:10px}
.faq-question h4 i{color:var(--primary-gold,#D4A847)}
.faq-answer p{color:var(--text-secondary);margin-top:12px;line-height:1.65}


.seo-process .section-header,
.seo-why-section .section-header,
.seo-pricing-section .section-header,
.seo-repertoire .section-header,
.seo-testimonials-section .section-header,
.faq .section-header,
.cities .section-header{
 text-align:center;
 margin-bottom:35px;
}


.seo-related-card{
 display:flex;
 flex-direction:column;
 align-items:center;
 background:var(--bg-secondary);
 border:1px solid var(--border-color);
 border-radius:14px;
 padding:24px 20px;
 text-align:center;
 text-decoration:none;
 color:inherit;
 transition:all 0.3s;
}
.seo-related-card:hover{
 border-color:var(--primary-gold);
 transform:translateY(-3px);
 box-shadow:0 12px 26px rgba(212,168,71,0.15);
}
.seo-related-card i{font-size:1.8rem;color:var(--primary-gold);margin-bottom:10px}
.seo-related-card h3{font-size:1.05rem;color:var(--text-primary)}
.seo-related-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
 gap:18px;
 margin-top:30px;
}


.seo-process,.seo-why-section,.seo-pricing-section,.seo-repertoire,
.seo-testimonials-section,.faq,.cities,.seo-related{
 padding:80px 0;
}

@media (max-width:768px){
 .seo-process,.seo-why-section,.seo-pricing-section,.seo-repertoire,
 .seo-testimonials-section,.faq,.cities,.seo-related{padding:60px 0}
}




.pricing-detail-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
 gap:25px;
 margin:40px 0;
}
.pricing-details{
 margin-top:30px;
}


.repertoire-categories{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
 gap:25px;
 margin-top:40px;
}
.repertoire-category{
 background:var(--bg-secondary,#f8f9fa);
 border:1px solid var(--border-color,#e9ecef);
 border-radius:14px;
 padding:30px 25px;
 text-align:center;
 transition:transform 0.3s,border-color 0.3s,box-shadow 0.3s;
}
.repertoire-category:hover{
 transform:translateY(-4px);
 border-color:var(--primary-gold,#D4A847);
 box-shadow:0 14px 30px rgba(212,168,71,0.18);
}
.repertoire-icon{
 width:70px;
 height:70px;
 line-height:70px;
 border-radius:50%;
 background:linear-gradient(135deg,var(--primary-gold,#D4A847),#b48c32);
 margin:0 auto 18px;
 box-shadow:0 6px 16px rgba(212,168,71,0.35);
}
.repertoire-icon i{
 font-size:1.8rem;
 color:#fff;
}
.repertoire-category h4{
 font-family:var(--font-display,serif);
 font-size:1.25rem;
 color:var(--text-primary,#1a1a2e);
 margin-bottom:12px;
}
.repertoire-category p{
 color:var(--text-secondary,#4a4a5a);
 font-size:0.95rem;
 line-height:1.65;
}


.seo-testimonials-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
 gap:25px;
 margin-top:35px;
}
.seo-testimonial{
 background:var(--bg-primary,#fff);
 border:1px solid var(--border-color,#e9ecef);
 border-radius:14px;
 padding:30px 25px;
 box-shadow:0 4px 14px rgba(0,0,0,0.05);
 transition:transform 0.3s,box-shadow 0.3s;
}
.seo-testimonial:hover{
 transform:translateY(-4px);
 box-shadow:0 14px 30px rgba(212,168,71,0.18);
}
.seo-testimonial .testimonial-stars{
 color:var(--primary-gold,#D4A847);
 font-size:1.1rem;
 margin-bottom:15px;
 letter-spacing:2px;
}
.seo-testimonial p{
 font-style:italic;
 color:var(--text-secondary,#4a4a5a);
 line-height:1.7;
 margin-bottom:18px;
}
.seo-testimonial .testimonial-author{
 font-weight:700;
 color:var(--text-primary,#1a1a2e);
 font-size:1rem;
}
.seo-testimonial .testimonial-event{
 color:var(--text-muted,#6c757d);
 font-size:0.85rem;
 margin-top:4px;
}


.seo-testimonials-section .container > div:nth-of-type(2),
.seo-testimonials-section [class*=testimonial][class*=grid],
.seo-testimonials-section .seo-testimonials-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
 gap:25px;
 margin-top:35px;
}


.seo-pricing-highlight{
 background:linear-gradient(135deg,var(--primary-gold,#D4A847) 0%,#b48c32 100%);
 color:#fff;
 text-align:center;
 padding:50px 30px;
 border-radius:16px;
 margin:30px 0;
 box-shadow:0 14px 40px rgba(212,168,71,0.3);
}
.seo-pricing-highlight .price-range,
.seo-pricing-highlight h3{
 font-family:var(--font-display,serif);
 font-size:clamp(1.8rem,4vw,2.6rem);
 font-weight:700;
 margin-bottom:12px;
 color:#fff;
}
.seo-pricing-highlight .price-note,
.seo-pricing-highlight p{
 font-size:1rem;
 opacity:0.95;
 color:#fff;
}


@media (max-width:768px){
 .repertoire-categories,
 .pricing-detail-grid,
 .seo-testimonials-grid{
 grid-template-columns:1fr;
 gap:18px;
}
 .seo-pricing-highlight{padding:35px 22px}
}




.seo-testimonials-section .container{
 display:flex;
 flex-wrap:wrap;
 gap:25px;
}
.seo-testimonials-section .container > .section-header,
.seo-testimonials-section .container > p{
 flex:1 1 100%;
}
.seo-testimonials-section .container > .seo-testimonial{
 flex:1 1 calc(33.33% - 17px);
 min-width:260px;
 max-width:100%;
}
.seo-testimonial-author{
 color:var(--primary-gold,#D4A847);
 font-weight:700;
 display:inline-block;
 margin-top:12px;
}


.faq .container{
 max-width:900px;
 margin:0 auto;
}
.faq .container > .faq-item{
 background:var(--bg-primary,#fff);
 border:1px solid var(--border-color,#e9ecef);
 border-radius:12px;
 padding:22px 26px;
 margin-bottom:14px;
 transition:border-color 0.3s,box-shadow 0.3s;
}
.faq .container > .faq-item:hover{
 border-color:var(--primary-gold,#D4A847);
 box-shadow:0 8px 22px rgba(212,168,71,0.12);
}
.faq-item h4,
.faq-item .faq-question h4{
 margin:0;
 font-size:1.08rem;
 color:var(--text-primary,#1a1a2e);
 display:flex;
 align-items:flex-start;
 gap:12px;
}
.faq-item h4 i,
.faq-item .faq-question h4 i{
 color:var(--primary-gold,#D4A847);
 font-size:1.1rem;
 margin-top:3px;
}
.faq-item p,
.faq-item .faq-answer p{
 margin-top:14px;
 color:var(--text-secondary,#4a4a5a);
 line-height:1.7;
}


.cities .cities-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
 gap:18px;
 margin-top:35px;
}
.cities-grid .city-item{
 background:var(--bg-secondary,#f8f9fa);
 border:1px solid var(--border-color,#e9ecef);
 border-radius:12px;
 padding:18px 20px;
 text-align:center;
 color:var(--text-primary,#1a1a2e);
 text-decoration:none;
 transition:all 0.3s;
 font-weight:600;
}
.cities-grid .city-item:hover{
 background:linear-gradient(135deg,var(--primary-gold,#D4A847),#b48c32);
 color:#fff;
 transform:translateY(-3px);
 border-color:var(--primary-gold);
 box-shadow:0 8px 20px rgba(212,168,71,0.25);
}


.seo-pricing-section .pricing-details{
 margin-top:30px;
}


.seo-pricing-section,
.seo-repertoire,
.seo-testimonials-section,
.faq,
.cities{
 padding:70px 0;
}

@media (max-width:768px){
 .seo-testimonials-section .container > .seo-testimonial{
 flex:1 1 100%;
}
 .seo-pricing-section,.seo-repertoire,.seo-testimonials-section,.faq,.cities{padding:50px 0}
}