:root{
  --promo-h:52px;
  --bg:#ffffff;
  --text:#0f172a;
  --muted:#5b6474;
  --line:rgba(15,23,42,.10);
  --card:#ffffff;
  --alt:#f5f7fa;
  --shadow: 0 14px 30px rgba(15,23,42,.10);
  --radius:18px;
  --accent:#0b3b36; /* logo'ya yakın yeşil */
  --accent2:#0f766e;
}

*{box-sizing:border-box}
body{margin:0; font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial; background:var(--bg); color:var(--text); line-height:1.55}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
.wrap{width:min(1160px, 92vw); margin-inline:auto}
.small{font-size:.92rem}
.muted{color:var(--muted)}
.kicker{letter-spacing:.14em; text-transform:uppercase; font-size:.82rem; color:var(--muted)}
.h1{font-size:clamp(2rem, 3.2vw, 3rem); margin:8px 0 10px; line-height:1.12}
.h2{font-size:1.6rem; margin:0 0 10px}
.h3{font-size:1.25rem; margin:0 0 10px}
.h4{font-weight:800}
.lead{font-size:1.05rem; margin:0 0 6px}
.skip{position:absolute; left:-999px; top:10px; background:#000; color:#fff; padding:.5rem .7rem; border-radius:10px}
.skip:focus{left:10px; z-index:9999}
.sr{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}

.header{position:fixed; top:var(--promo-h,52px); left:0; right:0; z-index:1000; background:rgba(255,255,255,.92); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom:1px solid rgba(15,23,42,.08); box-shadow:0 10px 30px rgba(15,23,42,.08)}
body{padding-top:calc(var(--header-offset,88px) + var(--promo-h,52px))}
.navwrap{display:flex; align-items:center; gap:16px; padding:12px 0}
.brand{display:flex; align-items:center; gap:12px}
.logo{width:44px; height:44px; object-fit:contain}
.logo.sm{width:36px; height:36px}
.brandname{font-weight:900; letter-spacing:.08em; font-size:1.42rem; line-height:1.08}
.brandsub{font-size:.9rem; color:var(--muted); margin-top:-2px}
.nav{margin-left:auto; display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.nav a{padding:10px 10px; border-radius:12px; color:var(--muted)}
.nav a:hover{background:rgba(15,23,42,.04); color:var(--text)}
.nav .cta{background:linear-gradient(135deg, rgba(15,118,110,.14), rgba(14,165,164,.14)); border:1px solid rgba(15,118,110,.20); color:var(--text)}
.nav-toggle{display:none; margin-left:auto; border:1px solid var(--line); background:#fff; border-radius:14px; padding:10px 12px}
.bars{display:block; width:20px; height:2px; background:var(--text); position:relative}
.bars:before,.bars:after{content:""; position:absolute; left:0; width:20px; height:2px; background:var(--text)}
.bars:before{top:-6px} .bars:after{top:6px}
@media(max-width:920px){
  .nav-toggle{display:inline-flex}
  .nav{display:none; width:100%; flex-direction:column; align-items:stretch; gap:6px; padding:10px 0 6px; margin-left:0}
  .nav.open{display:flex}
  .nav a{padding:12px}
  .navwrap{flex-wrap:wrap}
}

.section{padding:48px 0}
.section.alt{background:var(--alt)}
.pagehead{padding:32px 0 10px; background:linear-gradient(180deg, rgba(15,118,110,.08), transparent)}
.hero{padding:28px 0 18px}
.heroGrid{display:grid; grid-template-columns: 1.1fr .9fr; gap:18px; align-items:stretch}
.heroText{padding:10px 0}
.heroMedia{position:relative}
.heroMedia img{border-radius:26px; border:1px solid var(--line); box-shadow: var(--shadow)}
.floating{position:absolute; right:14px; bottom:14px; background:rgba(255,255,255,.90); border:1px solid var(--line); border-radius:18px; padding:12px; box-shadow: var(--shadow); width:min(360px, 86%)}
.statrow{display:grid; grid-template-columns: repeat(3,1fr); gap:10px; margin-top:8px}
.stat{border:1px solid var(--line); border-radius:14px; padding:10px; background:#fff}
.num{font-weight:900; font-size:1.2rem}
.lbl{color:var(--muted); font-size:.9rem}

.btnrow{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.btn{display:inline-flex; align-items:center; justify-content:center; padding:12px 14px; border-radius:14px; border:1px solid var(--line); background:#fff; cursor:pointer}
.btn:hover{transform: translateY(-1px)}
.btn.primary{background:linear-gradient(135deg, rgba(15,118,110,.16), rgba(14,165,164,.14)); border-color: rgba(15,118,110,.22)}
.chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px}
.chip{border:1px solid rgba(15,118,110,.20); background:rgba(15,118,110,.08); padding:7px 10px; border-radius:999px; font-size:.9rem}

.split{display:grid; grid-template-columns: 1fr 1fr; gap:16px}
@media(max-width:980px){ .heroGrid,.split{grid-template-columns:1fr} .floating{position:static; margin-top:12px} }

.panel{background:#fff; border:1px solid var(--line); border-radius:22px; padding:16px; box-shadow: var(--shadow)}
.imgcard{border-radius:18px; border:1px solid var(--line)}
.note{border:1px dashed rgba(15,118,110,.25); background:rgba(15,118,110,.06); border-radius:16px; padding:12px}
.mapbox{margin-top:12px; border-radius:18px; border:1px solid var(--line); background:#fff; padding:14px; overflow:auto}

.featureGrid{display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; margin-top:14px}
@media(max-width:900px){ .featureGrid{grid-template-columns: repeat(2,1fr)} }
@media(max-width:560px){ .featureGrid{grid-template-columns: 1fr} }
.feature{display:flex; gap:12px; align-items:flex-start; border:1px solid var(--line); border-radius:18px; padding:14px; background:#fff}
.dot{width:12px; height:12px; border-radius:999px; background:linear-gradient(135deg, var(--accent), var(--accent2)); margin-top:4px}
.title{font-weight:900}
.meta{color:var(--muted); font-size:.92rem; margin-top:4px}

.gallery{display:grid; grid-template-columns: repeat(4, 1fr); gap:12px}
.gallery.mini{grid-template-columns: repeat(2,1fr)}
@media(max-width:980px){ .gallery{grid-template-columns: repeat(3,1fr)} }
@media(max-width:640px){ .gallery{grid-template-columns: repeat(2,1fr)} }
.gallery a{border-radius:18px; overflow:hidden; border:1px solid var(--line); background:#fff; box-shadow: var(--shadow)}
.gallery img{aspect-ratio:4/3; width:100%; height:100%; object-fit:cover}
.gallery a:hover{transform: translateY(-2px)}

.tabs{display:flex; gap:10px; flex-wrap:wrap; margin: 10px 0 12px}
.tab{border:1px solid var(--line); background:#fff; padding:10px 12px; border-radius:999px; cursor:pointer; color:var(--muted); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease, color .22s ease}
.tab:hover,
.tab:focus-visible{background:linear-gradient(135deg, #0f766e 0%, #2a9d8f 50%, #d6e5e4 100%); border-color:rgba(11,59,54,.30); box-shadow:0 20px 40px rgba(11,59,54,.18); color:#fff; transform:translateY(-3px); outline:none}
.tab.active{color:var(--text); border-color: rgba(15,118,110,.35); background: rgba(15,118,110,.08); box-shadow:none; transform:none}
.tab.active:hover,
.tab.active:focus-visible{color:#fff; border-color:rgba(11,59,54,.30); background:linear-gradient(135deg, #0f766e 0%, #2a9d8f 50%, #d6e5e4 100%)}

.cards{display:grid; grid-template-columns: repeat(3,1fr); gap:12px}
@media(max-width:980px){ .cards{grid-template-columns: repeat(2,1fr)} }
@media(max-width:640px){ .cards{grid-template-columns: 1fr} }
.card{border:1px solid var(--line); border-radius:18px; padding:14px; background:#fff; box-shadow: var(--shadow)}
.card.link:hover{transform: translateY(-1px)}
.table{width:100%; border-collapse:collapse; margin-top:12px; border-radius:18px; overflow:hidden; border:1px solid var(--line)}
.table th,.table td{padding:12px; border-bottom:1px solid var(--line); text-align:left}
.table th{background:rgba(15,23,42,.03); color:var(--muted)}
.pre{white-space:pre-wrap; border:1px solid var(--line); border-radius:16px; padding:12px; background:rgba(15,23,42,.03)}

.form{display:grid; grid-template-columns: 1fr 1fr; gap:12px}
.field{display:flex; flex-direction:column; gap:6px}
.field.full{grid-column:1/-1}
.field label{color:var(--muted); font-size:.92rem}
input,select,textarea{border:1px solid var(--line); border-radius:14px; padding:12px; font:inherit}
textarea{min-height:130px; resize:vertical}
.actions{display:flex; gap:10px; flex-wrap:wrap}

.footer{border-top:1px solid var(--line); background:#fff; margin-top:40px}
.footgrid{display:grid; grid-template-columns: 1.2fr .8fr 1fr; gap:18px; padding:24px 0}
@media(max-width:980px){ .footgrid{grid-template-columns:1fr} }
.links{display:grid; gap:8px; margin-top:10px}
.copy{padding:12px 0 22px}
.footbrand{display:flex; gap:12px; align-items:center}

.modal{position:fixed; inset:0; display:none; z-index:2000}
.modal.open{display:block}
.backdrop{position:absolute; inset:0; background:radial-gradient(circle at top, rgba(21,65,58,.58), rgba(6,12,20,.82))}
.modal .panel{position:relative; width:min(680px, 92vw); max-height:86vh; margin:6vh auto; overflow:auto}
.x{position:sticky; top:0; margin-left:auto; width:44px; height:44px; border-radius:14px; border:1px solid var(--line); background:#fff; cursor:pointer}
.content{padding: 14px 16px 18px}

.modal .panel{background:#fff; border-radius:22px; box-shadow:0 24px 60px rgba(0,0,0,.22)}
.modal.is-visual .panel{
  width:fit-content;
  max-width:min(96vw, 1480px);
  max-height:94vh;
  margin:3vh auto;
  background:transparent;
  box-shadow:none;
  overflow:visible;
  padding-top:14px;
}
.modal.is-visual .content{padding:0}
.modal.is-visual .x{
  position:absolute;
  top:10px;
  right:10px;
  margin-left:0;
  z-index:3;
  background:rgba(255,255,255,.96);
  box-shadow:0 8px 24px rgba(0,0,0,.14);
}
.visual-modal{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
}
.visual-modal .h3{
  margin:0;
  padding:12px 18px;
  text-align:center;
  color:#fff;
  text-shadow:none;
  font-size:clamp(1rem,1.4vw,1.35rem);
  line-height:1.35;
  letter-spacing:.01em;
  background:linear-gradient(135deg, rgba(11,59,54,.96), rgba(15,118,110,.92));
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 16px 34px rgba(0,0,0,.24);
  border-radius:16px;
  max-width:min(92vw, 760px);
  width:fit-content;
  position:absolute;
  top:18px;
  left:50%;
  transform:translateX(-50%);
  z-index:2;
}
.modal:not(.is-visual) .visual-modal .h3{color:var(--text); text-shadow:none;}
.plan-detail-image,
.visual-modal img{
  display:block;
  width:auto;
  max-width:min(96vw, 1400px);
  max-height:88vh;
  height:auto;
  object-fit:contain;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.15);
  background:#fff;
  box-shadow:0 30px 60px rgba(0,0,0,.32);
}
.note.success{border-color:rgba(22,163,74,.22); background:rgba(22,163,74,.08); color:#166534}
.note.error{border-color:rgba(220,38,38,.22); background:rgba(220,38,38,.08); color:#991b1b}
@media(max-width:640px){
  .modal.is-visual .panel{max-width:98vw; margin:1vh auto; padding-top:8px}
  .visual-modal .h3{font-size:.98rem; padding:10px 14px; top:12px; max-width:calc(100vw - 88px)}
  .plan-detail-image,
  .visual-modal img{max-width:98vw; max-height:90vh; border-radius:14px}
}


/* Luxury tweaks */
body.b-luxury{font-family: ui-serif, Georgia, "Times New Roman", Times, serif}
.hero.luxe{background: linear-gradient(180deg, rgba(11,59,54,.08), transparent)}
.luxeTop{padding: 6px 0 16px}
.luxeMedia{display:grid; grid-template-columns: 1.2fr .8fr; gap:16px}
@media(max-width:980px){ .luxeMedia{grid-template-columns:1fr} }
.luxeCard{border-radius:26px; border:1px solid var(--line); overflow:hidden; box-shadow: var(--shadow); background:#fff}
.luxeCard img{width:100%; height:100%; object-fit:cover}
.smallCard{padding:16px}
.divider{height:1px; background:var(--line); margin:12px 0}
.luxeFacts{display:grid; gap:8px}
.featureGrid.luxeGrid .feature{display:block}
.feature.luxeF .title{font-size:1.05rem}


.heroSlider{position:relative; min-height:440px; background:#fff}
.heroSlider .slide{position:absolute; inset:0; opacity:0; transition:opacity .55s ease}
.heroSlider .slide.active{opacity:1; z-index:1}
.heroSlider img{width:100%; height:100%; min-height:440px; object-fit:cover}
.sliderNav{position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:46px; height:46px; border:none; border-radius:999px; background:rgba(255,255,255,.85); box-shadow: var(--shadow); font-size:2rem; line-height:1; cursor:pointer}
.sliderNav.prev{left:18px}
.sliderNav.next{right:18px}
.sliderDots{position:absolute; left:0; right:0; bottom:16px; z-index:2; display:flex; justify-content:center; gap:8px}
.dotBtn{width:11px; height:11px; border-radius:999px; border:none; background:rgba(255,255,255,.55); cursor:pointer}
.dotBtn.active{background:#fff; transform:scale(1.15)}
.heroInfoCard{display:flex; flex-direction:column; justify-content:center}
@media(max-width:980px){.heroSlider,.heroSlider img{min-height:300px}}


/* Premium slider + stronger mobile polish */
.nav a{font-weight:600}
.nav .cta{
  background:linear-gradient(135deg, rgba(11,59,54,.92), rgba(15,118,110,.92));
  color:#fff;
  border-color:transparent;
  box-shadow:0 10px 24px rgba(11,59,54,.22)
}
.nav .cta:hover{background:linear-gradient(135deg, rgba(11,59,54,1), rgba(15,118,110,1)); color:#fff}
.hero.luxe{
  background:
    radial-gradient(circle at top left, rgba(15,118,110,.14), transparent 26%),
    linear-gradient(180deg, rgba(11,59,54,.10), transparent);
}
.heroSlider{
  position:relative;
  min-height:520px;
  isolation:isolate;
  background:#0b1720;
}
.heroSlider::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(5,10,18,.10) 0%, rgba(5,10,18,.22) 48%, rgba(5,10,18,.62) 100%);
  z-index:1;
  pointer-events:none;
}
.heroSlider .slide{
  transform:scale(1.045);
  transition:opacity .9s ease, transform 6s ease;
}
.heroSlider .slide.active{
  transform:scale(1);
}
.heroSlider .slide img{
  filter:saturate(1.02) contrast(1.01);
}
.sliderOverlay{
  position:absolute;
  left:22px; right:22px; bottom:22px;
  z-index:3;
  display:grid;
  gap:14px;
  color:#fff;
}
.sliderBadge{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.20);
  backdrop-filter:blur(12px);
  font-size:.82rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.sliderCaptionWrap{
  max-width:min(640px, 100%);
  padding:18px 18px 16px;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(7,16,28,.58), rgba(7,16,28,.36));
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(12px);
  box-shadow:0 18px 40px rgba(0,0,0,.18);
}
.sliderCaptionTitle{
  font-size:clamp(1.2rem, 2vw, 1.85rem);
  font-weight:800;
  line-height:1.2;
  margin-bottom:8px;
}
.sliderCaptionText{
  color:rgba(255,255,255,.88);
  font-size:.98rem;
  line-height:1.55;
}
.sliderMeta{
  display:flex; align-items:center; gap:14px;
}
.sliderCount{
  display:inline-flex; align-items:center; gap:8px;
  min-width:84px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.20);
  backdrop-filter:blur(12px);
  font-size:.92rem;
}
.sliderProgress{
  position:relative;
  flex:1;
  height:6px;
  border-radius:999px;
  background:rgba(255,255,255,.22);
  overflow:hidden;
}
.sliderProgressBar{
  display:block;
  width:0%;
  height:100%;
  border-radius:999px;
  background:#fff;
  transition:width .25s linear;
}
.sliderNav{
  background:rgba(255,255,255,.20);
  color:#fff;
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
}
.sliderNav:hover{background:rgba(255,255,255,.28)}
.sliderDots{
  bottom:26px;
  justify-content:flex-end;
  padding:0 22px;
  pointer-events:none;
}
.dotBtn{
  pointer-events:auto;
  width:10px; height:10px;
  background:rgba(255,255,255,.42);
  border:1px solid rgba(255,255,255,.35);
}
.dotBtn.active{
  background:#fff;
  width:28px;
  border-radius:999px;
}
@media(max-width:980px){
  .hero{padding-top:18px}
  .luxeTop{padding-bottom:12px}
  .heroSlider,.heroSlider img{min-height:360px}
  .heroInfoCard{border-radius:24px}
}
@media(max-width:680px){
  .header{
    background:rgba(255,255,255,.94);
  }
  .navwrap{padding:10px 0}
  .brandtxt{min-width:0}
  .brandname{font-size:1.22rem}
  .brandsub{font-size:.82rem}
  .hero.luxe{padding-top:14px}
  .luxeMedia{gap:12px}
  .luxeCard{border-radius:22px}
  .heroSlider,.heroSlider img{
    min-height:420px;
  }
  .sliderOverlay{
    left:14px; right:14px; bottom:14px;
    gap:10px;
  }
  .sliderBadge{
    font-size:.7rem;
    padding:8px 10px;
  }
  .sliderCaptionWrap{
    padding:14px 14px 13px;
    border-radius:18px;
  }
  .sliderCaptionTitle{font-size:1.05rem}
  .sliderCaptionText{font-size:.9rem}
  .sliderMeta{gap:10px}
  .sliderCount{
    min-width:auto;
    padding:7px 10px;
    font-size:.84rem;
  }
  .sliderNav{
    top:auto;
    bottom:102px;
    transform:none;
    width:40px; height:40px;
    font-size:1.65rem;
  }
  .sliderNav.prev{left:14px}
  .sliderNav.next{right:14px}
  .sliderDots{
    position:static;
    justify-content:flex-start;
    padding:0;
  }
  .smallCard{padding:14px}
  .chips{
    gap:6px;
  }
  .chip{
    font-size:.84rem;
    padding:6px 9px;
  }
}


html{scroll-behavior:smooth}
.onepage-anchor{scroll-margin-top:92px}
.brandname-xl{font-size:1.62rem}
.heroTitle{font-size:clamp(2.4rem, 4vw, 3.6rem)}
.pageIntro{margin-bottom:18px}
.centerIntro{text-align:center; max-width:820px; margin:0 auto 22px}
.featureGrid2{grid-template-columns:repeat(2,1fr)}
.nav a.active{background:rgba(15,118,110,.10); color:var(--text); border:1px solid rgba(15,118,110,.18)}
@media(max-width:900px){.featureGrid2{grid-template-columns:1fr}}
@media(max-width:680px){
  .onepage-anchor{scroll-margin-top:84px}
  .brandname-xl{font-size:1.42rem}
  .heroTitle{font-size:clamp(2rem, 8vw, 2.8rem)}
}


/* Sticky WhatsApp CTA + stronger active nav */
.nav a.active,
.nav a[aria-current="page"]{
  position:relative;
  background:linear-gradient(135deg, rgba(11,59,54,.14), rgba(15,118,110,.18));
  color:var(--text);
  border:1px solid rgba(11,59,54,.28);
  box-shadow:0 10px 24px rgba(11,59,54,.10);
}
.nav a.active::after,
.nav a[aria-current="page"]::after{
  content:"";
  position:absolute;
  left:12px; right:12px; bottom:6px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(11,59,54,.95), rgba(15,118,110,.95));
}
.whatsappFab{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:70;
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:14px 18px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg, #128c7e, #25d366);
  box-shadow:0 18px 36px rgba(18,140,126,.28);
  border:1px solid rgba(255,255,255,.22);
  font-weight:800;
  letter-spacing:.01em;
}
.whatsappFab:hover{transform:translateY(-2px) scale(1.01)}
.whatsappFab svg{flex:0 0 22px}
.whatsappFab small{display:block; font-size:.72rem; font-weight:600; opacity:.92}
.whatsappFab strong{display:block; font-size:.95rem; line-height:1.05}
@media(max-width:920px){
  .whatsappFab{right:14px; bottom:14px; padding:13px 15px; gap:10px}
  .whatsappFab small{display:none}
  .whatsappFab strong{font-size:.92rem}
}


/* Mobile overflow fixes */
html,body{
  max-width:100%;
  overflow-x:hidden;
}
.wrap,
.section,
.panel,
.split > *,
.form,
.field,
.actions{
  min-width:0;
}
.panel,
.note,
.muted,
.links a,
.field label,
.brandname,
.brandsub{
  overflow-wrap:anywhere;
  word-break:break-word;
}
.form input,
.form select,
.form textarea,
.form button,
.form .btn{
  width:100%;
  max-width:100%;
}
.actions .btn,
.actions button{
  width22:auto;
}
@media (max-width: 680px){
  .split{
    grid-template-columns:1fr;
  }
  .form{
    grid-template-columns:1fr;
  }
  .panel{
    padding:14px;
    border-radius:18px;
  }
  .note{
    font-size:.92rem;
  }
  .actions{
    flex-direction:column;
  }
  .actions .btn,
  .actions button{
    width:100%;
  }
  .whatsappFab{
    right:12px;
    bottom:12px;
    width:56px;
    height:56px;
    padding:0;
    border-radius:999px;
    justify-content:center;
    gap:0;
    box-shadow:0 14px 28px rgba(18,140,126,.24);
  }
  .whatsappFab span{
    display:none;
  }
  .whatsappFab svg{
    width:24px;
    height:24px;
    flex:0 0 24px;
  }
}





.card-clickable{cursor:pointer; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.card-clickable:hover,
.card-clickable:focus-visible{
  transform:translateY(-2px);
  border-color:rgba(15,118,110,.35);
  box-shadow:0 16px 36px rgba(15,23,42,.10);
  outline:none;
}



.nav .site-link{
  background:#d6e5e4;
  color:#0b3b36;
  border-color:rgba(11,59,54,.14);
  font-weight:800;
}
.nav .site-link:hover{
  background:#c7dddb;
  color:#082e2b;
}
.gallery a{position:relative; display:block; cursor:pointer}
.gallery a::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(7,16,28,0) 10%, rgba(7,16,28,.45) 100%);
  opacity:0;
  transition:opacity .28s ease;
  z-index:1;
}
.gallery a::after{
  content:"DETAY";
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%) scale(.94);
  background:#d6e5e4;
  color:#0b3b36;
  padding:10px 18px;
  border-radius:12px;
  font-weight:800;
  font-size:.92rem;
  letter-spacing:.03em;
  box-shadow:0 18px 36px rgba(0,0,0,.18);
  opacity:0;
  transition:opacity .28s ease, transform .28s ease, background .28s ease;
  z-index:2;
}
.gallery a:hover::before, .gallery a:focus-visible::before{opacity:1}
.gallery a:hover::after, .gallery a:focus-visible::after{opacity:1; transform:translate(-50%,-50%) scale(1)}
.gallery a:focus-visible{outline:3px solid rgba(15,118,110,.35); outline-offset:3px}
.mapbox .btn + .btn{margin-top:12px}
.video-btn{background:#d6e5e4; color:#0b3b36; border-color:rgba(11,59,54,.14)}
.video-btn:hover{background:#c7dddb; color:#082e2b}
.video-modal{position:relative; display:flex; justify-content:center; align-items:center}
.video-modal video{display:block; width:min(96vw,1100px); max-height:88vh; border-radius:22px; background:#000; box-shadow:0 30px 60px rgba(0,0,0,.35)}
@media(max-width:640px){
  .gallery a::after{padding:9px 16px; font-size:.88rem}
  .nav .site-link{width:100%; text-align:center}
}


.detail-media{position:relative; display:block; border-radius:18px; overflow:hidden; cursor:pointer; box-shadow:var(--shadow)}
.detail-media-img{display:block; width:100%; height:auto}
.detail-trigger::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(7,16,28,0) 10%, rgba(7,16,28,.45) 100%);
  opacity:0;
  transition:opacity .28s ease;
  z-index:1;
}
.detail-trigger::after{
  content:"DETAY";
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%) scale(.94);
  background:#d6e5e4;
  color:#0b3b36;
  padding:10px 18px;
  border-radius:12px;
  font-weight:800;
  font-size:.92rem;
  letter-spacing:.03em;
  box-shadow:0 18px 36px rgba(0,0,0,.18);
  opacity:0;
  transition:opacity .28s ease, transform .28s ease, background .28s ease;
  z-index:2;
}
.detail-trigger:hover::before, .detail-trigger:focus-visible::before{opacity:1}
.detail-trigger:hover::after, .detail-trigger:focus-visible::after{opacity:1; transform:translate(-50%,-50%) scale(1)}
.detail-trigger:focus-visible{outline:3px solid rgba(15,118,110,.35); outline-offset:3px}

.accent-hover-card{
  background:linear-gradient(135deg, #d6e5e4 0%, #dcebe8 100%);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}
.accent-hover-card .title,
.accent-hover-card .meta{transition:color .22s ease}
.accent-hover-card:hover,
.accent-hover-card:focus-visible{
  background:linear-gradient(135deg, #0f766e 0%, #2a9d8f 50%, #d6e5e4 100%);
  border-color:rgba(11,59,54,.30);
  box-shadow:0 20px 40px rgba(11,59,54,.18);
  transform:translateY(-3px);
}
.accent-hover-card:hover .title,
.accent-hover-card:hover .meta,
.accent-hover-card:focus-visible .title,
.accent-hover-card:focus-visible .meta{color:#fff}
@media(max-width:640px){
  .detail-trigger::after{padding:9px 16px; font-size:.88rem}
}


/* Section tone separation */
#about{
  background:
    radial-gradient(circle at top left, rgba(214,229,228,.40), transparent 28%),
    linear-gradient(180deg, rgba(11,59,54,.07), rgba(255,255,255,0) 72%) !important;
}
#plans{
  background:
    radial-gradient(circle at top right, rgba(214,229,228,.34), transparent 26%),
    linear-gradient(180deg, rgba(15,118,110,.08), rgba(255,255,255,0) 76%) !important;
}
#shops{
  background:
    linear-gradient(180deg, rgba(214,229,228,.34), rgba(255,255,255,0) 72%);
}
#gallery{
  background:
    radial-gradient(circle at top center, rgba(11,59,54,.05), transparent 34%),
    linear-gradient(180deg, rgba(214,229,228,.20), rgba(255,255,255,.92));
}
#location{
  background:
    radial-gradient(circle at top right, rgba(214,229,228,.46), transparent 30%),
    linear-gradient(180deg, rgba(11,59,54,.05), rgba(255,255,255,0) 74%);
}
#catalogs{
  background:
    linear-gradient(180deg, rgba(214,229,228,.26), rgba(255,255,255,.96));
}
#contact{
  background:
    radial-gradient(circle at top left, rgba(11,59,54,.06), transparent 28%),
    linear-gradient(180deg, rgba(214,229,228,.18), rgba(255,255,255,0) 78%);
}


/* Kampanya şeridi */
.kampanya-serit{
width:100%;
background:linear-gradient(90deg,#0f6b63 0%,#167c73 50%,#0f6b63 100%);
padding:9px 10px 11px;
text-align:center;
overflow:hidden;
position:fixed;
top:0;
left:0;
right:0;
z-index:1100;
box-shadow:0 8px 20px rgba(15,23,42,.10);
}

.kampanya-yazi{
font-size:20px;
font-weight:800;
color:#ffffff;
letter-spacing:.4px;
display:inline-block;
animation:pulse 2.8s ease-in-out infinite;
position:relative;
padding-bottom:6px;
text-shadow:0 1px 4px rgba(0,0,0,.12);
}

/* yazının altındaki ince altın çizgi */
.kampanya-yazi::before{
content:"";
position:absolute;
left:8%;
right:8%;
bottom:0;
height:1px;
border-radius:999px;
background:linear-gradient(90deg,rgba(212,175,55,0),rgba(212,175,55,.95) 20%,rgba(244,222,138,.98) 50%,rgba(212,175,55,.95) 80%,rgba(212,175,55,0));
box-shadow:0 0 6px rgba(212,175,55,.28);
}

/* içinden geçen daha yumuşak ışık efekti */
.kampanya-yazi::after{
content:"";
position:absolute;
top:-8%;
left:-45%;
width:26%;
height:116%;
background:linear-gradient(105deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.10) 30%,rgba(255,255,255,.42) 50%,rgba(255,255,255,.10) 70%,rgba(255,255,255,0) 100%);
filter:blur(1px);
transform:skewX(-22deg);
animation:shine 4.4s ease-in-out infinite;
pointer-events:none;
}

@keyframes shine{
0%{left:-45%; opacity:0}
12%{opacity:.95}
55%{opacity:.7}
100%{left:118%; opacity:0}
}

@keyframes pulse{
0%,100%{transform:scale(1); text-shadow:0 1px 4px rgba(0,0,0,.12);}
50%{transform:scale(1.03); text-shadow:0 2px 8px rgba(255,255,255,.22);}
}

@media(max-width:768px){
:root{--promo-h:60px;}
.kampanya-serit{padding:8px 10px 10px;}
.kampanya-yazi{font-size:15px;line-height:1.35;padding-bottom:5px}
.kampanya-yazi::before{left:5%; right:5%;}
}