@import url('https://fonts.googleapis.com/css2?family=Black+Ops+One&family=Bebas+Neue&family=Space+Grotesk:wght@500;600;700&display=swap');
 :root {
 --bg: #ffffff;
 --bg-soft: #f7f7f7;
 --card: #ffffff;
 --card-2: #111111;
 --text: #111111;
 --muted: #525252;
 --line: rgba(0,0,0,.08);
 --red: #b91c1c;
 --red-dark: #991b1b;
 --red-soft: rgba(185,28,28,.08);
 --black: #111111;
 --white: #ffffff;
 --container: 1180px;
 --shadow: 0 14px 34px rgba(0,0,0,.08);
 }

 * { box-sizing: border-box; }
 html { scroll-behavior: smooth; }
 body {
 margin: 0;
 font-family: Arial, Helvetica, sans-serif;
 background: var(--bg);
 color: var(--text);
 line-height: 1.6;
 overflow-x: hidden;
 }
 a { color: inherit; text-decoration: none; }
 img { max-width: 100%; display: block; }
 .container { width: min(var(--container), calc(100% - 28px)); margin: 0 auto; }
 .section { padding: 78px 0; }
 .service-badges {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 margin-bottom: 10px;
 margin-top: 4px;
 }
 .service-badge {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 8px;
 min-height: 44px;
 padding: 10px 17px;
 border-radius: 999px;
 background: #ffffff;
 color: #111111;
 border: 1px solid rgba(185,28,28,.18);
 box-shadow: 0 8px 18px rgba(185,28,28,.06);
 font-size: 16px;
 font-weight: 800;
 letter-spacing: .01em;
 position: relative;
 overflow: hidden;
 transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
 }
 .service-badge::before {
 content: none;
 }
 .service-badge::after {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(110deg, transparent 20%, rgba(185,28,28,.12) 48%, transparent 74%);
 transform: translateX(-130%);
 animation: softShine 3.8s ease-in-out infinite;
 }
 .service-badge:hover {
 transform: translateY(-2px);
 border-color: rgba(185,28,28,.35);
 box-shadow: 0 14px 28px rgba(185,28,28,.13);
 }
 .service-badge strong,
 .service-badge span {
 position: relative;
 z-index: 1;
 }
 .service-badge strong { color: var(--red); }
 .badge-prefix {
 color: #111111;
 font-family: "Space Grotesk", Arial, sans-serif;
 font-size: 15px;
 font-weight: 800;
 letter-spacing: .02em;
 position: relative;
 z-index: 1;
 }
 .badge-icon {
 position: relative;
 z-index: 1;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 line-height: 1;
 font-size: 20px;
 }
 .badge-icon svg {
 width: 22px;
 height: 22px;
 display: block;
 }

 .text-shine {
 background: linear-gradient(90deg, #111111 0%, #b91c1c 38%, #111111 76%);
 background-size: 220% auto;
 -webkit-background-clip: text;
 background-clip: text;
 color: transparent;
 animation: textShine 4.2s ease-in-out infinite;
 }
 .color-swap {
 animation: colorSwap 4.8s ease-in-out infinite;
 }
 .typing-line {
 min-height: 30px;
 font-family: "Space Grotesk", Arial, sans-serif;
 font-size: 16px;
 font-weight: 700;
 color: #1f1f1f;
 margin: 0 0 14px;
 letter-spacing: .02em;
 }
 .typing-line span {
 display: inline-flex;
 align-items: center;
 padding: 8px 13px;
 border-radius: 999px;
 background: rgba(17,17,17,.05);
 border: 1px solid rgba(0,0,0,.08);
 box-shadow: 0 8px 18px rgba(0,0,0,.04);
 border-right: 0;
 position: relative;
 }
 .typing-line span::after {
 content: "";
 width: 2px;
 height: 16px;
 margin-left: 5px;
 border-radius: 999px;
 background: #7f1d1d;
 animation: cursorBlink .85s step-end infinite;
 }
 .word-pop {
 display: inline-block;
 animation: wordPop 2.8s ease-in-out infinite;
 }
 .label {
 color: var(--red);
 font-size: 12px;
 font-weight: 800;
 text-transform: uppercase;
 letter-spacing: .18em;
 margin-bottom: 10px;
 }
 h1, h2, h3, h4, p { margin-top: 0; }
 h1 { font-size: clamp(34px, 6vw, 62px); line-height: 1.05; margin-bottom: 18px; }
 h2 { font-size: clamp(28px, 4vw, 40px); line-height: 1.12; margin-bottom: 14px; }
 h3 { font-size: 22px; margin-bottom: 10px; }
 .muted { color: var(--muted); }

 .reveal {
 opacity: 0;
 transform: translateY(20px);
 transition: opacity .55s ease, transform .55s ease;
 will-change: opacity, transform;
 }
 .reveal.show {
 opacity: 1;
 transform: translateY(0);
 }

 .top-bar {
 background:
 radial-gradient(circle at 8% 50%, rgba(185,28,28,.42), transparent 18%),
 linear-gradient(135deg, #111111 0%, #1f1f1f 48%, #7f1d1d 100%);
 color: var(--white);
 font-size: 13px;
 font-weight: 900;
 position: relative;
 overflow: hidden;
 border-bottom: 1px solid rgba(255,255,255,.08);
 }
 .top-bar::before {
 content: "";
 position: absolute;
 inset: 0;
 background: repeating-linear-gradient(135deg, rgba(250,204,21,.95) 0 14px, rgba(17,17,17,.95) 14px 28px);
 width: 210px;
 opacity: .92;
 transform: skewX(-18deg) translateX(-28px);
 }
 .top-bar::after {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(110deg, transparent 24%, rgba(255,255,255,.12) 46%, transparent 70%);
 transform: translateX(-120%);
 animation: topBarShine 4.6s ease-in-out infinite;
 }
 .top-bar .container {
 min-height: 38px;
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 12px;
 text-align: center;
 position: relative;
 z-index: 1;
 letter-spacing: .03em;
 }
 .top-bar .container::before {
 content: "⚠";
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 24px;
 height: 24px;
 border-radius: 999px;
 background: #facc15;
 color: #111111;
 box-shadow: 0 0 0 5px rgba(250,204,21,.1);
 flex: 0 0 auto;
 }
 .top-bar strong {
 color: #facc15;
 }


 .story-strip {
 background: #ffffff;
 border-bottom: 1px solid rgba(0,0,0,.04);
 padding: 12px 0 4px;
 margin-top: 6px;
 }
 .stories {
 display: flex;
 gap: 18px;
 overflow-x: auto;
 padding: 0 4px 0;
 -webkit-overflow-scrolling: touch;
 scroll-snap-type: x mandatory;
 align-items: flex-start;
 }
 .stories::-webkit-scrollbar { height: 0; }
 .story {
 flex: 0 0 auto;
 width: 82px;
 text-align: center;
 scroll-snap-align: start;
 color: #111111;
 font-size: 13px;
 font-weight: 900;
 line-height: 1.15;
 }
 .story-ring {
 width: 70px;
 height: 70px;
 min-width: 70px;
 min-height: 70px;
 aspect-ratio: 1 / 1;
 padding: 3px;
 border-radius: 9999px;
 background: conic-gradient(from 220deg, #ff4b1f, #ff7a00, #3730a3, #2563eb, #16a34a, #ff4b1f);
 margin: 0 auto 7px;
 box-shadow: 0 8px 18px rgba(0,0,0,.07);
 transition: transform .22s ease, box-shadow .22s ease;
 display: flex;
 align-items: center;
 justify-content: center;
 overflow: hidden;
 }
 .story:hover .story-ring {
 transform: translateY(-2px);
 box-shadow: 0 18px 34px rgba(0,0,0,.12);
 }
 .story-ring img {
 width: 64px;
 height: 64px;
 min-width: 64px;
 min-height: 64px;
 aspect-ratio: 1 / 1;
 border-radius: 9999px;
 border: 3px solid #ffffff;
 background: #ffffff;
 box-sizing: border-box;
 object-fit: cover;
 display: block;
 }

 .header {
 position: sticky;
 top: 0;
 z-index: 1000;
 background: rgba(255,255,255,.94);
 backdrop-filter: blur(10px);
 border-bottom: 1px solid rgba(0,0,0,.06);
 margin-top: 8px;
 }
 .header-inner {
 min-height: 68px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 20px;
 }
 .brand {
 display: flex;
 align-items: center;
 gap: 12px;
 }
 .brand-text {
 display: inline-flex;
 flex-direction: column;
 align-items: flex-start;
 gap: 0;
 position: relative;
 }
 .brand-mark {
 width: 62px;
 height: 62px;
 border-radius: 16px;
 background: #ffffff;
 border: 1px solid rgba(0,0,0,.08);
 display: flex;
 align-items: center;
 justify-content: center;
 overflow: hidden;
 box-shadow: 0 10px 20px rgba(185,28,28,.12);
 }
 .brand-mark img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 padding: 0;
 transform: scale(1.12);
 }
 .brand-title {
 font-family: "Black Ops One", "Bebas Neue", Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
 font-size: clamp(25px, 3vw, 42px);
 letter-spacing: .055em;
 line-height: .95;
 text-transform: uppercase;
 position: relative;
 display: inline-flex;
 align-items: center;
 gap: 10px;
 white-space: nowrap;
 transform: skewX(-4deg);
 filter: drop-shadow(0 8px 14px rgba(0,0,0,.12));
 }
 .brand-title .brand-akay {
 color: #ffffff;
 background:
 linear-gradient(135deg, #111111 0%, #7f1d1d 46%, #dc2626 100%);
 padding: 9px 14px 10px;
 border-radius: 14px;
 border: 1px solid rgba(255,255,255,.16);
 box-shadow:
 0 14px 28px rgba(127,29,29,.22),
 inset 0 0 0 1px rgba(255,255,255,.08);
 position: relative;
 overflow: hidden;
 text-shadow: 0 2px 0 rgba(0,0,0,.28);
 }
 .brand-title .brand-akay::before {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(110deg, transparent 18%, rgba(255,255,255,.35) 46%, transparent 72%);
 transform: translateX(-130%);
 animation: brandShine 3.2s ease-in-out infinite;
 }
 .brand-title .brand-akay::after {
 content: "";
 position: absolute;
 left: 0;
 right: 0;
 bottom: 0;
 height: 5px;
 background: repeating-linear-gradient(135deg, #111111 0 10px, #facc15 10px 20px);
 }
 .brand-title .brand-akay span {
 position: relative;
 z-index: 1;
 }
 .brand-title .brand-oto {
 color: #111111;
 text-shadow:
 2px 2px 0 rgba(185,28,28,.18),
 0 0 20px rgba(185,28,28,.1);
 }
 .brand-title .brand-kurtarma {
 color: var(--red);
 -webkit-text-stroke: .5px rgba(17,17,17,.2);
 text-shadow:
 2px 2px 0 rgba(17,17,17,.08),
 0 0 18px rgba(185,28,28,.22);
 animation: brandGlowText 2.8s ease-in-out infinite;
 }
 .brand-sub {
 font-size: 6.5px;
 color: #555555;
 margin-top: 2px;
 font-weight: 900;
 letter-spacing: .12em;
 text-transform: uppercase;
 font-family: "Bebas Neue", Arial, sans-serif;
 line-height: 1;
 align-self: flex-end;
 text-align: right;
 max-width: 72%;
 white-space: nowrap;
 }
 .nav {
 display: flex;
 align-items: center;
 gap: 28px;
 }
 .nav a { color: #1f2937; font-weight: 700; font-size: 15px; }
 .nav a:hover { color: var(--red); }
 .header-actions { display: flex; align-items: center; gap: 12px; }
 .header-actions .desktop-call {
 min-height: 38px;
 padding: 9px 18px;
 border-radius: 12px;
 font-size: 14px;
 letter-spacing: .03em;
 white-space: nowrap;
 box-shadow: 0 10px 20px rgba(127,29,29,.14);
 }
 .header-actions .desktop-call::after {
 height: 3px;
 }
 .menu-toggle {
 display: none;
 border: 1px solid rgba(0,0,0,.14);
 background: transparent;
 color: #111;
 padding: 10px 12px;
 border-radius: 12px;
 font-size: 18px;
 cursor: pointer;
 }
 .mobile-menu {
 display: none;
 border-top: 1px solid rgba(0,0,0,.06);
 padding: 12px 0 16px;
 animation: mobileMenuDrop .22s ease both;
 }
 .mobile-menu.open { display: block; }
 .mobile-menu a {
 display: grid;
 grid-template-columns: 28px 1fr auto;
 align-items: center;
 gap: 10px;
 padding: 13px 16px;
 margin: 7px 0;
 color: #111;
 background: #ffffff;
 border: 1px solid rgba(0,0,0,.07);
 border-radius: 16px;
 box-shadow: 0 8px 18px rgba(0,0,0,.04);
 font-weight: 800;
 transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
 }
 .menu-emoji {
 width: 28px;
 height: 28px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border-radius: 10px;
 background: rgba(185,28,28,.08);
 font-size: 16px;
 }
 .mobile-menu a::after {
 content: "›";
 color: var(--red);
 font-size: 22px;
 line-height: 1;
 font-weight: 900;
 grid-column: 3;
 }
 .mobile-menu a:hover {
 transform: translateX(3px);
 border-color: rgba(185,28,28,.25);
 box-shadow: 0 10px 22px rgba(185,28,28,.08);
 }
 .btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 10px;
 padding: 14px 22px;
 border-radius: 999px;
 font-weight: 800;
 border: 1px solid transparent;
 transition: .22s ease;
 cursor: pointer;
 }
 .btn:hover { transform: translateY(-1px); }
 .btn-red {
 background: linear-gradient(135deg, #111111 0%, #7f1d1d 52%, #b91c1c 100%);
 color: #ffffff;
 box-shadow: 0 14px 28px rgba(127,29,29,.22);
 border: 1px solid rgba(255,255,255,.12);
 position: relative;
 overflow: hidden;
 }
 .btn-red::after {
 content: "";
 position: absolute;
 inset: auto 0 0 0;
 height: 4px;
 background: repeating-linear-gradient(135deg, #111111 0 10px, #facc15 10px 20px);
 opacity: .9;
 }
 .btn-red:hover {
 background: linear-gradient(135deg, #111111 0%, #991b1b 52%, #dc2626 100%);
 box-shadow: 0 18px 34px rgba(127,29,29,.28);
 }
 .btn-outline {
 border-color: rgba(0,0,0,.16);
 color: #111;
 background: rgba(0,0,0,.02);
 }
 .btn-outline:hover { border-color: rgba(185,28,28,.38); color: var(--red); }
 .btn-black {
 background: var(--black);
 color: #fff;
 }
 .btn-lg {
 padding: 18px 28px;
 font-size: 17px;
 }

 .hero {
 position: relative;
 overflow: hidden;
 background:
 radial-gradient(circle at 10% 10%, rgba(185,28,28,.08), transparent 22%),
 linear-gradient(180deg, #ffffff 0%, #f6f6f6 100%);
 border-bottom: 1px solid rgba(0,0,0,.05);
 }
 .hero-grid {
 display: grid;
 grid-template-columns: 1.02fr .98fr;
 gap: 34px;
 align-items: center;
 padding: 18px 0 54px;
 }
 .hero-grid > * {
 min-width: 0;
 }

 .hero-desc {
 font-family: 'Space Grotesk', 'Inter', sans-serif;
 font-size: 17px;
 line-height: 1.55;
 color: #333;
 font-weight: 500;
 }
 .hero-desc strong {
 color: #b91c1c;
 font-weight: 700;
 }

 .hero p {
 font-size: 18px;
 max-width: 700px;
 color: #3f3f46;
 }
 .hero-actions {
 display: flex;
 gap: 14px;
 flex-wrap: wrap;
 margin-top: 28px;
 }
 .hero-points {
 margin-top: 24px;
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 max-width: 820px;
 width: 100%;
 min-width: 0;
 }
 .point {
 flex: 1 1 185px;
 min-height: 0;
 background:
 linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,255,255,.86)),
 radial-gradient(circle at 10% 40%, rgba(185,28,28,.12), transparent 32%);
 border: 1px solid rgba(0,0,0,.08);
 padding: 12px 14px;
 border-radius: 999px;
 box-shadow: 0 10px 24px rgba(0,0,0,.06);
 position: relative;
 overflow: hidden;
 display: flex;
 align-items: center;
 gap: 9px;
 color: #525252;
 font-size: 13px;
 font-weight: 700;
 transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
 }
 .point::before {
 content: "";
 width: 36px;
 height: 36px;
 border-radius: 50%;
 background: rgba(185,28,28,.09);
 border: 1px solid rgba(185,28,28,.15);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 flex: 0 0 36px;
 font-size: 18px;
 }
 .point:nth-child(1)::before { content: "🕒"; }
 .point:nth-child(2)::before { content: "⚡"; }
 .point:nth-child(3)::before { content: "🛡️"; }
 .point::after {
 content: "";
 position: absolute;
 inset: auto 12px 0 58px;
 height: 3px;
 border-radius: 999px;
 background: repeating-linear-gradient(135deg, #111111 0 9px, #facc15 9px 18px);
 opacity: .9;
 }
 .point:hover {
 transform: translateY(-2px);
 border-color: rgba(185,28,28,.24);
 box-shadow: 0 14px 30px rgba(185,28,28,.1);
 }
 .point strong {
 display: inline;
 color: #111111;
 font-family: "Space Grotesk", Arial, sans-serif;
 font-size: 15px;
 line-height: 1;
 margin: 0 4px 0 0;
 position: relative;
 z-index: 1;
 white-space: nowrap;
 }
 .point strong::before { content: none; }
 .point strong,
 .point {
 position: relative;
 z-index: 1;
 }
 .hero-visual {
 border-radius: 28px;
 overflow: hidden;
 background: #fff;
 border: 1px solid rgba(0,0,0,.08);
 box-shadow: 0 22px 52px rgba(0,0,0,.12);
 }
 .hero-image {
 position: relative;
 min-height: 560px;
 background:
 linear-gradient(rgba(17,17,17,.18), rgba(17,17,17,.4)),
 url('../../media/hero.jpg') center/cover no-repeat;
 display: flex;
 align-items: flex-end;
 padding: 28px;
 }
 .hero-overlay-box {
 width: 100%;
 background: rgba(17,17,17,.82);
 color: #ffffff;
 border-radius: 20px;
 padding: 20px;
 border: 1px solid rgba(255,255,255,.14);
 box-shadow: 0 18px 38px rgba(0,0,0,.24);
 backdrop-filter: blur(10px);
 }
 .hero-overlay-box .label {
 color: #fca5a5;
 }
 .hero-overlay-box .muted {
 color: rgba(255,255,255,.78);
 }
 .hero-overlay-grid {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 12px;
 margin-top: 16px;
 }
 .hero-overlay-item {
 background: rgba(255,255,255,.1);
 border-radius: 14px;
 padding: 14px;
 font-weight: 800;
 border: 1px solid rgba(255,255,255,.12);
 color: #ffffff;
 }
 .hero-overlay-item span {
 display: block;
 font-size: 12px;
 color: rgba(255,255,255,.62);
 margin-bottom: 6px;
 font-weight: 700;
 }

 .quick-call-wrap {
 margin-top: 24px;
 display: flex;
 gap: 12px;
 flex-wrap: wrap;
 align-items: center;
 }
 .quick-call-badge {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 padding: 12px 18px;
 border-radius: 999px;
 background: #111111;
 color: #ffffff;
 font-weight: 900;
 letter-spacing: .04em;
 border: 1px solid rgba(185,28,28,.32);
 box-shadow: 0 12px 28px rgba(0,0,0,.14);
 position: relative;
 overflow: hidden;
 }
 .quick-call-badge::before {
 content: "☎";
 color: #fca5a5;
 animation: wordPop 2s ease-in-out infinite;
 }
 .quick-call-badge::after {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.16) 48%, transparent 74%);
 transform: translateX(-130%);
 animation: softShine 3.6s ease-in-out infinite;
 }
 .quick-call-badge span {
 position: relative;
 z-index: 1;
 }
 .service-strip {
 display: inline;
 font-weight: 900;
 color: var(--red);
 background: linear-gradient(180deg, transparent 58%, rgba(185,28,28,.12) 0);
 padding: 0 2px;
 animation: softColor 4.8s ease-in-out infinite;
 }

 .section-alt { background: var(--bg-soft); }

 .about-feature-card {
 background:
 linear-gradient(135deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.78) 48%, rgba(255,241,241,.92) 100%),
 url('media/hero.jpg') center/cover no-repeat !important;
 border: 1px solid rgba(185,28,28,.18);
 box-shadow: 0 24px 56px rgba(127,29,29,.14);
 }
 .about-feature-card::before {
 background:
 radial-gradient(circle, rgba(185,28,28,.18), rgba(185,28,28,.06) 58%, transparent 62%);
 }
 .about-feature-card h2 {
 max-width: 760px;
 }
 .about-feature-card .info-item {
 background: rgba(255,255,255,.9);
 backdrop-filter: blur(8px);
 border-color: rgba(185,28,28,.12);
 }

 .dark-feature-card {
 background:
 radial-gradient(circle at 12% 12%, rgba(250,204,21,.18), transparent 24%),
 radial-gradient(circle at 92% 18%, rgba(185,28,28,.34), transparent 26%),
 repeating-linear-gradient(135deg, rgba(255,255,255,.045) 0 10px, transparent 10px 22px),
 linear-gradient(135deg, #111111 0%, #1f1f1f 52%, #7f1d1d 100%) !important;
 color: #ffffff;
 border-color: rgba(255,255,255,.12);
 box-shadow: 0 22px 50px rgba(17,17,17,.18);
 }
 .dark-feature-card::before {
 background: rgba(255,255,255,.07);
 }
 .dark-feature-card .label {
 color: #fca5a5 !important;
 background: rgba(255,255,255,.08);
 border-color: rgba(255,255,255,.12);
 }
 .dark-feature-card p {
 color: rgba(255,255,255,.78) !important;
 }
 .dark-feature-card h3 {
 font-size: clamp(24px, 3vw, 34px);
 line-height: 1.08;
 }

 .caution-stripe {
 height: 18px;
 border-radius: 999px;
 background: repeating-linear-gradient(135deg, #111111 0 16px, #facc15 16px 32px);
 box-shadow: 0 10px 20px rgba(0,0,0,.08);
 margin: 18px 0;
 border: 1px solid rgba(0,0,0,.08);
 }
 .caution-stripe.slim {
 height: 10px;
 margin: 14px 0;
 opacity: .95;
 }

 .grid-2 { display: grid; grid-template-columns: 1.05fr .95fr; gap: 24px; }
 .card {
 background:
 linear-gradient(135deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.92) 46%, rgba(255,247,247,.98) 100%),
 radial-gradient(circle at 10% 8%, rgba(185,28,28,.16), transparent 25%),
 radial-gradient(circle at 92% 18%, rgba(250,204,21,.22), transparent 20%),
 repeating-linear-gradient(135deg, rgba(17,17,17,.035) 0 10px, transparent 10px 22px);
 border: 1px solid rgba(0,0,0,.08);
 border-radius: 30px;
 padding: 30px;
 box-shadow: 0 18px 42px rgba(0,0,0,.08);
 position: relative;
 overflow: hidden;
 transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
 isolation: isolate;
 }
 .card::before {
 content: "";
 position: absolute;
 width: 210px;
 height: 210px;
 right: -82px;
 top: -88px;
 background:
 radial-gradient(circle, rgba(185,28,28,.16), rgba(185,28,28,.04) 58%, transparent 62%);
 border-radius: 50%;
 pointer-events: none;
 z-index: 0;
 }
 .card::after {
 content: "";
 position: absolute;
 left: 18px;
 right: 18px;
 top: 14px;
 height: 10px;
 border-radius: 999px;
 background: repeating-linear-gradient(135deg, #111111 0 14px, #facc15 14px 28px);
 opacity: .92;
 box-shadow: 0 8px 18px rgba(0,0,0,.08);
 z-index: 0;
 }
 .card:hover {
 transform: translateY(-4px);
 border-color: rgba(185,28,28,.22);
 box-shadow: 0 24px 54px rgba(185,28,28,.12);
 }
 .card > * {
 position: relative;
 z-index: 1;
 }
 .card > .label:first-child {
 margin-top: 14px;
 }
 .card .label {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 8px 12px;
 border-radius: 999px;
 background: rgba(185,28,28,.08);
 border: 1px solid rgba(185,28,28,.14);
 letter-spacing: .12em;
 }
 .card .label::before {
 content: "◆";
 font-size: 10px;
 color: var(--red);
 }

 .services {
 display: flex;
 gap: 14px;
 margin-top: 24px;
 overflow-x: auto;
 scroll-snap-type: x mandatory;
 padding: 4px 2px 16px;
 -webkit-overflow-scrolling: touch;
 }
 .services::-webkit-scrollbar { height: 8px; }
 .services::-webkit-scrollbar-track { background: #eeeeee; border-radius: 999px; }
 .services::-webkit-scrollbar-thumb { background: rgba(185,28,28,.45); border-radius: 999px; }
 .service {
 min-width: 230px;
 max-width: 250px;
 background: #fff;
 border: 1px solid rgba(0,0,0,.08);
 border-radius: 20px;
 padding: 20px 18px;
 transition: .22s ease;
 box-shadow: 0 10px 24px rgba(0,0,0,.06);
 scroll-snap-align: start;
 }
 .service:hover { transform: translateY(-3px); border-color: rgba(185,28,28,.25); }
 .service-icon {
 width: 48px;
 height: 48px;
 border-radius: 16px;
 background: var(--red-soft);
 border: 1px solid rgba(185,28,28,.18);
 color: var(--red);
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 22px;
 margin-bottom: 12px;
 }
 .service h3 { font-size: 19px; margin-bottom: 6px; }
 .service p { font-size: 14px; margin-bottom: 0; }

 .info-list {
 display: grid;
 gap: 12px;
 margin-top: 22px;
 }
 .info-item {
 display: flex;
 gap: 14px;
 align-items: center;
 padding: 16px;
 border-radius: 18px;
 background: #fff;
 border: 1px solid rgba(0,0,0,.07);
 box-shadow: 0 10px 22px rgba(0,0,0,.05);
 }
 .info-icon {
 width: 44px;
 height: 44px;
 border-radius: 14px;
 background: rgba(185,28,28,.08);
 color: var(--red);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 22px;
 flex: 0 0 44px;
 border: 1px solid rgba(185,28,28,.14);
 }
 .info-item strong {
 color: var(--red);
 display: block;
 line-height: 1.2;
 margin-bottom: 2px;
 }

 .price-intro-card {
 background:
 linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,247,247,.92)),
 radial-gradient(circle at 8% 20%, rgba(185,28,28,.12), transparent 28%);
 border: 1px solid rgba(185,28,28,.14);
 border-radius: 28px;
 padding: 24px 26px;
 box-shadow: 0 16px 36px rgba(0,0,0,.07);
 position: relative;
 overflow: hidden;
 margin-bottom: 18px;
 }
 .price-intro-card::before {
 content: "";
 position: absolute;
 left: 18px;
 right: 18px;
 top: 12px;
 height: 8px;
 border-radius: 999px;
 background: repeating-linear-gradient(135deg, #111111 0 14px, #facc15 14px 28px);
 opacity: .9;
 }
 .price-intro-card::after {
 content: "₺";
 position: absolute;
 right: 24px;
 bottom: -22px;
 font-size: 110px;
 font-weight: 900;
 color: rgba(185,28,28,.06);
 line-height: 1;
 }
 .price-intro-card > * {
 position: relative;
 z-index: 1;
 }
 .price-intro-card .label {
 margin-top: 12px;
 }
 .price-intro-card h2 {
 margin-bottom: 10px;
 }
 .price-intro-card p {
 max-width: 860px;
 margin-bottom: 0;
 font-family: "Space Grotesk", Arial, sans-serif;
 font-size: 16px;
 line-height: 1.55;
 color: #444;
 font-weight: 500;
 }

 .price-box {
 background:
 radial-gradient(circle at 10% 10%, rgba(185,28,28,.22), transparent 28%),
 linear-gradient(135deg, #111111 0%, #1f1f1f 56%, #7f1d1d 100%);
 color: #ffffff;
 border-radius: 30px;
 padding: 30px;
 box-shadow: 0 18px 40px rgba(0,0,0,.18);
 border: 1px solid rgba(255,255,255,.1);
 position: relative;
 overflow: hidden;
 }
 .price-box::before {
 content: "";
 position: absolute;
 left: 18px;
 right: 18px;
 top: 14px;
 height: 9px;
 border-radius: 999px;
 background: repeating-linear-gradient(135deg, #111111 0 14px, #facc15 14px 28px);
 opacity: .95;
 }
 .price-box > * {
 position: relative;
 z-index: 1;
 }
 .price-form-shell {
 background: rgba(255,255,255,.07);
 border: 1px solid rgba(255,255,255,.12);
 border-radius: 24px;
 padding: 20px;
 backdrop-filter: blur(10px);
 margin-top: 18px;
 }
 .price-note {
 color: rgba(255,255,255,.75);
 font-size: 14px;
 margin: 18px 0 18px;
 }
 .route-map {
 height: 360px;
 width: 100%;
 border-radius: 22px;
 overflow: hidden;
 border: 1px solid rgba(255,255,255,.14);
 box-shadow: 0 16px 34px rgba(0,0,0,.25);
 margin-top: 16px;
 background: #e5e5e5;
 }
 .route-status {
 margin-top: 12px;
 color: rgba(255,255,255,.78);
 font-size: 14px;
 }
 .route-actions {
 display: flex;
 gap: 12px;
 flex-wrap: wrap;
 margin-top: 14px;
 }
 .calc-grid {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 14px;
 }
 .field, .select {
 width: 100%;
 padding: 15px 16px;
 border-radius: 16px;
 border: 1px solid rgba(0,0,0,.1);
 background: #ffffff;
 color: #111111;
 outline: none;
 font-size: 15px;
 }
 .field::placeholder { color: #7a7a7a; }
 .field:focus, .select:focus {
 border-color: rgba(185,28,28,.45);
 box-shadow: 0 0 0 3px rgba(185,28,28,.08);
 }
 .calc-grid .full { grid-column: 1 / -1; }
 .calc-row {
 display: flex;
 align-items: center;
 gap: 10px;
 flex-wrap: wrap;
 margin-top: 12px;
 }
 .checkbox-row {
 display: flex;
 align-items: center;
 gap: 10px;
 font-size: 15px;
 }
 .result-box {
 margin-top: 18px;
 background: rgba(255,255,255,.08);
 border: 1px solid rgba(255,255,255,.12);
 border-radius: 22px;
 padding: 18px;
 }
 .result-box strong {
 display: block;
 font-size: 32px;
 color: #ffffff;
 line-height: 1;
 margin-bottom: 8px;
 }

 .faq-list { display: grid; gap: 14px; margin-top: 24px; }
 .faq-item {
 background: #fff;
 border: 1px solid rgba(0,0,0,.08);
 border-radius: 22px;
 overflow: hidden;
 box-shadow: var(--shadow);
 }
 .faq-question {
 width: 100%;
 border: 0;
 background: transparent;
 color: #111;
 padding: 20px 22px;
 text-align: left;
 font-size: 18px;
 font-weight: 800;
 display: flex;
 align-items: center;
 justify-content: space-between;
 cursor: pointer;
 }
 .faq-answer {
 max-height: 0;
 overflow: hidden;
 transition: max-height .28s ease;
 color: #525252;
 padding: 0 22px;
 }
 .faq-item.active .faq-answer {
 max-height: 220px;
 padding: 0 22px 20px;
 }

 .gallery {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 18px;
 margin-top: 26px;
 }
 .gallery-item {
 min-height: 280px;
 border-radius: 24px;
 overflow: hidden;
 border: 1px solid rgba(0,0,0,.08);
 position: relative;
 background-size: cover;
 background-position: center;
 transition: transform .3s ease;
 box-shadow: var(--shadow);
 }
 .gallery-item:hover { transform: scale(1.02); }
 .gallery-item::after {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.12));
 }

 .cta {
 background: linear-gradient(135deg, rgba(185,28,28,.08), rgba(0,0,0,.02));
 border: 1px solid rgba(185,28,28,.14);
 border-radius: 30px;
 padding: 34px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 22px;
 flex-wrap: wrap;
 box-shadow: var(--shadow);
 }

 .contact-grid {
 display: grid;
 grid-template-columns: 1fr 360px;
 gap: 22px;
 align-items: start;
 }
 .form-grid {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 14px;
 margin-top: 20px;
 }
 .full { grid-column: 1 / -1; }

 .side-box {
 background: #fff;
 border: 1px solid rgba(0,0,0,.08);
 border-radius: 24px;
 padding: 24px;
 box-shadow: var(--shadow);
 }
 .side-box + .side-box { margin-top: 16px; }
 .phone-big { font-size: 34px; font-weight: 900; color: var(--red); }
 .map {
 background: linear-gradient(135deg, #111111 0%, #7f1d1d 100%);
 color: #ffffff;
 border-color: rgba(185,28,28,.18);
 position: relative;
 overflow: hidden;
 }
 .map::before {
 content: "";
 position: absolute;
 width: 180px;
 height: 180px;
 right: -70px;
 top: -70px;
 background: rgba(255,255,255,.08);
 border-radius: 50%;
 }
 .map .label {
 color: #fca5a5;
 position: relative;
 }
 .map div:not(.label) {
 position: relative;
 font-weight: 800;
 font-size: 18px;
 }
 .map iframe {
 width: 100%;
 height: 260px;
 border: 0;
 border-radius: 18px;
 margin-top: 14px;
 position: relative;
 box-shadow: 0 16px 30px rgba(0,0,0,.2);
 }

 .footer {
 background: #111111;
 border-top: 1px solid rgba(255,255,255,.08);
 padding: 44px 0 34px;
 color: #d4d4d4;
 }
 .footer-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 24px;
 }
 .footer h4 {
 color: #fff;
 margin-bottom: 14px;
 font-size: 18px;
 }
 .footer ul { list-style: none; padding: 0; margin: 0; }
 .footer li + li { margin-top: 8px; }
 .footer-bottom {
 margin-top: 26px;
 padding-top: 18px;
 border-top: 1px solid rgba(255,255,255,.08);
 display: flex;
 justify-content: space-between;
 gap: 14px;
 flex-wrap: wrap;
 font-size: 14px;
 }

 .hilem-glow {
 position: relative;
 display: inline-block;
 color: #ffffff;
 font-weight: 900;
 letter-spacing: .45px;
 text-shadow:
 0 0 8px rgba(252, 165, 165, .55),
 0 0 18px rgba(239, 68, 68, .45),
 0 0 34px rgba(185, 28, 28, .38);
 background: linear-gradient(90deg, #ffffff 0%, #fecaca 35%, #ef4444 70%, #ffffff 100%);
 background-size: 240% 100%;
 -webkit-background-clip: text;
 background-clip: text;
 -webkit-text-fill-color: transparent;
 animation: hilemGlowSweep 3.2s ease-in-out infinite;
 }
 .hilem-glow::after {
 content: '';
 position: absolute;
 left: -6%;
 right: -6%;
 bottom: -4px;
 height: 2px;
 border-radius: 999px;
 background: linear-gradient(90deg, transparent, rgba(248,113,113,.95), transparent);
 box-shadow: 0 0 16px rgba(248,113,113,.65);
 opacity: .9;
 }
 @keyframes hilemGlowSweep {
 0%, 100% { background-position: 0% 50%; filter: drop-shadow(0 0 4px rgba(239,68,68,.35)); }
 50% { background-position: 100% 50%; filter: drop-shadow(0 0 12px rgba(248,113,113,.7)); }
 }

 .floating-actions {
 position: fixed;
 right: 16px;
 bottom: 18px;
 display: flex;
 flex-direction: column;
 gap: 12px;
 z-index: 1300;
 }
 .floating-btn {
 width: 62px;
 height: 62px;
 border-radius: 50%;
 display: flex;
 align-items: center;
 justify-content: center;
 color: #fff;
 text-decoration: none;
 box-shadow: 0 16px 28px rgba(0,0,0,.18);
 position: relative;
 transition: transform .2s ease, box-shadow .2s ease;
 border: 1px solid rgba(255,255,255,.14);
 }
 .floating-btn:hover {
 transform: translateY(-2px);
 box-shadow: 0 20px 34px rgba(0,0,0,.22);
 }
 .floating-phone {
 background: #b91c1c;
 animation: phoneShake 1.8s ease-in-out infinite;
 }
 .floating-phone::before {
 content: "";
 position: absolute;
 inset: -6px;
 border-radius: 50%;
 border: 2px solid rgba(185,28,28,.22);
 animation: callRing 1.8s ease-out infinite;
 }
 .floating-phone::after {
 content: "";
 position: absolute;
 inset: -13px;
 border-radius: 50%;
 border: 2px solid rgba(185,28,28,.12);
 animation: callRingOuter 1.8s ease-out infinite;
 }
 .whatsapp-logo-link {
 display: block;
 line-height: 0;
 text-decoration: none;
 }
 .whatsapp-logo-img {
 width: 62px;
 height: 62px;
 display: block;
 }
 .floating-icon {
 width: 28px;
 height: 28px;
 display: block;
 position: relative;
 z-index: 2;
 }
 .floating-label {
 position: absolute;
 right: 74px;
 top: 50%;
 transform: translateY(-50%);
 background: #111;
 color: #fff;
 padding: 9px 12px;
 border-radius: 12px;
 font-size: 13px;
 font-weight: 700;
 white-space: nowrap;
 opacity: 0;
 pointer-events: none;
 transition: opacity .2s ease, transform .2s ease;
 box-shadow: 0 10px 24px rgba(0,0,0,.15);
 }
 .floating-btn:hover .floating-label {
 opacity: 1;
 transform: translateY(-50%) translateX(-2px);
 }

 
 @keyframes topBarShine {
 0%, 55% { transform: translateX(-120%); }
 80%, 100% { transform: translateX(120%); }
 }

 @keyframes softPulse {
 0% { box-shadow: 0 0 0 0 rgba(185,28,28,.28); }
 70% { box-shadow: 0 0 0 10px rgba(185,28,28,0); }
 100% { box-shadow: 0 0 0 0 rgba(185,28,28,0); }
 }
 @keyframes softShine {
 0%, 45% { transform: translateX(-130%); }
 70%, 100% { transform: translateX(130%); }
 }
 @keyframes textShine {
 0% { background-position: 0% center; }
 50% { background-position: 100% center; }
 100% { background-position: 0% center; }
 }
 @keyframes colorSwap {
 0%, 100% { color: #111111; }
 45% { color: #b91c1c; }
 70% { color: #111111; }
 }
 @keyframes cursorBlink {
 0%, 49% { opacity: 1; }
 50%, 100% { opacity: 0; }
 }
 @keyframes wordPop {
 0%, 100% { transform: translateY(0); color: #111111; }
 50% { transform: translateY(-2px); color: #b91c1c; }
 }
 @keyframes softColor {
 0%, 100% { color: #b91c1c; }
 50% { color: #111111; }
 }

 @keyframes brandShine {
 0%, 45% { transform: translateX(-130%); }
 70%, 100% { transform: translateX(130%); }
 }
 @keyframes brandGlowText {
 0%, 100% { filter: drop-shadow(0 0 0 rgba(185,28,28,0)); }
 50% { filter: drop-shadow(0 0 8px rgba(185,28,28,.28)); }
 }

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

 @keyframes phoneShake {
 0%, 100% { transform: rotate(0deg); }
 8% { transform: rotate(-12deg); }
 16% { transform: rotate(10deg); }
 24% { transform: rotate(-8deg); }
 32% { transform: rotate(6deg); }
 40% { transform: rotate(0deg); }
 }
 @keyframes callRing {
 0% {
 transform: scale(.9);
 opacity: .7;
 }
 70% {
 transform: scale(1.35);
 opacity: 0;
 }
 100% {
 transform: scale(1.35);
 opacity: 0;
 }
 }
 @keyframes callRingOuter {
 0% {
 transform: scale(.95);
 opacity: .45;
 }
 75% {
 transform: scale(1.55);
 opacity: 0;
 }
 100% {
 transform: scale(1.55);
 opacity: 0;
 }
 }

@media (max-width: 1080px) {
 .hero-grid, .grid-2, .contact-grid { grid-template-columns: 1fr; }
 .gallery { grid-template-columns: 1fr 1fr; }
 .footer-grid { grid-template-columns: 1fr 1fr; }
 }
 @media (max-width: 820px) {
 .nav, .header-actions .desktop-call { display: none; }
 .menu-toggle { display: inline-flex; }
 .hero-grid, .gallery, .form-grid, .footer-grid, .calc-grid, .hero-overlay-grid {
 grid-template-columns: 1fr;
 }
 .hero-points {
 flex-wrap: nowrap;
 overflow-x: auto;
 overflow-y: hidden;
 max-width: 100%;
 width: 100%;
 padding: 0 0 8px;
 scroll-snap-type: x mandatory;
 -webkit-overflow-scrolling: touch;
 }
 .hero-points::-webkit-scrollbar {
 height: 0;
 }
 .point {
 flex: 0 0 min(245px, calc(100vw - 42px));
 max-width: calc(100vw - 42px);
 scroll-snap-align: start;
 }
 .quick-call-badge {
 max-width: 100%;
 overflow-wrap: anywhere;
 justify-content: center;
 }
 .service-badges {
 max-width: 100%;
 overflow: hidden;
 }
 .hero-image { min-height: 420px; }
 .full { grid-column: auto; }
 .floating-actions { right: 14px; bottom: 14px; }
 .floating-btn {
 width: 58px;
 height: 58px;
 }
 .floating-label { display: none; }
 }

 .story-modal {
 position: fixed;
 inset: 0;
 z-index: 3000;
 background: rgba(0,0,0,.92);
 display: none;
 align-items: center;
 justify-content: center;
 padding: 18px;
 }
 .story-modal.open {
 display: flex;
 }
 .story-view {
 width: min(420px, 100%);
 height: min(760px, calc(100vh - 36px));
 background: #111;
 border-radius: 26px;
 overflow: hidden;
 position: relative;
 box-shadow: 0 24px 70px rgba(0,0,0,.45);
 }
 .story-view img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
 }
 .story-progress {
 position: absolute;
 top: 12px;
 left: 12px;
 right: 12px;
 display: flex;
 gap: 5px;
 z-index: 4;
 }
 .story-progress span {
 flex: 1;
 height: 3px;
 border-radius: 999px;
 background: rgba(255,255,255,.35);
 overflow: hidden;
 }
 .story-progress span::before {
 content: "";
 display: block;
 width: 0;
 height: 100%;
 background: #ffffff;
 }
 .story-progress span.done::before {
 width: 100%;
 }
 .story-progress span.active::before {
 animation: storyFill 3s linear forwards;
 }
 .story-close {
 position: absolute;
 top: 24px;
 right: 18px;
 z-index: 5;
 width: 38px;
 height: 38px;
 border: 0;
 border-radius: 50%;
 background: rgba(0,0,0,.42);
 color: #ffffff;
 font-size: 25px;
 line-height: 1;
 cursor: pointer;
 }
 .story-caption {
 position: absolute;
 left: 0;
 right: 0;
 bottom: 0;
 padding: 70px 20px 22px;
 color: #ffffff;
 font-size: 24px;
 font-weight: 900;
 background: linear-gradient(180deg, transparent, rgba(0,0,0,.72));
 z-index: 3;
 pointer-events: none;
 }
 .story-tap {
 position: absolute;
 top: 0;
 bottom: 0;
 z-index: 2;
 border: 0;
 background: transparent;
 cursor: pointer;
 }
 .story-tap-left {
 left: 0;
 width: 42%;
 }
 .story-tap-right {
 right: 0;
 width: 58%;
 }
 @keyframes storyFill {
 from { width: 0; }
 to { width: 100%; }
 }

 @media (prefers-reduced-motion: reduce) {
 *, *::before, *::after {
 animation-duration: .01ms !important;
 animation-iteration-count: 1 !important;
 scroll-behavior: auto !important;
 }
 }

 @media (max-width: 560px) {
 .top-bar {
 font-size: 11px;
 }
 .top-bar::before {
 width: 88px;
 opacity: .42;
 }
 .top-bar .container {
 min-height: 34px;
 justify-content: flex-start;
 text-align: left;
 padding-left: 38px;
 }
 .header {
 margin-top: 5px;
 }
 .top-bar .container::before {
 position: absolute;
 left: 4px;
 }
 .section { padding: 60px 0; }
 .story-strip { padding-top: 8px; margin-top: 4px; }
 .stories { padding-bottom: 4px; }
 .hero-grid { padding-top: 12px; }
 .hero-actions, .quick-call-wrap { flex-direction: column; align-items: stretch; }
 .btn { width: 100%; }
 .brand-mark { width: 54px; height: 54px; }
 .brand-title {
 font-size: 17px;
 gap: 5px;
 letter-spacing: .025em;
 transform: skewX(-3deg);
 }
 .brand-title .brand-akay {
 padding: 7px 9px 8px;
 border-radius: 10px;
 }
 .brand-sub {
 font-size: 5.8px;
 max-width: 74%;
 letter-spacing: .1em;
 }
 .service-badge {
 min-height: 44px;
 padding: 10px 15px;
 font-size: 16px;
 }
 .badge-icon svg {
 width: 21px;
 height: 21px;
 }
 .route-map { height: 280px; }
 .phone-big { font-size: 28px; }
 img, iframe, video {
 max-width: 100%;
 }
 }


/* Hero left content visual background */
.hero-content-panel {
 position: relative;
 overflow: hidden;
 border-radius: 30px;
 padding: 30px;
 border: 1px solid rgba(185,28,28,.12);
 box-shadow: 0 18px 42px rgba(0,0,0,.07);
 background:
 linear-gradient(105deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.88) 48%, rgba(255,255,255,.7) 100%),
 url('../../media/hero.jpg') center/cover no-repeat;
}
.hero-content-panel::before {
 content: "";
 position: absolute;
 inset: 0;
 background:
 radial-gradient(circle at 12% 10%, rgba(185,28,28,.13), transparent 28%),
 linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.88) 56%, rgba(255,255,255,.55) 100%);
 z-index: 0;
}
.hero-content-panel::after {
 content: "";
 position: absolute;
 left: 20px;
 right: 20px;
 bottom: 16px;
 height: 7px;
 border-radius: 999px;
 background: repeating-linear-gradient(135deg, #111111 0 14px, #facc15 14px 28px);
 opacity: .85;
 z-index: 0;
}
.hero-content-panel > * {
 position: relative;
 z-index: 1;
}
@media (max-width: 560px) {
 .hero-content-panel {
 padding: 22px 18px 26px;
 border-radius: 24px;
 }
}


/* Tighter hero -> price section spacing */
.hero-grid {
 padding-bottom: 28px;
}
#fiyat.section {
 padding-top: 42px;
}
@media (max-width: 560px) {
 .hero-grid {
 padding-bottom: 22px;
 }
 #fiyat.section {
 padding-top: 34px;
 }
}


/* Stronger hero background visibility */
.hero-content-panel {
 background:
 linear-gradient(105deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 48%, rgba(255,255,255,.28) 100%),
 url('media/giris.jpg') right center/cover no-repeat !important;
}
.hero-content-panel::before {
 background:
 linear-gradient(90deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.78) 50%, rgba(255,255,255,.22) 100%),
 radial-gradient(circle at 12% 10%, rgba(185,28,28,.14), transparent 26%) !important;
}
.hero-content-panel::after {
 opacity: .95;
}
.hero-content-panel h1,
.hero-content-panel .hero-desc,
.hero-content-panel .typing-line,
.hero-content-panel .quick-call-wrap,
.hero-content-panel .hero-points,
.hero-content-panel .service-badges {
 max-width: 78%;
}
@media (max-width: 820px) {
 .hero-content-panel {
 background:
 linear-gradient(105deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.74) 58%, rgba(255,255,255,.34) 100%),
 url('media/hero.jpg') center/cover no-repeat !important;
 }
 .hero-content-panel h1,
 .hero-content-panel .hero-desc,
 .hero-content-panel .typing-line,
 .hero-content-panel .quick-call-wrap,
 .hero-content-panel .hero-points,
 .hero-content-panel .service-badges {
 max-width: 100%;
 }
}


/* Hero desktop alignment fix */
@media (min-width: 821px) {
 .hero-grid {
 align-items: stretch;
 grid-template-columns: .96fr 1.04fr;
 }

 .hero-content-panel,
 .hero-visual {
 height: 100%;
 min-height: 560px;
 }

 .hero-content-panel {
 display: flex;
 flex-direction: column;
 justify-content: center;
 }

 .hero-visual {
 border-radius: 30px;
 overflow: hidden;
 display: flex;
 }

 .hero-image {
 min-height: 560px;
 height: 100%;
 width: 100%;
 border-radius: 30px;
 }
}

/* Mobile/tablet keeps stacked layout clean */
@media (max-width: 820px) {
 .hero-content-panel {
 min-height: auto;
 }

 .hero-visual,
 .hero-image {
 min-height: 420px;
 }
}


/* Compact desktop hero sizing */
@media (min-width: 821px) {
 .hero-grid {
 grid-template-columns: 1fr .95fr;
 gap: 24px;
 padding-top: 12px;
 padding-bottom: 30px;
 }

 .hero-content-panel,
 .hero-visual {
 min-height: 440px !important;
 }

 .hero-content-panel {
 padding: 24px 26px;
 border-radius: 26px;
 }

 .hero-image {
 min-height: 440px !important;
 border-radius: 26px;
 }

 .hero-overlay-box {
 padding: 16px;
 border-radius: 18px;
 }

 .hero-overlay-grid {
 gap: 10px;
 margin-top: 12px;
 }

 .hero-overlay-item {
 padding: 12px;
 }

 h1 {
 font-size: clamp(32px, 4.7vw, 52px);
 margin-bottom: 14px;
 }

 .hero-desc {
 font-size: 16px;
 line-height: 1.45;
 }

 .quick-call-wrap {
 margin-top: 18px;
 }

 .btn-lg {
 padding: 15px 22px;
 font-size: 16px;
 }

 .hero-points {
 margin-top: 18px;
 }
}

/* Slightly smaller on wide laptop screens */
@media (min-width: 821px) and (max-width: 1280px) {
 .hero-content-panel,
 .hero-visual,
 .hero-image {
 min-height: 405px !important;
 }

 .hero-content-panel {
 padding: 22px;
 }

 h1 {
 font-size: clamp(30px, 4.2vw, 46px);
 }
}


/* Ultra compact desktop hero */
@media (min-width: 821px) {
 .hero-grid {
 gap: 18px;
 padding-top: 6px;
 padding-bottom: 18px;
 }

 .hero-content-panel,
 .hero-visual,
 .hero-image {
 min-height: 300px !important;
 }

 .hero-content-panel {
 padding: 18px 18px;
 border-radius: 20px;
 }

 .hero-image {
 border-radius: 20px;
 }

 h1 {
 font-size: clamp(26px, 3.2vw, 38px);
 margin-bottom: 10px;
 }

 .hero-desc {
 font-size: 14px;
 line-height: 1.35;
 }

 .quick-call-wrap {
 margin-top: 12px;
 }

 .btn-lg {
 padding: 12px 16px;
 font-size: 14px;
 }

 .hero-points {
 margin-top: 12px;
 }

 .hero-overlay-box {
 padding: 12px;
 }

 .hero-overlay-item {
 padding: 8px;
 }
}


/* Dynamic stories folder support */
.stories {
 overflow-x: auto;
 overflow-y: hidden;
 max-width: 100%;
 flex-wrap: nowrap;
}
.story {
 flex: 0 0 82px;
}


/* Story visibility safety */
.story-strip {
 min-height: 104px;
}
#storiesContainer {
 display: flex;
 gap: 18px;
 overflow-x: auto;
 overflow-y: hidden;
 max-width: 100%;
 flex-wrap: nowrap;
}
#storiesContainer .story {
 display: block;
 flex: 0 0 82px;
}


/* HARD FIX: Stories must always be visible */
.story-strip {
 display: block !important;
 min-height: 104px !important;
 visibility: visible !important;
 opacity: 1 !important;
}
#storiesContainer,
.story-strip .stories {
 display: flex !important;
 flex-direction: row !important;
 gap: 18px !important;
 overflow-x: auto !important;
 overflow-y: hidden !important;
 max-width: 100% !important;
 flex-wrap: nowrap !important;
 padding: 0 4px 8px !important;
}
#storiesContainer .story,
.story-strip .story {
 display: block !important;
 flex: 0 0 82px !important;
 width: 82px !important;
 min-width: 82px !important;
 opacity: 1 !important;
 visibility: visible !important;
}
.story-ring {
 display: flex !important;
}
.story-ring img {
 display: block !important;
}


/* 2026 Akay updates */
.typing-line { min-height: 36px; }
.typing-line span { min-width: min(420px, 86vw); display: inline-flex; align-items: center; }
.gallery.gallery-slider { position: relative; display: block; padding: 8px 56px 48px; margin-top: 30px; overflow: hidden; }
.gallery-track { display: flex; gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 16px 4px 24px; -webkit-overflow-scrolling: touch; }
.gallery-track::-webkit-scrollbar { height: 0; }
.gallery.gallery-slider .gallery-item { flex: 0 0 clamp(220px, 27vw, 330px); min-height: clamp(360px, 52vw, 500px); border-radius: 38px; overflow: hidden; border: 8px solid #fff; position: relative; background-size: cover; background-position: center; scroll-snap-align: center; box-shadow: 0 24px 60px rgba(17,17,17,.18); transition: transform .35s ease, box-shadow .35s ease, filter .35s ease; isolation: isolate; }
.gallery.gallery-slider .gallery-item:nth-child(even) { transform: translateY(18px); }
.gallery.gallery-slider .gallery-item:hover { transform: translateY(-8px) scale(1.025); box-shadow: 0 34px 80px rgba(17,17,17,.26); filter: saturate(1.08); }
.gallery.gallery-slider .gallery-item:nth-child(even):hover { transform: translateY(8px) scale(1.025); }
.gallery.gallery-slider .gallery-item::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05) 35%, rgba(0,0,0,.72)); z-index: 1; }
.gallery.gallery-slider .gallery-item::after { content: ""; position: absolute; inset: 14px; border-radius: 30px; border: 1px solid rgba(255,255,255,.32); z-index: 2; pointer-events: none; }
.gallery.gallery-slider .gallery-item span { position: absolute; left: 26px; right: 26px; bottom: 26px; z-index: 3; color: #fff; font-weight: 950; font-size: 20px; text-shadow: 0 4px 16px rgba(0,0,0,.45); }
.gallery-nav { position: absolute; top: 46%; transform: translateY(-50%); width: 46px; height: 46px; border: 0; border-radius: 999px; background: linear-gradient(135deg, #111, #b91c1c); color: #fff; font-size: 34px; line-height: 1; cursor: pointer; z-index: 4; box-shadow: 0 16px 34px rgba(0,0,0,.22); }
.gallery-prev { left: 6px; } .gallery-next { right: 6px; }
.gallery-dots { position: absolute; left: 0; right: 0; bottom: 4px; display: flex; justify-content: center; gap: 8px; }
.gallery-dots button { width: 10px; height: 10px; border: 0; border-radius: 999px; background: rgba(17,17,17,.24); cursor: pointer; transition: .2s ease; }
.gallery-dots button.active { width: 30px; background: #b91c1c; }
.floating-actions { right: 22px; bottom: 22px; gap: 12px; }
.floating-btn { width: auto; min-width: 172px; height: 58px; border-radius: 999px; gap: 12px; box-shadow: 0 18px 46px rgba(185,28,28,.34); transition: transform .24s ease, box-shadow .24s ease; border: 1px solid rgba(255,255,255,.18); }
.floating-btn:hover { transform: translateY(-4px); box-shadow: 0 24px 60px rgba(185,28,28,.44); }
.floating-phone { background: linear-gradient(135deg, #111 0%, #7f1d1d 46%, #dc2626 100%); padding: 0 18px 0 22px; }
.floating-phone::before { inset: 5px; border-radius: inherit; border: 1px solid rgba(255,255,255,.18); }
.floating-phone::after { animation: none; }
.floating-icon { width: 20px; height: 20px; }
.floating-label { position: static; opacity: 1; transform: none; background: transparent; padding: 0; box-shadow: none; color: #fff; font-weight: 950; font-size: 15px; }
@media (max-width: 640px) {
 .gallery.gallery-slider { padding: 0 0 42px; }
 .gallery.gallery-slider .gallery-item { flex-basis: min(78vw, 300px); min-height: 430px; border-radius: 32px; }
 .gallery-nav { display: none; }
 .floating-btn { min-width: 58px; width: 58px; padding: 0; }
 .floating-label { display: none; }
}
.floating-phone { animation: none !important; }

/* Floating call button desktop fix: keep it perfectly circular on all screens */
.floating-actions {
 right: 22px;
 bottom: 22px;
}
.floating-btn,
.floating-phone {
 width: 62px !important;
 min-width: 62px !important;
 height: 62px !important;
 padding: 0 !important;
 border-radius: 50% !important;
 gap: 0 !important;
 aspect-ratio: 1 / 1;
}
.floating-phone {
 background: linear-gradient(135deg, #111 0%, #7f1d1d 46%, #dc2626 100%);
 animation: none !important;
 transform-origin: center center !important;
}
.floating-phone::before,
.floating-phone::after {
 border-radius: 50% !important;
 animation: none !important;
}
.floating-phone::before {
 inset: 5px;
 border: 1px solid rgba(255,255,255,.18);
}
.floating-phone::after {
 display: none;
}
.floating-label {
 position: absolute !important;
 right: 74px !important;
 top: 50% !important;
 transform: translateY(-50%) !important;
 opacity: 0 !important;
 background: #111 !important;
 color: #fff !important;
 padding: 9px 12px !important;
 border-radius: 12px !important;
 box-shadow: 0 10px 24px rgba(0,0,0,.15) !important;
 font-size: 13px !important;
 white-space: nowrap !important;
 pointer-events: none !important;
}
.floating-btn:hover .floating-label {
 opacity: 1 !important;
 transform: translateY(-50%) translateX(-2px) !important;
}

/* Floating phone ringing update */
.floating-btn.floating-phone {
 animation: phoneShake 1.65s ease-in-out infinite !important;
 transform-origin: initial !important;
}
.floating-btn.floating-phone::before {
 inset: -7px !important;
 border-radius: 50% !important;
 border: 2px solid rgba(220,38,38,.34) !important;
 animation: callRing 1.65s ease-out infinite !important;
}
.floating-btn.floating-phone::after {
 content: "" !important;
 display: block !important;
 position: absolute !important;
 inset: -15px !important;
 border-radius: 50% !important;
 border: 2px solid rgba(220,38,38,.18) !important;
 animation: callRingOuter 1.65s ease-out infinite !important;
 pointer-events: none !important;
}
.floating-btn.floating-phone .floating-icon {
 width: 26px !important;
 height: 26px !important;
}
.floating-btn.floating-phone:hover {
 animation-play-state: paused !important;
}

/* v5 floating phone size refinement */
.floating-btn.floating-phone,
.floating-btn,
.floating-phone{
 width:58px !important;
 min-width:58px !important;
 height:58px !important;
}
.floating-btn.floating-phone .floating-icon{
 width:23px !important;
 height:23px !important;
}
.floating-btn.floating-phone::before{inset:-6px !important;}
.floating-btn.floating-phone::after{inset:-13px !important;}
.floating-label{right:70px !important;}

/* v6 floating phone smaller refinement */
.floating-btn.floating-phone,
.floating-btn,
.floating-phone{
 width:52px !important;
 min-width:52px !important;
 height:52px !important;
}
.floating-btn.floating-phone .floating-icon{
 width:21px !important;
 height:21px !important;
}
.floating-btn.floating-phone::before{inset:-5px !important;}
.floating-btn.floating-phone::after{inset:-11px !important;}
.floating-label{right:64px !important;}

.map-link {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 margin-top: 10px;
 font-weight: 700;
 text-decoration: none;
}
