/* ==========================================================================
   Suada Çocuk – hareket / animasyon katmanı
   Bu dosya tek başına kaldırılabilir; kaldırılınca site eski haline döner.
   ========================================================================== */

:root{
	--sa-green:#a3ce3a;
	--sa-yellow:#ffd320;
	--sa-pink:#e8368f;
	--sa-orange:#f5821f;
	--sa-purple:#7b3fa0;
	--sa-blue:#29b6e8;
	--sa-ease:cubic-bezier(.22,.61,.36,1);
}

/* --------------------------------------------------------------------------
   1) Kaydırınca içerik belirme (JS ile .sa-reveal eklenir)
   JS çalışmazsa hiçbir şey gizlenmez.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference){
	.sa-reveal{opacity:0;transform:translateY(28px);will-change:opacity,transform;}
	.sa-reveal.sa-in{
		opacity:1;transform:none;
		transition:opacity .7s var(--sa-ease), transform .7s var(--sa-ease);
	}
	.sa-reveal.sa-zoom{transform:translateY(18px) scale(.96);}
	.sa-reveal.sa-zoom.sa-in{transform:none;}
}

/* --------------------------------------------------------------------------
   2) Kartlar / kutular – üzerine gelince hafif zıplama
   -------------------------------------------------------------------------- */
.promo-banner-wrapper .promo-banner,
.wd-info-box,
.elementor-widget-icon-box .elementor-icon-box-wrapper{
	transition:transform .35s var(--sa-ease), box-shadow .35s var(--sa-ease);
}
.promo-banner-wrapper:hover .promo-banner{
	transform:translateY(-9px);
	box-shadow:0 20px 42px rgba(0,0,0,.15);
}
.wd-info-box:hover,
.elementor-widget-icon-box:hover .elementor-icon-box-wrapper{transform:translateY(-5px);}

/* görsellerde yumuşak yakınlaşma */
.promo-banner-wrapper .banner-image,
.e-gallery-item,
.suada-promo-media,
.suada-about-photo{overflow:hidden;border-radius:18px;}
.promo-banner-wrapper .banner-image img,
.e-gallery-item img,
.suada-promo-media img,
.suada-about-photo img{transition:transform .6s var(--sa-ease);}
.promo-banner-wrapper:hover .banner-image img,
.e-gallery-item:hover img,
.suada-promo-media:hover img,
.suada-about-photo:hover img{transform:scale(1.06);}

/* --------------------------------------------------------------------------
   3) Butonlar
   -------------------------------------------------------------------------- */
.elementor-button,
.suada-video-btn,
.wd-button-wrapper .btn{
	transition:transform .25s var(--sa-ease), box-shadow .25s var(--sa-ease), background-color .25s ease;
}
.elementor-button:hover,
.suada-video-btn:hover,
.wd-button-wrapper .btn:hover{
	transform:translateY(-3px) scale(1.03);
	box-shadow:0 12px 26px rgba(245,130,31,.32);
}
.elementor-button:active,
.suada-video-btn:active{transform:translateY(-1px) scale(.99);}

/* --------------------------------------------------------------------------
   4) Menü + logo
   -------------------------------------------------------------------------- */
.wd-nav-header>li>a{transition:transform .25s var(--sa-ease), color .25s ease;}
.wd-nav-header>li:hover>a{transform:translateY(-2px);}

.site-logo img{transition:transform .4s var(--sa-ease);}
.site-logo a:hover img{animation:sa-wobble .7s var(--sa-ease);}
@keyframes sa-wobble{
	0%,100%{transform:rotate(0) scale(1);}
	25%{transform:rotate(-2.5deg) scale(1.03);}
	60%{transform:rotate(2.5deg) scale(1.03);}
}

/* alt menü / program bağlantıları */
.wd-page-content .elementor-nav-menu>li>a{transition:transform .25s var(--sa-ease);}
.wd-page-content .elementor-nav-menu>li>a:hover{transform:translateY(-3px);}

/* --------------------------------------------------------------------------
   5) Hero alanı – süzülen renkli şekiller
   -------------------------------------------------------------------------- */
.sa-hero{position:relative;}
.sa-hero>*{position:relative;z-index:1;}
/* şekiller yalnızca ana sayfanın hero alanında, metnin dışındaki kenarlarda durur */
.sa-deco{position:absolute;inset:-20px 0 0;pointer-events:none;z-index:0;overflow:hidden;}
.sa-deco b{
	position:absolute;display:block;border-radius:50%;
	opacity:.42;filter:blur(.2px);
	animation:sa-drift 14s ease-in-out infinite;
}
.sa-deco b:nth-child(1){width:78px;height:78px;left:2%;top:12%;background:var(--sa-yellow);animation-duration:13s;}
.sa-deco b:nth-child(2){width:46px;height:46px;left:12%;top:64%;background:var(--sa-pink);animation-duration:17s;animation-delay:-3s;}
.sa-deco b:nth-child(3){width:110px;height:110px;right:3%;top:8%;background:var(--sa-blue);animation-duration:19s;animation-delay:-6s;opacity:.3;}
.sa-deco b:nth-child(4){width:34px;height:34px;right:14%;bottom:12%;background:var(--sa-green);animation-duration:11s;animation-delay:-2s;}
.sa-deco b:nth-child(5){width:58px;height:58px;left:44%;top:-14px;background:var(--sa-orange);animation-duration:16s;animation-delay:-8s;opacity:.32;}
.sa-deco b:nth-child(6){width:26px;height:26px;right:34%;bottom:24%;background:var(--sa-purple);animation-duration:12s;animation-delay:-5s;}
@keyframes sa-drift{
	0%,100%{transform:translate3d(0,0,0) scale(1);}
	33%{transform:translate3d(14px,-22px,0) scale(1.06);}
	66%{transform:translate3d(-12px,16px,0) scale(.96);}
}

/* hero görseli hafifçe süzülsün */
@media (prefers-reduced-motion: no-preference){
	.sa-hero .elementor-widget-image img{animation:sa-float 7s ease-in-out infinite;}
}
@keyframes sa-float{
	0%,100%{transform:translateY(0);}
	50%{transform:translateY(-12px);}
}

/* --------------------------------------------------------------------------
   6) Bölüm başlıkları – renkli alt çizgi çizilmesi
   -------------------------------------------------------------------------- */
.suada-video-title,
.wd-page-content .woodmart-title-container.title{position:relative;}
.suada-video-title:after{
	content:"";position:absolute;left:0;bottom:-10px;height:4px;width:0;border-radius:4px;
	background:linear-gradient(90deg,var(--sa-orange),var(--sa-pink),var(--sa-blue));
	transition:width .9s var(--sa-ease) .2s;
}
.sa-in .suada-video-title:after,
.suada-video-title.sa-in:after{width:96px;}
@media (max-width:768px){
	.suada-video-title:after{left:50%;transform:translateX(-50%);}
}

/* --------------------------------------------------------------------------
   7) SSS / akordeon ve form alanları
   -------------------------------------------------------------------------- */
.e-n-accordion-item-title{transition:transform .25s var(--sa-ease), color .25s ease;}
.e-n-accordion-item-title:hover{transform:translateX(4px);}
.elementor-field-textual{transition:box-shadow .25s ease, border-color .25s ease;}
.elementor-field-textual:focus{box-shadow:0 0 0 3px rgba(245,130,31,.18);}

/* --------------------------------------------------------------------------
   8) Footer gökyüzü sahnesi – süzülen bulutlar, uçan kuşlar, balon
   -------------------------------------------------------------------------- */
.sa-footer-host{position:relative;}
/* NOT: .e-con-inner konumlandırılmaz; aksi halde dalga şekli (elementor-shape)
   dar kutuya göre hizalanır ve kayar. Sadece içerideki widget'lar öne alınır. */
.sa-footer-host .e-con-inner>*:not(.elementor-shape){position:relative;z-index:1;}
.sa-footer-host .elementor-shape{z-index:2;}
/* sahne dalganın ALTINDAN başlar; yoksa şekiller dalgaya girip kaybolur */
.sa-footer-scene{
	position:absolute;left:0;right:0;top:62px;height:165px;
	pointer-events:none;z-index:0;overflow:hidden;
}

/* bulutlar */
.sa-cloud{
	position:absolute;display:block;width:150px;height:38px;
	background:#fff;border-radius:38px;opacity:.5;
	animation:sa-cloud-move linear infinite;
}
.sa-cloud b{position:absolute;display:block;background:#fff;border-radius:50%;}
.sa-cloud b:nth-child(1){width:54px;height:54px;left:20px;top:-24px;}
.sa-cloud b:nth-child(2){width:72px;height:72px;left:52px;top:-38px;}
.sa-cloud b:nth-child(3){width:44px;height:44px;left:100px;top:-20px;}
.sa-c1{top:52px;animation-duration:56s;}
.sa-c2{top:104px;transform:scale(.7);transform-origin:left center;opacity:.34;animation-duration:84s;animation-delay:-22s;}
.sa-c3{top:14px;transform:scale(1.25);transform-origin:left center;opacity:.22;animation-duration:70s;animation-delay:-46s;}
@keyframes sa-cloud-move{from{left:-230px;}to{left:100%;}}

/* kuşlar */
.sa-bird{
	position:absolute;width:52px;height:19px;
	fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;opacity:1;
	animation:sa-bird-fly linear infinite, sa-flap .5s ease-in-out infinite alternate;
}
.sa-b1{top:26px;animation-duration:27s,.5s;}
.sa-b2{top:92px;width:34px;height:12px;opacity:.75;animation-duration:36s,.62s;animation-delay:-9s,0s;}
@keyframes sa-bird-fly{from{left:-90px;}to{left:100%;}}
@keyframes sa-flap{from{transform:scaleY(1);}to{transform:scaleY(.5);}}

/* uçan balon */
.sa-balloon{
	position:absolute;right:9%;top:22px;width:46px;height:56px;
	background:linear-gradient(180deg,var(--sa-yellow),var(--sa-orange));
	border-radius:50% 50% 45% 45%;opacity:.9;
	animation:sa-balloon-float 9s ease-in-out infinite;
}
.sa-balloon:before{content:"";position:absolute;left:50%;bottom:-8px;width:2px;height:9px;background:rgba(255,255,255,.8);transform:translateX(-50%);}
.sa-balloon:after{content:"";position:absolute;left:50%;bottom:-18px;width:16px;height:11px;background:#c07a35;border-radius:2px 2px 4px 4px;transform:translateX(-50%);}
@keyframes sa-balloon-float{
	0%,100%{transform:translateY(0) rotate(-2deg);}
	50%{transform:translateY(-18px) rotate(2deg);}
}

/* mobilde sahneyi sadeleştir */
@media (max-width:768px){
	.sa-footer-scene{top:44px;height:120px;}
	.sa-c3,.sa-b2{display:none;}
	.sa-balloon{right:6%;top:14px;width:36px;height:44px;}
	.sa-cloud{width:104px;height:28px;}
	.sa-cloud b:nth-child(1){width:38px;height:38px;left:14px;top:-17px;}
	.sa-cloud b:nth-child(2){width:50px;height:50px;left:36px;top:-26px;}
	.sa-cloud b:nth-child(3){width:31px;height:31px;left:70px;top:-14px;}
	.sa-c1{top:34px;}
	.sa-c2{top:74px;}
	.sa-b1{top:16px;}
}

/* --------------------------------------------------------------------------
   9) Yukarı çık / sabit iletişim düğmeleri
   -------------------------------------------------------------------------- */
.scrollToTop{transition:transform .3s var(--sa-ease);}
.scrollToTop:hover{transform:translateY(-4px) scale(1.06);}

/* --------------------------------------------------------------------------
   Hareket azaltma tercihi: her şey sabit
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce){
	.sa-deco{display:none;}
	*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
}

/* küçük ekranlarda süslemeleri sadeleştir */
@media (max-width:768px){
	.sa-deco b:nth-child(3),
	.sa-deco b:nth-child(5){display:none;}
	.sa-deco b{opacity:.3;}
}
