.hero {position: relative; isolation: isolate; color: #fff;
  min-height: clamp(560px, 46vw, 760px);
  padding-bottom: 70px;
  background:
    radial-gradient(120% 70% at 75% 78%, rgba(255, 170, 90, .55), transparent 55%),
    linear-gradient(180deg, #24508b 0%, #3f6ea6 38%, #8a8fa8 62%, #e7a170 76%, #2c5d97 80%, #143c74 100%);
  overflow: hidden;}
.hero__slides {position: absolute; inset: 0;}
.hero__slide {position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 1s var(--ease), visibility 0s 1s;}
.hero__slide.is-active {opacity: 1; visibility: visible; transition-delay: 0s; z-index: 1;}
.hero__media {position: absolute; top: 0; right: 0; bottom: 0; width: min(70%, 1300px); overflow: hidden; transform: translate3d(0, var(--parallax, 0px), 0); will-change: transform; -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.6) 14%, #000 32%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.6) 14%, #000 32%);}
.hero__media img {width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; transform: scale(1.12); transition: transform 7s linear;}
.hero__slide.is-active .hero__media img {transform: scale(1.02);}
.hero__media::before {content: ""; position: absolute; inset: 0; z-index: 1; background: none;}
.hero__media::after {content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(10,32,72,.25) 0%, transparent 25%, transparent 70%, rgba(16, 52, 104, .55) 100%);}
.hero__slide--dusk .hero__media img {filter: saturate(1.15) hue-rotate(-8deg) brightness(.92); object-position: 20% 60%;}
.hero__slide--day .hero__media img {filter: saturate(.9) brightness(1.06) hue-rotate(10deg); object-position: 80% 55%;}
.hero__slide--night .hero__media img {filter: brightness(.62) saturate(.8) hue-rotate(20deg);}
.hero__slide--night .hero__media::before {background: linear-gradient(90deg, rgba(11, 37, 84, .7) 0%, transparent 55%);}
.hero__slide--night {background: linear-gradient(180deg, #0d2550 0%, #1b3b6e 70%, #0d2550 100%);}
.hero__content {position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-top: 10px; padding-bottom: 70px;}
.hero__content > * {max-width: 600px;}
.hero__content > .hero__title {max-width: 760px;}
.hero__title {color: #fff; font-size: clamp(36px, 4.6vw, 64px); font-weight: 700; line-height: 1.08; letter-spacing: -.015em; margin: 6px 0 22px; text-shadow: 0 2px 20px rgba(6, 22, 51, .35);}
.hero__title span {display: block; color: #3ab0ff; background: linear-gradient(90deg, #36b1ff, #1d8af0); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;}
.hero__lead {font-size: clamp(15px, 1.25vw, 18px); line-height: 1.6; color: rgba(255,255,255,.92); max-width: 520px;}
.hero__ctas {display: flex; flex-wrap: wrap; gap: 18px; margin-top: 30px;}
.hero__arrow {position: absolute; z-index: 5; top: calc(50% - 60px); width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; color: #fff; border: 1.5px solid rgba(255,255,255,.6); background: rgba(10, 30, 70, .2); backdrop-filter: blur(6px); transition: background .3s, transform .3s var(--ease), border-color .3s;}
.hero__arrow:hover {background: rgba(255,255,255,.95); color: var(--navy-700); transform: scale(1.08);}
.hero__arrow--prev {left: clamp(12px, 2.6vw, 40px);}
.hero__arrow--next {right: clamp(12px, 2.6vw, 40px);}
.hero__dots {position: absolute; z-index: 7; left: 50%; bottom: 168px; transform: translateX(-50%); display: flex; gap: 10px;}
.hero__dot {width: 11px; height: 11px; border-radius: var(--radius-pill); background: rgba(255,255,255,.85); transition: width .4s var(--ease), background .3s; position: relative; overflow: hidden;}
.hero__dot.is-active {width: 30px; background: rgba(255,255,255,.35);}
.hero__dot.is-active::after {content: ""; position: absolute; inset: 0; background: var(--blue-400); transform-origin: left; animation: dotProgress var(--hero-interval, 6500ms) linear forwards;}
.hero.is-paused .hero__dot.is-active::after {animation-play-state: paused;}
.hero__wave {position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 130px; z-index: 3;}
.hero__wave .wave-a {fill: rgba(255,255,255,.45);}
.hero__wave .wave-b {fill: #f4f9ff;}
.gull {position: absolute; z-index: 4; width: 46px; height: 18px; pointer-events: none;}
.gull::before,
.gull::after {content: ""; position: absolute; top: 6px; width: 24px; height: 10px; border-top: 3px solid rgba(255,255,255,.9); border-radius: 50% 50% 0 0;}
.gull::before {left: 0; transform: rotate(-12deg);}
.gull::after {right: 0; transform: rotate(12deg);}
.gull--1 {top: 13%; left: 50%;}
.gull--2 {top: 14%; right: 14%; transform: scale(.7);}
.stats-wrap {position: absolute; z-index: 6; left: 0; right: 0; bottom: 34px; display: flex; justify-content: center; pointer-events: none;}
.stats-wrap .stats {pointer-events: auto;}
.stats {width: min(100%, 980px); display: grid; grid-template-columns: repeat(4, 1fr);
  padding: 20px 26px; border-radius: 18px;
  background: linear-gradient(180deg, rgba(56, 120, 196, .55), rgba(28, 82, 150, .6));
  border: 1px solid rgba(255,255,255,.35);
  backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3);
  box-shadow: 0 20px 40px rgba(6, 22, 51, .25), inset 0 1px 0 rgba(255,255,255,.35);}
.stat {display: flex; align-items: center; justify-content: center; gap: 16px; position: relative; padding: 4px 10px;}
.stat + .stat::before {content: ""; position: absolute; left: 0; top: 10%; bottom: 10%; width: 1px; background: rgba(255,255,255,.3);}
.stat__ic {width: 44px; height: 44px; color: #fff; stroke-width: 1.6; transition: transform .4s var(--ease);}
.stat:hover .stat__ic {transform: translateY(-3px) rotate(-6deg);}
.stat strong {display: block; font-family: var(--font-head); font-size: 30px; font-weight: 600; line-height: 1.05; color: #fff;}
.stat span {font-size: 14px; color: rgba(255,255,255,.9);}
.hero__slide {transition: opacity var(--hero-fade, 1s) var(--ease), visibility 0s var(--hero-fade, 1s);}
.hero__title span {-webkit-text-fill-color: transparent;}
.hero .eyebrow {color: #fff;}
.hero__waves {z-index: 3;}
.stats {grid-template-columns: repeat(var(--stat-cols, 4), 1fr);}
.stat__ic {color: var(--stat-ic, #fff);}
.stat strong,
.stat span {color: inherit;}
.gull--1 {animation: gullFly 14s ease-in-out infinite;}
.gull--2 {animation: gullFly 18s ease-in-out infinite reverse;}
.gull::before {animation: gullFlap 1.1s ease-in-out infinite; transform-origin: right bottom;}
.gull::after {animation: gullFlapR 1.1s ease-in-out infinite; transform-origin: left bottom;}
.hero__slide [data-stagger] {opacity: 0; transform: translateY(26px); transition: opacity .8s var(--ease-out), transform .9s var(--ease-out);}
.hero__slide.is-active [data-stagger] {opacity: 1; transform: none;}
.hero__slide.is-active [data-stagger]:nth-child(1) {transition-delay: .25s;}
.hero__slide.is-active [data-stagger]:nth-child(2) {transition-delay: .4s;}
.hero__slide.is-active [data-stagger]:nth-child(3) {transition-delay: .55s;}
.hero__slide.is-active [data-stagger]:nth-child(4) {transition-delay: .7s;}
html.sonay-js .stats[data-reveal]:not(.is-visible) {transform: translateY(40px) scale(.98);}
.stats[data-reveal].is-visible {transform: none;}
.stats .stat {opacity: 0; transform: translateY(12px); transition: opacity .6s var(--ease-out), transform .6s var(--ease-out);}
.stats.is-visible .stat {opacity: 1; transform: none;}
.stats.is-visible .stat:nth-child(2) {transition-delay: .12s;}
.stats.is-visible .stat:nth-child(3) {transition-delay: .24s;}
.stats.is-visible .stat:nth-child(4) {transition-delay: .36s;}
.no-js .stats .stat {opacity: 1; transform: none;}
@media (prefers-reduced-motion: reduce) {
.hero__slide [data-stagger],
.stats .stat {opacity: 1 !important; transform: none !important;}
.hero__media img {transform: none !important;}
}
@media (min-width: 1600px) {
.hero {min-height: 720px;}
}
@media (max-width: 1100px) {
.hero__media {width: 100%; -webkit-mask-image: none; mask-image: none;}
.hero__media::before {background: linear-gradient(90deg, rgba(20, 52, 100, .9) 0%, rgba(20, 52, 100, .55) 45%, rgba(20, 52, 100, .1) 80%);}
}
@media (max-width: 1024px) {
.hero {min-height: 740px;}
.hero__content {justify-content: flex-start; padding-top: 70px; padding-bottom: 240px;}
.hero__arrow {top: auto; bottom: 182px;}
.hero__arrow--prev {left: auto; right: calc(var(--gutter) + 56px);}
.hero__arrow--next {right: var(--gutter);}
.hero__dots {left: var(--gutter); transform: none; bottom: 198px;}
.gull--1 {left: 60%;}
.stats {padding: 16px 12px;}
.stat {gap: 10px; flex-direction: column; text-align: center;}
.stat__ic {width: 36px; height: 36px;}
.stat strong {font-size: 26px;}
}
@media (max-width: 767px) {
.hero {min-height: 680px; padding-bottom: 0;}
.hero__media img {object-position: 64% 50%;}
.hero__media::before {background: linear-gradient(180deg, rgba(16, 44, 90, .85) 0%, rgba(16, 44, 90, .55) 45%, rgba(16, 44, 90, .15) 70%, rgba(16, 44, 90, .7) 100%);}
.hero__content {padding-top: 40px; padding-bottom: 300px;}
.hero__title {font-size: clamp(32px, 9vw, 42px); margin-bottom: 14px;}
.hero__ctas {gap: 12px; margin-top: 22px;}
.hero__ctas .btn {--h: 46px; padding: 0 20px; font-size: 14.5px;}
.hero__arrow {width: 38px; height: 38px; bottom: 268px;}
.hero__arrow--prev {right: calc(var(--gutter) + 46px);}
.hero__dots {bottom: 280px;}
.hero__wave {height: 80px;}
.gull--1 {top: 46%; left: 70%;}
.gull--2 {display: none;}
.stats-wrap {bottom: 22px;}
.stats {grid-template-columns: repeat(2, 1fr); gap: 4px 0; padding: 12px 8px;}
.stat {flex-direction: row; justify-content: flex-start; text-align: left; padding: 10px 12px;}
.stat + .stat::before {display: none;}
.stat:nth-child(odd)::after {content: ""; position: absolute; right: 0; top: 18%; bottom: 18%; width: 1px; background: rgba(255,255,255,.3);}
.stat:nth-child(-n+2) {border-bottom: 1px solid rgba(255,255,255,.22);}
.stat strong {font-size: 24px;}
.stat span {font-size: 12.5px;}
.stat__ic {width: 30px; height: 30px;}
}
@media (max-width: 400px) {
.hero__ctas .btn {flex: 1 1 100%;}
.hero__content {padding-bottom: 290px;}
}
.elementor-editor-active .hero__slide.is-active [data-stagger] {opacity: 1 !important; transform: none !important;}
.elementor-widget-sonay-hero {width: 100%;}
.hero__arrow .ic {width: 22px; height: 22px;}

/* ---- v3 çizim: Hero — tek renk şeffaf gradient + tam genişlikte, kırpılmayan görsel (istatistik paneline dokunulmaz) ---- */
.hero__media {inset: 0; width: 100%; -webkit-mask-image: none; mask-image: none;}
.hero__media img {object-fit: cover; object-position: 50% 62%;}
.hero__media::before {background: linear-gradient(to right, color-mix(in srgb, var(--hero-grad, #0b2e6b) var(--hero-grad-o, 80%), transparent) 0%, transparent var(--hero-grad-w, 100%));}
.hero__slide--night .hero__media::before {background: linear-gradient(to right, color-mix(in srgb, var(--hero-grad, #0b2e6b) var(--hero-grad-o, 80%), transparent) 0%, transparent var(--hero-grad-w, 100%));}
@media (max-width: 1100px) {
.hero__media::before {background: linear-gradient(to right, color-mix(in srgb, var(--hero-grad, #0b2e6b) var(--hero-grad-o, 80%), transparent) 0%, color-mix(in srgb, var(--hero-grad, #0b2e6b) calc(var(--hero-grad-o, 80%) * .55), transparent) 55%, color-mix(in srgb, var(--hero-grad, #0b2e6b) calc(var(--hero-grad-o, 80%) * .2), transparent) 100%);}
}
@media (max-width: 767px) {
.hero__media::before {background: linear-gradient(180deg, color-mix(in srgb, var(--hero-grad, #0b2e6b) var(--hero-grad-o, 80%), transparent) 0%, color-mix(in srgb, var(--hero-grad, #0b2e6b) calc(var(--hero-grad-o, 80%) * .6), transparent) 45%, color-mix(in srgb, var(--hero-grad, #0b2e6b) calc(var(--hero-grad-o, 80%) * .2), transparent) 70%, color-mix(in srgb, var(--hero-grad, #0b2e6b) calc(var(--hero-grad-o, 80%) * .85), transparent) 100%);}
}

/* Video arka plan */
.hero__media picture {display: contents;}
.hero__media video {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s var(--ease);}
.hero__media--video.is-playing video {opacity: 1;}
.hero__media--video video {transform: scale(1.02);}
.hero__vctl {position: absolute; right: 20px; top: 96px; z-index: 6; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.55); background: rgba(8,26,60,.55); color: #fff; cursor: pointer; backdrop-filter: blur(6px); transition: background .2s, transform .2s;}
.hero__vctl:hover {background: rgba(26,127,224,.85); transform: scale(1.06);}
.hero__vctl:focus-visible {outline: 2px solid #fff; outline-offset: 3px;}
.hero__vctl .ic {width: 16px; height: 16px;}
.hero__vctl-pause {display: none; gap: 3px;}
.hero__vctl-pause i {width: 3.5px; height: 14px; background: currentColor; border-radius: 1px;}
.hero__slide.is-vplaying .hero__vctl-play {display: none;}
.hero__slide.is-vplaying .hero__vctl-pause {display: flex;}
@media (max-width: 767px) {.hero__vctl {right: 12px; top: 84px; width: 36px; height: 36px;}}
@media (prefers-reduced-motion: reduce) {.hero__media video {transition: none;}}