/* erdek.com site stilleri — avsa.com temelinden; renkler ve açılış Erdek için yeniden (2026-11) */

/* ---------- Yazı tipleri (sitenin kendi sunucusundan) ---------- */
@font-face { font-family: "Manrope"; font-weight: 400; font-display: swap; src: url("../fonts/manrope-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Manrope"; font-weight: 400; font-display: swap; src: url("../fonts/manrope-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 600; font-display: swap; src: url("../fonts/manrope-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Manrope"; font-weight: 600; font-display: swap; src: url("../fonts/manrope-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 700; font-display: swap; src: url("../fonts/manrope-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Manrope"; font-weight: 700; font-display: swap; src: url("../fonts/manrope-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 800; font-display: swap; src: url("../fonts/manrope-latin-ext-800-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Manrope"; font-weight: 800; font-display: swap; src: url("../fonts/manrope-latin-800-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Bricolage Grotesque"; font-weight: 700; font-display: swap; src: url("../fonts/bricolage-grotesque-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Bricolage Grotesque"; font-weight: 700; font-display: swap; src: url("../fonts/bricolage-grotesque-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Bricolage Grotesque"; font-weight: 800; font-display: swap; src: url("../fonts/bricolage-grotesque-latin-ext-800-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Bricolage Grotesque"; font-weight: 800; font-display: swap; src: url("../fonts/bricolage-grotesque-latin-800-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ---------- Renkler ve temel ---------- */
:root {
  --ink: #14243A;
  --muted: #55657A;
  --line: #E3E0D8;
  --input: #7D97A0;
  --soft: #F6F2EA;
  --soft-2: #FBF8F3;
  --sea: #1A6488;
  --sea-dark: #124A66;
  --sea-tint: #E6EFF4;
  --cta: #C2562B;
  --price: #A8441A;
  --warn-bg: #F6E6DC;
  --warn-ink: #5C2A10;
  --ok-bg: #E2EDE3;
  --ok-ink: #2D5A33;
  --wine: #7A2E4A;
  --tint-1: #D3E5EB;
  --tint-2: #EDE3D2;
  --tint-3: #DAE7DB;
  --tint-4: #E9DCE2;
  --ph-ink: #3E5A63;
  --display: "Bricolage Grotesque", system-ui, sans-serif;
  --body: "Manrope", system-ui, sans-serif;
  --gutter: clamp(16px, 4vw, 56px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
body { margin: 0; background: #FFFFFF; color: var(--ink); font-family: var(--body); font-size: 16px; line-height: 1.5; }
img { max-width: 100%; display: block; }
a { color: var(--sea); }
a:hover { color: var(--sea-dark); }
:focus-visible { outline: 3px solid var(--sea); outline-offset: 2px; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.wrap { max-width: 1280px; margin: 0 auto; }
.section { padding: 64px var(--gutter); }
.section--tight-top { padding-top: 32px; }
.stack { display: flex; flex-direction: column; gap: 24px; }
.row-between { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; }
.muted { color: var(--muted); }
.h1 { margin: 0; font-family: var(--display); font-size: clamp(40px, 5vw, 66px); line-height: 1.02; letter-spacing: -0.03em; font-weight: 800; }
.h2 { margin: 0; font-family: var(--display); font-size: clamp(30px, 3.4vw, 38px); line-height: 1.1; letter-spacing: -0.02em; font-weight: 800; }
.h3 { margin: 0; font-family: var(--display); font-size: 21px; font-weight: 800; }
.lead { margin: 0; color: var(--muted); font-size: 17px; max-width: 680px; }
.eyebrow { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 800; color: var(--sea); letter-spacing: 0.04em; text-transform: uppercase; }
.link-strong { font-weight: 800; text-decoration: none; }

/* ---------- Düğmeler, çipler ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: 12px; border: 1px solid transparent; font: inherit; font-weight: 800; font-size: 15px; text-decoration: none; cursor: pointer; }
.btn--cta { background: var(--cta); color: #FFFFFF; }
.btn--cta:hover { background: #A8441A; color: #FFFFFF; }
.btn--dark { background: var(--ink); color: #FFFFFF; }
.btn--dark:hover { background: #1D3C46; color: #FFFFFF; }
.btn--light { background: #FFFFFF; color: var(--ink); }
.btn--outline { border-color: var(--line); color: var(--ink); background: #FFFFFF; }
.btn--outline:hover { border-color: var(--input); color: var(--ink); }
.btn--tint { background: var(--sea-tint); color: var(--sea-dark); }
.btn--tint:hover { color: var(--ink); }
.btn--lg { min-height: 52px; font-size: 16px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--line); background: #FFFFFF; color: var(--ink); text-decoration: none; font-size: 14px; font-weight: 700; }
.chip:hover { border-color: var(--input); color: var(--ink); }
.chip[aria-current] { background: var(--ink); border-color: var(--ink); color: #FFFFFF; }
.chip--on-dark { background: transparent; border: 1.5px solid #FFFFFF; color: #FFFFFF; }
.chip--on-dark:hover { color: #FFFFFF; background: rgba(255,255,255,.12); }
.chip--on-dark[aria-current] { background: #FFFFFF; color: var(--ink); }
.pill { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 800; padding: 4px 10px; border-radius: 999px; }
.pill--warn { background: var(--warn-bg); color: #8A3A14; }
.pill--ok { background: var(--ok-bg); color: var(--ok-ink); }
.pill--cta { background: var(--cta); color: #FFFFFF; }

/* ---------- Uyarı bandı ---------- */
.alert-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 12px; padding: 10px var(--gutter); background: var(--warn-bg); color: var(--warn-ink); text-decoration: none; font-size: 14px; font-weight: 600; }
.alert-bar:hover { color: var(--warn-ink); }
.alert-bar__more { font-weight: 800; text-decoration: underline; }

/* ---------- Bayram / anma bandı (App\Models\OzelGun) ---------- */
.bayram-bandi { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 12px; padding: 10px var(--gutter); font-size: 14.5px; font-weight: 600; text-align: center; line-height: 1.4; }
.bayram-bandi strong { font-weight: 800; }
.bayram-bandi--resmi { background: #c8102e; color: #fff; }
.bayram-bandi--dini { background: linear-gradient(90deg, #0f5c4a, #13735c 50%, #0f5c4a); color: #fff; }
.bayram-bandi--dini .bayram-bandi__ay { color: #f2c14e; }
.bayram-bandi--anma { background: #1f2328; color: #e8e8e8; font-weight: 500; }
.bayram-bandi--yas { background: #0b0b0b; color: #f0f0f0; font-weight: 500; border-bottom: 1px solid #333; }
.bayram-bandi__bayrak { flex: none; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255,255,255,.55); }
.bayram-bandi__baglanti { color: inherit; font-weight: 800; text-decoration: underline; white-space: nowrap; }
.bayram-bandi__baglanti:hover { color: inherit; opacity: .85; }
@media (max-width: 640px) { .bayram-bandi { font-size: 13px; padding-block: 8px; } }

/* ---------- Üst menü ---------- */
/* Üst başlık her sayfada sabit: logo (ana sayfaya dönüş) ve Instagram hep görünür */
.site-header { position: sticky; top: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 28px; padding: 16px var(--gutter); border-bottom: 1px solid var(--line); background: #FFFFFF; }
.logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.logo:hover { color: var(--ink); }
.logo__mark { width: 40px; height: 40px; border-radius: 12px; background: var(--sea); color: #FFFFFF; display: flex; align-items: center; justify-content: center; }
.logo__text { font-family: var(--display); font-weight: 800; font-size: 26px; letter-spacing: -0.02em; }
.logo__text span { color: var(--sea); }
.main-nav { display: flex; flex-wrap: wrap; gap: 6px 26px; font-weight: 700; font-size: 15px; }
.main-nav a { color: var(--ink); text-decoration: none; }
.main-nav a:hover, .main-nav a[aria-current] { color: var(--sea); }
.header-actions { display: flex; align-items: center; gap: 10px; }
.icon-btn { width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--line); background: #FFFFFF; color: var(--ink); display: inline-flex; align-items: center; justify-content: center; }
.insta { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px 0 5px; border-radius: 999px; border: 1px solid var(--line); background: #FFFFFF; color: var(--ink); text-decoration: none; font-weight: 800; font-size: 14px; white-space: nowrap; }
.insta:hover { color: var(--ink); border-color: #D6249F; }
.insta__ikon { flex: none; width: 32px; height: 32px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #FFFFFF; background: radial-gradient(circle at 30% 107%, #FDF497 0%, #FDF497 5%, #FD5949 45%, #D6249F 60%, #285AEB 90%); }
.btn--wa { background: #15803D; color: #FFFFFF; }
.btn--wa:hover { background: #116632; color: #FFFFFF; }
/* Tesis sayfasındaki "İşletme adı / WhatsApp Hattı" düğmesi: iki satır, logoda nabız halkası */
.btn--wa-hat { min-height: 56px; justify-content: center; gap: 12px; padding: 8px 16px; background: linear-gradient(135deg, #16A34A, #15803D); box-shadow: 0 6px 16px rgba(21, 128, 61, .32); }
.btn--wa-hat:hover { background: linear-gradient(135deg, #15803D, #116632); }
.wa-ikon { position: relative; flex: none; display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, .18); }
.wa-ikon::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .7); animation: wa-nabiz 2.2s ease-out infinite; }
@keyframes wa-nabiz { from { transform: scale(1); opacity: .9; } to { transform: scale(1.55); opacity: 0; } }
.wa-metin { display: flex; align-items: baseline; gap: .3em; min-width: 0; white-space: nowrap; font-size: 17px; font-weight: 800; }
.wa-metin strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-weight: 800; }
.wa-metin > span { flex: none; }
@media (prefers-reduced-motion: reduce) { .wa-ikon::after { animation: none; display: none; } }
/* Son dakika fırsatları (firsat/kart, tesis sayfası kutusu, ana sayfa bandı) */
.firsat-kart--one { border-color: var(--cta); box-shadow: 0 0 0 2px var(--cta); }
.firsat-kart__indirim { background: var(--cta) !important; color: #FFFFFF !important; }
.firsat-kart__baslik { margin: 0; font-weight: 800; font-size: 16px; color: var(--cta); }
.firsat-kart__tarih { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin: 0; font-size: 14px; font-weight: 700; }
.firsat-kart__kalan { padding: 2px 8px; border-radius: 999px; background: #FDECE4; color: #A8441A; font-size: 12px; font-weight: 800; }
.firsat-kart__aciklama { margin: 0; font-size: 14px; }
.firsat-kart__eski { font-weight: 600; margin-right: 4px; }
.firsat-kutu { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border: 2px solid var(--cta); border-radius: 16px; background: #FFF7F2; }
.firsat-kutu__ust { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--cta); }
.firsat-kutu strong { font-size: 17px; }
.firsat-kutu p { margin: 0; font-size: 14px; }
.firsat-pill { background: var(--cta); color: #FFFFFF; text-decoration: none; white-space: normal; }
.firsat-pill:hover { background: #A8441A; color: #FFFFFF; }
.firsat-bant { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; padding: 14px 18px; border-radius: 16px; background: #FFF7F2; border: 1px solid #F6C9B2; text-decoration: none; color: var(--ink); }
.firsat-bant:hover { border-color: var(--cta); color: var(--ink); }
.firsat-bant strong { font-size: 17px; }
.firsat-bant span:last-child { font-weight: 800; color: var(--cta); }

/* Esnaf ve hizmet rehberi (esnaf/index, esnaf/kategori, esnaf/kart) */
/* Kategori satırı: renkli simge + ad + kayıt sayısı rozeti; renk grubu --a/--b (geçiş), --z (rozet zemini) */
.esnaf-grup { display: flex; flex-direction: column; gap: 12px; }
.esnaf-grup > .h3 { margin: 0; }
.esnaf-kategoriler { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.esnaf-kategori { --a: #2BB673; --b: #12925A; --z: #E3F6EC; --y: #12804F;
  display: flex; align-items: center; gap: 14px; min-height: 72px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 16px; background: #FFFFFF; color: var(--ink); text-decoration: none; }
a.esnaf-kategori:hover { border-color: color-mix(in srgb, var(--a) 45%, #FFFFFF); color: var(--ink); }
.esnaf-kategori__ikon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 44px; height: 44px; border-radius: 13px;
  background: linear-gradient(140deg, var(--a), var(--b)); color: #FFFFFF; box-shadow: 0 8px 18px -10px var(--b); }
.esnaf-kategori strong { flex: 1; font-size: 15.5px; line-height: 1.25; }
.esnaf-kategori__sayi { display: inline-flex; align-items: center; justify-content: center; flex: none; min-width: 28px; height: 26px; padding: 0 8px; border-radius: 999px; background: var(--z); color: var(--y); font-size: 13px; font-weight: 800; }
.esnaf-kategori__yakinda { flex: none; font-size: 12px; font-weight: 700; color: var(--muted); }
.esnaf-kategori--bos { background: var(--soft-2); border-style: dashed; }
.esnaf-kategori--bos .esnaf-kategori__ikon { filter: grayscale(.85); opacity: .55; box-shadow: none; }
.esnaf-kategori--bos strong { color: var(--muted); font-weight: 700; }
.esnaf-kategori--turuncu { --a: #FF9A4D; --b: #E8590C; --z: #FFEDE0; --y: #C2410C; }
.esnaf-kategori--mavi { --a: #4C8DFF; --b: #1D4ED8; --z: #E4EDFF; --y: #1D4ED8; }
.esnaf-kategori--camgobegi { --a: #22C3D6; --b: #0A7F95; --z: #DDF6F9; --y: #0A6C80; }
.esnaf-kategori--mor { --a: #A271F5; --b: #6D28D9; --z: #EFE7FD; --y: #6D28D9; }
.esnaf-kategori--pembe { --a: #F472B6; --b: #DB2777; --z: #FCE7F3; --y: #BE185D; }
.esnaf-giris { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px; }
.esnaf-giris__etiket { align-self: flex-start; padding: 5px 12px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.3); font-size: 13px; font-weight: 700; }
.esnaf-ekletin { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 22px; border-radius: 18px;
  border: 1px dashed #8CC3D4; background: linear-gradient(100deg, var(--sea-tint), #F4FAFC); }
.esnaf-ekletin > div:first-child { display: flex; flex-direction: column; gap: 4px; max-width: 720px; }
.esnaf-ekletin strong { font-size: 17px; color: var(--sea-dark); }
.esnaf-ekletin span { font-size: 14px; color: var(--muted); }
.esnaf-ekletin__dugmeler { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.esnaf-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.esnaf-kart { display: flex; flex-direction: column; justify-content: space-between; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #FFFFFF; }
.esnaf-kart--one { border-color: var(--cta); box-shadow: 0 0 0 2px var(--cta); }
.esnaf-kart__ad { margin: 0; font-size: 19px; }
.esnaf-kart__aciklama { margin: 0; font-size: 15px; }
.taksi-durum { display: inline-block; margin-left: 8px; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 700; vertical-align: middle; background: #EEF1F4; color: #5B6570; }
.taksi-durum--acik { background: #DDF5E4; color: #17713A; }
.taksi-kayit { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 20px; border-radius: 18px; background: #FFF4E5; border: 1px solid #F5C77E; }
.esnaf-kart__saat { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 14px; }
.esnaf-kart__dugmeler { display: flex; flex-wrap: wrap; gap: 8px; }
.esnaf-kart__dugmeler .btn { min-height: 42px; padding: 0 14px; font-size: 14px; }
@media (max-width: 480px) {
  .esnaf-liste { grid-template-columns: 1fr; }
  .esnaf-kategoriler { grid-template-columns: 1fr; gap: 10px; }
  .esnaf-kategori { min-height: 64px; }
  .esnaf-ekletin .btn { flex: 1 1 auto; }
  .esnaf-kart__dugmeler .btn { flex: 1 1 auto; }
}

/* Çerez izni şeridi (Google Analytics); telefonda alttaki iletişim çubuğunun da üstünde */
.cerez-izni { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 60; display: flex; align-items: center; gap: 12px 20px; max-width: 760px; margin: 0 auto; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; background: #FFFFFF; box-shadow: 0 10px 30px rgba(20,36,58,.18); font-size: 14px; }
.cerez-izni[hidden] { display: none; }
.cerez-izni p { margin: 0; flex: 1; }
.cerez-izni__dugmeler { display: flex; gap: 8px; flex: none; }
.cerez-izni .btn { min-height: 40px; padding: 0 16px; font-size: 14px; }
@media (max-width: 600px) {
  .cerez-izni { flex-direction: column; align-items: stretch; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom)); padding: 12px; font-size: 13px; }
  .cerez-izni__dugmeler .btn { flex: 1; }
}

/* "Yapay zekâ ile özetleyin" düğmeleri (otel ve rehber sayfaları) */
.yz-ozet { display: flex; flex-direction: column; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: var(--soft-2); }
.yz-ozet__baslik { margin: 0; font-weight: 800; font-size: 16px; }
.yz-ozet__dugmeler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.yz-ozet__dugme { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 10px; border: 1px solid var(--line); border-radius: 12px; background: #FFFFFF; color: var(--ink); font-weight: 700; font-size: 14px; text-decoration: none; white-space: nowrap; }
.yz-ozet__dugme:hover { border-color: var(--yz-renk); color: var(--ink); }
.yz-ozet__nokta { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--yz-renk); }
@media (max-width: 380px) { .yz-ozet__dugme { font-size: 13px; padding: 0 6px; gap: 6px; } }

/* Hava durumu sayfası */
.hava-simdi { display: grid; grid-template-columns: auto 1fr; gap: 12px 32px; align-items: center; padding: 24px; border-radius: 22px; color: #FFFFFF; background: linear-gradient(135deg, #0A6C8C, #13A0C4); box-shadow: 0 12px 30px rgba(10, 108, 140, .25); }
.hava-simdi__ana { display: flex; align-items: center; gap: 16px; }
.hava-simdi__simge { font-size: 64px; line-height: 1; }
.hava-simdi__derece { font-family: var(--display); font-size: 64px; font-weight: 800; line-height: 1; }
.hava-simdi__ad { font-size: 18px; font-weight: 700; opacity: .95; }
.hava-simdi__detay { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; margin: 0; }
.hava-simdi__detay dt { font-size: 13px; opacity: .8; }
.hava-simdi__detay dd { margin: 0; font-weight: 800; font-size: 16px; }
.hava-simdi__not { grid-column: 1 / -1; margin: 0; font-size: 13px; opacity: .8; }
.hava-uyari { display: flex; flex-direction: column; gap: 4px; padding: 14px 18px; border-radius: 16px; background: #FEF3C7; border: 1px solid #F59E0B; color: #78350F; text-decoration: none; }
.hava-uyari:hover { color: #78350F; background: #FDE68A; }
.hava-saatlik { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity; }
.hava-saat { flex: none; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 72px; padding: 10px 6px; border: 1px solid var(--line); border-radius: 14px; background: #FFFFFF; scroll-snap-align: start; }
.hava-saat__saat { font-size: 13px; font-weight: 700; color: var(--muted); }
.hava-saat__simge { font-size: 26px; line-height: 1.1; }
.hava-saat__ruzgar { font-size: 12px; color: var(--muted); white-space: nowrap; }
.hava-gunluk { width: 100%; border-collapse: collapse; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.hava-gunluk th, .hava-gunluk td { padding: 12px 14px; border-top: 1px solid var(--line); text-align: left; vertical-align: middle; }
.hava-gunluk tr:first-child th, .hava-gunluk tr:first-child td { border-top: 0; }
.hava-gunluk small { display: block; color: var(--muted); font-size: 12.5px; font-weight: 600; }
.hava-gunluk__hava span { font-size: 22px; margin-right: 4px; }
.hava-gunluk__derece { white-space: nowrap; font-size: 17px; }
.hava-gunluk__ruzgar { white-space: nowrap; text-align: right !important; }
@media (max-width: 640px) {
  .hava-simdi { grid-template-columns: 1fr; padding: 18px; }
  .hava-simdi__simge, .hava-simdi__derece { font-size: 52px; }
  .hava-gunluk th, .hava-gunluk td { padding: 10px 8px; font-size: 14px; }
  .hava-gunluk__hava { font-size: 13px; }
}

/* Ana sayfa hava kutusu (koyu "Avşa'ya ulaşım" bandında) */
.hava-kutulari { display: flex; flex-wrap: wrap; gap: 10px; }
.hava-kutulari > * { flex: 1 1 320px; }
.hava-kutu { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 16px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); color: #FFFFFF; text-decoration: none; }
.hava-kutu:hover { color: #FFFFFF; background: rgba(255, 255, 255, .18); }
.hava-kutu__simge { font-size: 32px; line-height: 1; }
.hava-kutu__metin { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.hava-kutu__metin strong { font-size: 17px; }
.hava-kutu__metin span { font-size: 14px; } /* soluk yazı (opacity) PageSpeed kontrast uyarısı veriyordu */
.hava-kutu__ok { display: inline-flex; align-items: center; gap: 4px; font-weight: 800; font-size: 14px; white-space: nowrap; }
@media (max-width: 480px) { .hava-kutu__ok { display: none; } }

/* "Bizi Instagram'da takip edin" bandı */
.insta-bant { display: flex; align-items: center; gap: 16px; padding: 18px 22px; border-radius: 20px; color: #FFFFFF; text-decoration: none; background: linear-gradient(100deg, #F58529 0%, #DD2A7B 45%, #8134AF 75%, #515BD4 100%); box-shadow: 0 10px 26px rgba(221, 42, 123, .25); }
.insta-bant:hover { color: #FFFFFF; filter: brightness(1.05); }
.insta-bant__ikon { flex: none; display: inline-grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; background: rgba(255, 255, 255, .2); }
.insta-bant__metin { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.insta-bant__metin strong { font-family: var(--display); font-size: 22px; font-weight: 800; line-height: 1.15; }
.insta-bant__metin span { font-size: 15px; opacity: .95; }
.insta-bant__dugme { flex: none; padding: 10px 20px; border-radius: 999px; background: #FFFFFF; color: #C1306B; font-weight: 800; }
.insta-bant--kucuk { padding: 12px 16px; gap: 12px; border-radius: 16px; }
.insta-bant--kucuk .insta-bant__ikon { width: 42px; height: 42px; border-radius: 12px; }
.insta-bant--kucuk .insta-bant__metin strong { font-size: 18px; }
.insta-bant--kucuk .insta-bant__metin span { font-size: 14px; }
@media (max-width: 640px) {
  .insta-bant { padding: 14px; gap: 12px; }
  .insta-bant__ikon { width: 44px; height: 44px; border-radius: 12px; }
  .insta-bant__metin strong { font-size: 18px; }
  .insta-bant__metin span { font-size: 13px; }
  .insta-bant__dugme { padding: 8px 14px; font-size: 14px; }
}
/* Telefon menüsünün başında Instagram */
.mobile-menu__panel a.mobil-insta { gap: 8px; margin-bottom: 6px; white-space: nowrap; font-size: 14.5px; color: #FFFFFF; background: linear-gradient(100deg, #F58529, #DD2A7B 55%, #8134AF); }
.mobil-insta svg { flex: none; }
.mobile-menu__panel a.mobil-insta:hover { background: linear-gradient(100deg, #F58529, #DD2A7B 55%, #8134AF); filter: brightness(1.05); }
.mobil-insta small { margin-left: auto; font-weight: 800; opacity: .95; }

/* Sitede arama: üst çubukta büyüteç, açılır kutu ve öneriler */
/* Kutu üst çubuğun sağ kenarına hizalanır (çubuk sabit/konumlu olduğu için ona göre) */
.site-arama { position: static; }
.site-arama summary { list-style: none; cursor: pointer; }
.site-arama summary::-webkit-details-marker { display: none; }
.site-arama[open] .site-arama__dugme { border-color: var(--sea); color: var(--sea); }
/* Büyüteç + "Ara" yazısı (yalnızca simge anlaşılmayabilir) */
.icon-btn.site-arama__dugme { width: auto; gap: 6px; padding: 0 12px 0 10px; font-weight: 800; font-size: 14px; }
/* Küçük telefonda "Ara" yazısına yer: Instagram yalnızca logosuyla */
@media (max-width: 480px) {
  .insta { padding: 0 4px; }
  .insta__ad { display: none; }
}
.site-arama__panel { position: absolute; right: 16px; top: calc(100% + 6px); z-index: 30; width: min(420px, calc(100vw - 24px)); padding: 10px; border-radius: 16px; border: 1px solid var(--line); background: #FFFFFF; box-shadow: 0 14px 34px rgba(20,36,58,.16); }
.site-arama__form { position: relative; }
.site-arama__ikon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.site-arama__form input { width: 100%; min-height: 46px; padding: 0 12px 0 38px; border: 1px solid var(--input); border-radius: 12px; font: inherit; font-size: 16px; background: #FFFFFF; }
.site-arama__form input:focus { outline: 2px solid var(--sea); outline-offset: 1px; border-color: var(--sea); }
.site-arama__oneriler { list-style: none; margin: 8px 0 0; padding: 0; max-height: min(60vh, 420px); overflow-y: auto; }
.site-arama__oneriler a { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; color: var(--ink); text-decoration: none; }
.site-arama__oneriler a:hover, .site-arama__oneriler a:focus { background: var(--soft); }
.site-arama__oneriler img, .site-arama__bos { flex: none; width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: var(--soft); }
.site-arama__oneriler strong { display: block; font-weight: 800; line-height: 1.2; }
.site-arama__oneriler small { display: block; color: var(--muted); font-size: 13px; }
.site-arama__tumu a { justify-content: center; font-weight: 800; color: var(--sea); }
.site-arama__yok { padding: 10px 8px; color: var(--muted); }
.arama-formu { display: flex; gap: 8px; max-width: 640px; }
.arama-formu input { flex: 1; min-width: 0; min-height: 48px; padding: 0 14px; border: 1px solid var(--input); border-radius: 12px; font: inherit; font-size: 16px; background: #FFFFFF; }
@media (max-width: 900px) {
  /* Telefonda kutu üst çubuğun hemen altında, tam genişlikte */
  .site-arama__panel { left: 8px; right: 8px; width: auto; top: calc(100% + 4px); }
}
.mobile-menu { display: none; }
.mobile-menu summary { list-style: none; cursor: pointer; }
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu__panel { position: absolute; right: var(--gutter); top: calc(100% + 4px); z-index: 20; width: min(320px, calc(100vw - 32px)); padding: 12px; border-radius: 16px; border: 1px solid var(--line); background: #FFFFFF; box-shadow: 0 12px 32px rgba(20,36,58,.12); display: flex; flex-direction: column; }
.mobile-menu__panel a { display: flex; align-items: center; min-height: 44px; padding: 0 10px; border-radius: 10px; color: var(--ink); text-decoration: none; font-weight: 700; }
.mobile-menu__panel a:hover { background: var(--soft); }
/* Sabit başlık tek satırda kalsın: dar masaüstünde menü sıkışır, daha darda menü düğmesine geçer */
@media (min-width: 1261px) and (max-width: 1400px) {
  .site-header { gap: 16px; padding-left: 24px; padding-right: 24px; }
  .main-nav { gap: 6px 14px; }
  .insta { padding: 0 5px; }
  .insta__ad { display: none; }
}
@media (max-width: 1260px) {
  .main-nav { display: none; }
  .mobile-menu { display: block; }
}
@media (max-width: 900px) {
  .site-header { padding-top: 10px; padding-bottom: 10px; gap: 10px; flex-wrap: nowrap; }
  .header-actions { gap: 8px; }
  .insta { min-height: 40px; padding: 0 10px 0 4px; gap: 6px; font-size: 13px; }
  .insta__ikon { width: 30px; height: 30px; }
  .main-nav, .header-actions .hide-sm { display: none; }
  .mobile-menu { display: block; }
  .logo__mark { width: 34px; height: 34px; border-radius: 10px; }
  .logo__text { font-size: 22px; }
  /* Sabit üst çubuk telefonda ince: ekranda içeriğe yer kalsın */
  .site-header { padding-top: 6px; padding-bottom: 6px; }
  .icon-btn { width: 38px; height: 38px; border-radius: 10px; }
  .insta { min-height: 36px; }
  .insta__ikon { width: 26px; height: 26px; }
}

/* ---------- Hero ve arama ---------- */
.hero { background: var(--soft); padding: 56px var(--gutter) 64px; }
.hero__grid { display: flex; flex-wrap: wrap; gap: 48px; align-items: center; }
.hero__text { flex: 1 1 540px; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.hero__text .h1 span { color: var(--sea); }
.hero__media { flex: 1 1 420px; min-width: 0; height: 500px; border-radius: 28px; overflow: hidden; position: relative; }
.hero__badge { position: absolute; left: 20px; bottom: 20px; background: #FFFFFF; border-radius: 16px; padding: 12px 16px; display: flex; align-items: center; gap: 12px; }
.hero__badge small { display: block; font-size: 12px; font-weight: 700; color: var(--muted); }
.hero__badge strong { font-size: 16px; }
.search { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px; background: #FFFFFF; border-radius: 20px; border: 1px solid var(--line); }
.search__field { flex: 1 1 140px; min-width: 0; display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; background: var(--soft); border-radius: 12px; }
.search__field label { font-size: 12px; font-weight: 700; color: var(--muted); }
.search__field select, .search__field input { border: 0; background: transparent; font: inherit; font-size: 16px; font-weight: 700; color: var(--ink); padding: 2px 0; min-height: 30px; width: 100%; }
.search .btn { flex: 1 1 180px; min-height: 56px; white-space: nowrap; }
.quick { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.quick > span { font-size: 14px; font-weight: 700; color: var(--muted); margin-right: 4px; }
@media (max-width: 640px) {
  .hero { padding-top: 24px; padding-bottom: 28px; }
  .hero__grid { gap: 20px; }
  .hero__media { height: 220px; border-radius: 20px; flex-basis: 100%; }
  .hero__badge { display: none; }
}

/* ---------- Ana sayfa açılışı (giris): tam genişlik fotoğraf, kısa başlık, tür düğmeleri ---------- */
/* Yazılar üstte (kullanıcı isteği), altta fotoğraf görünür kalır */
/* Yükseklik ekrana göre: altındaki kısayollar ilk ekranda görünsün (başlık 77 px + kısayollar ≈ 90 px pay) */
.giris { position: relative; overflow: hidden; color: #FFFFFF; background: var(--sea); padding: 34px var(--gutter) 22px; min-height: 480px; min-height: clamp(400px, calc(100svh - 250px), 540px); display: flex; align-items: stretch; }
.giris--zemin { background: linear-gradient(135deg, #0A6C8C, #14243A); }
.giris__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Gölge yalnızca yazının durduğu sol-alt tarafta; fotoğrafın turkuaz denizi ve kumsalı canlı kalsın */
.giris::after { content: ""; position: absolute; inset: 0; background:
  linear-gradient(90deg, rgba(20,36,58,.72) 0%, rgba(20,36,58,.45) 38%, rgba(20,36,58,0) 68%),
  linear-gradient(180deg, rgba(20,36,58,0) 55%, rgba(20,36,58,.45) 100%); }
.giris--zemin::after { display: none; }
/* Üstte yazılar, altta düğmeler; aradaki boşlukta fotoğraf görünür */
.giris__ic { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; width: 100%; }
.giris__yazilar { display: flex; flex-direction: column; gap: 12px; }
.giris__dugmeler { display: flex; flex-direction: column; gap: 12px; }
.giris__ust { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.giris__baslik { margin: 0; max-width: 720px; font-family: var(--display); font-size: clamp(28px, 3.6vw, 46px); line-height: 1.06; letter-spacing: -.025em; font-weight: 800; text-shadow: 0 2px 18px rgba(0,0,0,.3); }
.giris__slogan { margin: 0; font-size: 17px; font-weight: 600; max-width: 640px; text-shadow: 0 1px 10px rgba(0,0,0,.3); }
/* Yazı ile düğmeler arasında belirgin boşluk (kullanıcı isteği: "çok karışık görünüyor") */
.giris__turler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; max-width: 820px; }
/* Tür düğmeleri: her türün kendi rengi (çerçeve + simge zemini), --tur-renk / --tur-zemin */
.giris__tur { --tur-renk: var(--sea); --tur-zemin: var(--sea-tint); display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 14px 16px; border: 4px solid var(--tur-renk); border-radius: 18px; background: #FFFFFF; color: var(--ink); text-decoration: none; box-shadow: 0 10px 30px rgba(0,0,0,.18); transition: transform .15s, background .15s; }
.giris__tur:hover { color: var(--ink); transform: translateY(-2px); background: var(--tur-zemin); }
.giris__tur svg { box-sizing: content-box; padding: 7px; border-radius: 12px; background: var(--tur-zemin); color: var(--tur-renk); }
.giris__tur--otel { --tur-renk: #0A6C8C; --tur-zemin: #DDF0F5; }
.giris__tur--apart { --tur-renk: #B45309; --tur-zemin: #FBEBD5; }
.giris__tur--pansiyon { --tur-renk: #2F7A3B; --tur-zemin: #E1F0E2; }
.giris__tur--motel { --tur-renk: #8E2C5A; --tur-zemin: #F5E1EA; }
.giris__tur strong { font-family: var(--display); font-size: 20px; }
.giris__tur small { font-size: 13px; font-weight: 700; color: var(--muted); }
.giris__hizli { display: flex; flex-wrap: wrap; gap: 8px; }
/* Hızlı seç düğmeleri fotoğrafın üstünde belirgin: beyaz zemin, koyu yazı, gölge */
.chip--cam { background: #FFFFFF; border: 2px solid #FFFFFF; color: var(--ink); font-weight: 800; box-shadow: 0 4px 14px rgba(0,0,0,.22); }
.chip--cam:hover { background: var(--sea-tint); border-color: var(--sea); color: var(--ink); }

/* Kısayollar (açılışın altında) */
.kisayollar-bolum { padding: 14px var(--gutter) 0; }
.kisayollar { display: flex; flex-wrap: wrap; gap: 8px; }
.kisayol { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px; border: 1px solid var(--line); border-radius: 999px; background: #FFFFFF; color: var(--ink); text-decoration: none; font-weight: 800; font-size: 15px; white-space: nowrap; }
.kisayol:hover { border-color: var(--ink); color: var(--ink); }
.kisayol > span { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--sea-tint); color: var(--sea-dark); }
.kisayol small { padding: 1px 7px; border-radius: 999px; background: var(--cta); color: #FFFFFF; font-size: 12px; }
.kisayol--vurgu { border-color: var(--cta); }
.kisayol--vurgu > span { background: #FDECE4; color: var(--cta); }

/* Ada rehberi fotoğraflı kartları */
.rehber-kartlar { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.rehber-kart { position: relative; display: block; height: 240px; border-radius: 20px; overflow: hidden; color: #FFFFFF; text-decoration: none; }
.rehber-kart > :first-child { position: absolute; inset: 0; width: 100%; height: 100%; }
.rehber-kart img { transition: transform .4s; }
.rehber-kart:hover img { transform: scale(1.04); }
.rehber-kart::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(20,36,58,.85)); }
.rehber-kart__metin { position: absolute; left: 16px; right: 16px; bottom: 14px; z-index: 1; display: flex; flex-direction: column; gap: 2px; }
.rehber-kart__metin strong { font-family: var(--display); font-size: 20px; line-height: 1.15; }
.rehber-kart__metin small { font-size: 13px; opacity: .9; }
.rehber-kart:hover { color: #FFFFFF; }

/* Katlanan uzun yazı ("Devamını oku") */
.katla > summary { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 800; color: var(--sea); list-style: none; }
.katla > summary::-webkit-details-marker { display: none; }
.katla > summary::after { content: "▾"; }
.katla[open] > summary { margin-bottom: 8px; }
.katla[open] > summary::after { content: "▴"; }
.diger-ac { display: none; }

/* Son baktıklarınız (partials/son-gezilenler): her ekranda yana kayan tek satır küçük kartlar */
.son-gezilenler { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; }
.son-gezilenler[hidden] { display: none; }
.son-gezilenler-kap { padding: 0 var(--gutter); }
.son-gezilenler__temizle { border: 0; background: none; padding: 6px 0; color: var(--muted); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.son-gezilenler__temizle:hover { color: var(--ink); text-decoration: underline; }
.son-gezilenler__liste { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; padding-bottom: 6px; }
.son-kart { flex: none; width: 240px; display: flex; align-items: center; gap: 10px; padding: 8px; border: 1px solid var(--line); border-radius: 16px; background: #FFFFFF; color: var(--ink); text-decoration: none; scroll-snap-align: start; }
.son-kart:hover { border-color: var(--ink); color: var(--ink); }
.son-kart__foto { flex: none; width: 60px; height: 60px; border-radius: 12px; overflow: hidden; background: var(--soft); }
.son-kart__foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.son-kart__metin { min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.son-kart__metin strong { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.son-kart__metin small { font-size: 13px; color: var(--muted); }

@media (max-width: 900px) {
  .giris__turler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rehber-kartlar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  /* Telefonda başlık 51 px + kısayollar ≈ 80 px pay */
  .giris { min-height: 470px; min-height: clamp(430px, calc(100svh - 150px), 540px); padding: 22px 16px 16px; }
  .giris__ic { gap: 28px; }
  .giris__yazilar { gap: 10px; }
  .giris__dugmeler { gap: 10px; }
  /* Dar ekranda fotoğrafın sağa yakın kısmı (turkuaz sığ su + kumsal) görünsün */
  .giris__foto { object-position: 66% 50%; }
  /* Telefonda yazı tüm genişlikte: üstte açık, yazının olduğu alt yarıda koyulaşan hafif gölge */
  .giris::after { background: linear-gradient(180deg, rgba(20,36,58,.62) 0%, rgba(20,36,58,.38) 45%, rgba(20,36,58,.12) 75%, rgba(20,36,58,.30) 100%); }
  .giris__ic { gap: 12px; }
  .giris__ust { font-size: 12px; }
  .giris__baslik { font-size: 24px; }
  .giris__slogan { font-size: 15px; }
  .giris__tur svg { padding: 5px; }
  .giris__turler { gap: 10px; }
  .giris__tur { flex-direction: row; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; }
  .giris__tur strong { font-size: 17px; }
  .giris__tur small { display: none; }
  /* Telefonda yan yana kaydırılan satırlar (kısayollar, hızlı seç, temalar, firmalar, rehber) */
  .kaydir { display: flex; flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; margin: 0 -16px; padding: 0 16px 4px; }
  .kaydir::-webkit-scrollbar { display: none; }
  .kaydir > * { flex: none; scroll-snap-align: start; }
  .kisayollar-bolum { padding-top: 14px; }
  .son-gezilenler { margin-top: 18px; }
  .son-kart { width: 210px; }
  .son-gezilenler__liste { scroll-padding-inline: 16px; }
  .kisayol { font-size: 14px; padding-right: 14px; }
  .rehber-kartlar { gap: 10px; }
  .rehber-kart { width: 230px; height: 200px; }
  /* Telefonda kaymayan sade düzen (kullanıcı isteği): temalar iki sütun küçük düğme, feribotlar "Diğer tesisler" gibi
     tek satırlık liste. .grid-auto (display: grid) dosyada daha aşağıda; ezmesin diye çift sınıf. */
  .grid-auto.themes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .themes .theme-tile { flex-direction: row; justify-content: flex-start; gap: 10px; min-height: 56px; padding: 10px 12px; text-align: left; font-size: 14px; border-radius: 14px; }
  .themes .theme-tile svg { flex: none; width: 26px; height: 26px; }
  .grid-auto.firma-liste { grid-template-columns: 1fr; gap: 8px; }
  .firma-liste .ferry { flex-direction: row; align-items: center; gap: 12px; padding: 8px; border-radius: 16px; }
  .firma-liste .ferry__media { flex: none; width: 64px; height: 64px; border-radius: 12px; overflow: hidden; }
  .firma-liste .ferry__badge { display: none; }
  .firma-liste .ferry__body { flex: 1; min-width: 0; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 0; column-gap: 8px; }
  .firma-liste .ferry__name { font-size: 18px; }
  .firma-liste .ferry__route { flex-basis: 100%; order: 2; font-size: 14px; }
  .firma-liste .ferry__more { margin: 0 0 0 auto; padding: 0; font-size: 0; }
  .firma-liste .ferry__more svg { width: 20px; height: 20px; }
  .firma-liste .price-card { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; padding: 14px 16px; border-radius: 16px; }
  .firma-liste .price-card .price-card__rows, .firma-liste .price-card .stack span:last-child { display: none; }
  .firma-liste .price-card .btn { margin-left: auto; min-height: 40px; }
  /* Diğer tesisler: ilk 6, kalanı düğmeyle */
  .diger-liste:not(.diger-liste--acik) > :nth-child(n+7) { display: none; }
  .diger-ac { display: block; }
  .diger-liste--acik + .diger-ac { display: none; }
  .section { padding-top: 40px; padding-bottom: 40px; }
  .band-sea { padding: 40px 16px; }
  .why { gap: 14px; padding: 18px; }
  .why > div { min-width: 0; gap: 4px; }
  .why > div .muted { font-size: 14px; }
}

/* ---------- Görsel yer tutucu (fotoğraf yüklenene kadar) ---------- */
.ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--ph-ink); font-size: 13px; font-weight: 700; text-align: center; }
.ph--1 { background: var(--tint-1); }
.ph--2 { background: var(--tint-2); }
.ph--3 { background: var(--tint-3); }
.ph--4 { background: var(--tint-4); }
.ph--hero { background: #CFE2E8; width: 100%; height: 100%; }
.cover { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Tür kartları ---------- */
.grid-auto { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(var(--min, 260px), 100%), 1fr)); }
.grid-fit { grid-template-columns: repeat(auto-fit, minmax(min(var(--min, 260px), 100%), 1fr)); }
.tile { display: flex; flex-direction: column; gap: 10px; padding: 22px; border-radius: 20px; border: 1px solid var(--line); text-decoration: none; color: var(--ink); }
.tile:hover { border-color: var(--input); color: var(--ink); }
.tile__icon { width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; }
.tile__title { font-family: var(--display); font-size: 22px; font-weight: 700; }
.tile__text { font-size: 15px; color: var(--muted); }
.tile__more { font-size: 14px; font-weight: 800; color: var(--sea); }
.ic--sea { background: var(--sea-tint); color: var(--sea-dark); }
.ic--sand { background: #F3EBDD; color: #7A4A12; }
.ic--green { background: #E2EDE3; color: #2D5A33; }
.ic--wine { background: #EFE3E8; color: var(--wine); }

/* ---------- Tatil temaları ---------- */
.band-cta { background: var(--cta); color: #FFFFFF; padding: 48px var(--gutter); }
.band-cta .lead { color: #FFFFFF; }
.theme-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 140px; padding: 20px 14px; border-radius: 16px; background: #FFFFFF; color: var(--ink); text-decoration: none; text-align: center; font-weight: 800; font-size: 15px; }
.theme-tile:hover { color: var(--ink); box-shadow: 0 0 0 3px rgba(255,255,255,.5); }
.theme-tile svg { color: var(--cta); }
@media (max-width: 640px) {
  .band-cta { margin: 22px 16px 0; padding: 20px 14px; border-radius: 22px; }
  .themes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .theme-tile { min-height: 100px; padding: 14px 6px; font-size: 13px; gap: 8px; border-radius: 14px; }
  .theme-tile svg { width: 30px; height: 30px; }
}

/* ---------- Tesis kartları ---------- */
.card { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: #FFFFFF; }
.card__media { position: relative; display: block; height: 190px; text-decoration: none; }
.card__badge { position: absolute; top: 12px; left: 12px; background: #FFFFFF; color: var(--ink); font-size: 12px; font-weight: 800; padding: 6px 10px; border-radius: 999px; }
.card__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.card__type { font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.card__title { margin: 0; font-family: var(--display); font-size: 21px; font-weight: 700; letter-spacing: -0.01em; }
.card__title a { color: var(--ink); text-decoration: none; }
.card__title a:hover { color: var(--sea); }
.price { margin: 0; font-size: 15px; font-weight: 800; color: var(--price); }
.price--none { font-weight: 400; color: var(--muted); }
.card__actions { display: flex; gap: 8px; margin-top: auto; padding-top: 14px; }
.card__actions .btn { flex: 1; font-size: 14px; padding: 0 10px; }

.compact { display: flex; align-items: center; gap: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 16px; }
.compact__thumb { flex: none; width: 64px; height: 64px; border-radius: 12px; overflow: hidden; }
.compact__text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.compact__text a { color: var(--ink); text-decoration: none; font-weight: 800; }
.compact__text a:hover { color: var(--sea); }
.compact__text span { font-size: 14px; color: var(--muted); }
.compact__text span.is-price { font-weight: 700; color: var(--price); }
.compact .icon-btn { border: 0; background: var(--sea-tint); color: var(--sea-dark); }
@media (max-width: 640px) {
  .cards-featured { display: flex; overflow-x: auto; gap: 12px; padding-bottom: 4px; scroll-snap-type: x mandatory; }
  .cards-featured .card { flex: none; width: 262px; scroll-snap-align: start; }
  .cards-featured .card__media { height: 150px; }
}

/* ---------- Ulaşım ---------- */
.band-sea { background: var(--sea); color: #FFFFFF; padding: 64px var(--gutter); }
.band-sea .lead { color: #FFFFFF; }
.ferry { display: flex; flex-direction: column; border-radius: 20px; overflow: hidden; background: #FFFFFF; color: var(--ink); text-decoration: none; }
.ferry:hover { color: var(--ink); box-shadow: 0 0 0 3px rgba(255,255,255,.45); }
.ferry__media { position: relative; height: 150px; }
.ferry__badge { position: absolute; top: 12px; right: 12px; }
.ferry__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 2px; flex: 1; }
.ferry__name { font-family: var(--display); font-size: 22px; font-weight: 800; }
.ferry__route { font-size: 15px; font-weight: 700; color: var(--muted); }
.ferry__more { margin-top: auto; padding-top: 14px; display: flex; align-items: center; justify-content: space-between; font-weight: 800; color: var(--sea-dark); }
.price-card { display: flex; flex-direction: column; justify-content: space-between; gap: 16px; padding: 22px; border-radius: 20px; background: var(--ink); color: #FFFFFF; text-decoration: none; }
.price-card:hover { color: #FFFFFF; }
.price-card__rows { display: flex; flex-direction: column; gap: 8px; font-size: 15px; }
.price-card__rows span { display: flex; justify-content: space-between; gap: 8px; }
.price-card__rows em { font-style: normal; color: #C9D8DD; }
.price-card .btn { pointer-events: none; }

/* ---------- Duyurular ve etkinlikler ---------- */
.live { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: var(--ok-bg); color: var(--ok-ink); font-size: 14px; font-weight: 700; }
.live::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--ok-ink); }
.panel { border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: #FFFFFF; }
.panel__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 20px; background: var(--soft-2); }
.panel__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--line); font-size: 14px; }
.notice { display: flex; gap: 16px; padding: 18px 20px; border-top: 1px solid var(--line); }
.datebox { flex: none; width: 58px; height: 58px; border-radius: 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.1; background: var(--warn-bg); color: #8A3A14; }
.datebox b { font-family: var(--display); font-size: 22px; }
.datebox small { font-size: 12px; font-weight: 800; text-transform: uppercase; }
.datebox--dark { width: 52px; height: 52px; border-radius: 12px; background: var(--ink); color: #FFFFFF; }
.datebox--dark b { font-family: var(--body); font-size: 17px; }
.notice__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.notice__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--muted); }
.notice__text { margin: 0; font-size: 17px; font-weight: 700; }
/* Elle girilen duyurunun resmi (Öz Kaptan, Ömer Kaptan); tıklanınca büyük hali açılır */
.notice__resim { display: block; max-width: 420px; margin: 10px 0 6px; border-radius: 14px; overflow: hidden; border: 1px solid var(--line); }
.notice__resim img { display: block; width: 100%; height: auto; }
.event { display: flex; align-items: center; gap: 14px; padding: 14px 20px; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.event:hover { color: var(--ink); background: var(--soft-2); }
.event__text { display: flex; flex-direction: column; line-height: 1.35; min-width: 0; }
.event__type { font-size: 12px; font-weight: 800; color: var(--wine); text-transform: uppercase; }
.event__meta { font-size: 14px; color: var(--muted); }
.empty { padding: 18px 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 15px; }

/* ---------- Rehber ve neden ---------- */
.guide-feature { flex: 1 1 440px; min-width: 0; display: flex; flex-direction: column; border-radius: 24px; overflow: hidden; background: var(--soft); text-decoration: none; color: var(--ink); }
.guide-feature:hover { color: var(--ink); }
.split { display: flex; flex-wrap: wrap; gap: 16px; }
.split > * { flex: 1 1 440px; min-width: 0; }
.why { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap: 24px; padding: 28px; border-radius: 24px; background: var(--soft); }
.why > div { display: flex; flex-direction: column; gap: 8px; }
.owner-cta { display: flex; flex-direction: column; justify-content: center; gap: 14px; padding: 28px; border-radius: 24px; background: var(--ink); color: #FFFFFF; }
.owner-cta p { margin: 0; color: #C9D8DD; }

/* ---------- Alt bilgi ---------- */
.site-footer { background: var(--ink); color: #FFFFFF; padding: 56px var(--gutter) 32px; }
.site-footer a { color: #B7C3D3; text-decoration: none; }
.site-footer a:hover { color: #FFFFFF; }
.footer-cols { display: flex; flex-wrap: wrap; gap: 40px; }
.footer-cols nav { flex: 1 1 140px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.footer-cols strong { font-weight: 800; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 24px; margin-top: 40px; border-top: 1px solid #2B3E58; font-size: 14px; color: #B7C3D3; }

/* ---------- Tesis detay ve liste ---------- */
.breadcrumb { display: flex; flex-wrap: wrap; gap: 6px; font-size: 14px; color: var(--muted); }
/* Tesis sayfasının başı: ad büyük; telefonda sıkı (fotoğraf ekranın üstünde görünsün) */
.tesis-baslik .h1 { font-size: clamp(34px, 4vw, 52px); }
.tesis-mobil-ust { display: none; }
@media (max-width: 900px) {
  .section.tesis-sayfa { padding-top: 8px; }
  .tesis-sayfa > .wrap.stack { gap: 12px; }
  /* Yol satırı yerine tek satır: "‹ Avşa otelleri" ……… "3 misafir yorumu" */
  .tesis-yol { display: none; }
  .tesis-mobil-ust { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 8px; min-height: 26px; font-size: 13.5px; }
  .tesis-mobil-ust__geri { color: var(--muted); font-weight: 700; text-decoration: none; white-space: nowrap; }
  .tesis-mobil-ust .tesis-yorum { white-space: nowrap; font-weight: 700; }
  .tesis-mobil-ust .puan-rozet { font-size: 12px; }
  .tesis-mobil-ust .pill { white-space: nowrap; font-size: 12px; }
  /* Ad ve rozetler ortada; yorum bağlantısı yukarı taşındığı için burada yok, başka rozet yoksa satır kalkar */
  .tesis-baslik { gap: 6px !important; text-align: center; }
  .tesis-baslik .card__type { display: none; }
  .tesis-baslik .h1 { font-size: 27px; line-height: 1.1; }
  .tesis-baslik .chips { justify-content: center; }
  .tesis-baslik .chips > .tesis-yorum, .tesis-baslik .chips > .tesis-etiket, .tesis-baslik .chips > .tesis-paylas { display: none; }
  .tesis-baslik .chips:not(:has(> :not(.tesis-yorum, .tesis-etiket, .tesis-paylas))) { display: none; }
  .tesis-mobil-ust__sag { display: inline-flex; align-items: center; gap: 12px; margin-left: auto; }
  .tesis-mobil-ust .tesis-paylas { font-size: 13.5px; }
}
/* Başlıktaki küçük "Paylaş" bağlantısı (telefonda paylaşım menüsünü açar) */
.tesis-paylas { display: inline-flex; align-items: center; gap: 6px; color: var(--sea); font-weight: 800; text-decoration: none; white-space: nowrap; }
.tesis-paylas:hover { color: var(--ink); }

/* Arkadaşınıza gönderin (partials/paylas) */
.paylas { display: flex; flex-direction: column; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: #FFFFFF; }
.paylas__baslik { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 800; font-size: 16px; }
.paylas__dugmeler { display: flex; flex-wrap: wrap; gap: 8px; }
.paylas__dugme { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1px solid var(--line); border-radius: 12px; background: #FFFFFF; color: var(--ink); font: inherit; font-weight: 700; font-size: 14px; text-decoration: none; white-space: nowrap; cursor: pointer; }
.paylas__dugme:hover { border-color: var(--ink); color: var(--ink); }
.paylas__dugme[hidden] { display: none; }
.paylas__dugme--wa { background: #15803D; border-color: #15803D; color: #FFFFFF; }
.paylas__dugme--wa:hover { background: #166534; border-color: #166534; color: #FFFFFF; }
@media (max-width: 640px) {
  .paylas__dugmeler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .paylas__dugme--wa { grid-column: 1 / -1; min-height: 48px; font-size: 16px; }
  .paylas__dugme { padding: 0 8px; }
}
.breadcrumb a { color: var(--muted); }
.facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.facts > div { padding: 16px; border-radius: 16px; background: var(--soft); display: flex; flex-direction: column; gap: 2px; }
.facts small { font-size: 13px; font-weight: 700; color: var(--muted); }
.facts strong { font-weight: 800; }
.price-table { width: 100%; border-collapse: collapse; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.price-table th, .price-table td { padding: 14px 20px; border-top: 1px solid var(--line); }
.price-table th { text-align: left; font-weight: 800; }
.price-table td { text-align: right; color: var(--muted); }
.price-table td.has-price { color: var(--price); font-weight: 800; }
.contact-card { border: 1px solid var(--line); border-radius: 22px; padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.layout-2 { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; }
.layout-2 > .main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 32px; }
.layout-2 > .side { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.list-card { display: flex; flex-wrap: wrap; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; }
.list-card__media { flex: 1 1 240px; min-height: 200px; }
.list-card__body { flex: 999 1 300px; min-width: 0; padding: 20px 22px; display: flex; flex-direction: column; gap: 6px; }
.page-head { background: var(--soft); padding: 28px var(--gutter) 32px; }
.prose { max-width: 760px; font-size: 17px; }
.prose p { margin: 0 0 1em; }
/* Yazı içi tablolar (fiyat listeleri vb.): çizgili, sade */
.prose table { width: 100%; max-width: 560px; margin: 0 0 1.2em; border-collapse: collapse; border: 1px solid var(--line); font-size: 16px; }
.prose th, .prose td { padding: 9px 14px; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.prose thead th { background: var(--soft); font-size: 14px; color: var(--muted); border-top: 0; }
.prose th:last-child:not(:first-child) { text-align: right; }
.prose td:last-child:not(:first-child) { text-align: right; font-weight: 700; white-space: nowrap; }
.prose td p { margin: 0; }

/* ---------- Telefon ekranı sıkılaştırmaları ---------- */
@media (max-width: 640px) {
  .section { padding-top: 40px; padding-bottom: 40px; }
  .band-sea { padding-top: 40px; padding-bottom: 40px; }
  .alert-bar { justify-content: flex-start; font-size: 13px; }
  .types { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .types .tile { padding: 14px; gap: 6px; border-radius: 16px; }
  .types .tile__text, .types .tile__more { display: none; }
  .types .tile__title { font-size: 18px; }
  .types .tile__icon { width: 40px; height: 40px; border-radius: 12px; }
  /* Feribot firmaları telefonda tek satırlık liste: kurallar "Ana sayfa açılışı" bölümünde (.firma-liste) */
  #firmalar .ph span { display: none; }
  .guide-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .guide-tiles .tile { padding: 14px; }
  .guide-tiles .tile__text { display: none; }
  .guide-feature > div:first-child { height: 180px !important; }
}

/* ---------- Tesis galerisi ---------- */
.gallery-bos { height: 180px; border-radius: 22px; overflow: hidden; }
@media (max-width: 640px) { .gallery-bos { height: 120px; } }

/* Tesis sayfası: mobilde telefon ve WhatsApp düğmeleri ekranın altında sabit, masaüstünde yan kart sabit */
.iletisim-bar { display: none; }
@media (min-width: 901px) {
  .layout-2 > #iletisim { position: sticky; top: 96px; align-self: flex-start; }
}
@media (max-width: 900px) {
  /* Sıkı yerleşim: ekranın olabildiğince azını kaplasın (şerit + WhatsApp + numaralar ≈ 130 px) */
  .iletisim-bar { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; padding: 5px 10px calc(5px + env(safe-area-inset-bottom)); background: #FFFFFF; border-top: 1px solid var(--line); box-shadow: 0 -6px 18px rgba(20,36,58,.12); }
  /* "avsa.com'dan aradığınızı belirtin": kırmızı şerit, beyaz yazı */
  .iletisim-bar__not { margin: 0 0 5px; padding: 2px 8px; border-radius: 8px; background: #DC2626; color: #FFFFFF; text-align: center; font-size: 12.5px; line-height: 1.4; font-weight: 800; letter-spacing: .01em; }
  /* Telefon numaraları: kırmızı, büyük */
  .iletisim-bar .btn.btn--cta { min-height: 42px; background: #DC2626; font-size: 19px; font-weight: 800; letter-spacing: .01em; }
  .iletisim-bar .btn.btn--cta:hover { background: #B91C1C; }
  .iletisim-bar .btn svg { flex: none; }
  /* Tek satır: WhatsApp · ilk numara (geniş) · ikinci numara küçük düğme (şerit + satır ≈ 85 px) */
  .iletisim-bar__ic { display: flex; flex-wrap: nowrap; gap: 5px; }
  .iletisim-bar__ic > .btn { flex: 1 1 0; min-width: 0; }
  .iletisim-bar__ic > .iletisim-bar__wa { flex: 0 0 auto; padding: 0 12px; font-size: 15px; font-weight: 800; }
  .iletisim-bar__ic > .iletisim-bar__ikinci { flex: 0 0 auto; flex-direction: column; gap: 0; padding: 0 8px; font-size: 11px !important; line-height: 1.1; }
  .iletisim-bar__ikinci small { font-size: 11px; font-weight: 800; }
  .iletisim-bar .btn { min-height: 42px; padding: 0 6px; gap: 6px; font-size: 15px; border-radius: 10px; white-space: nowrap; overflow: hidden; }
  .iletisim-bar .btn--wa-hat { min-height: 44px; padding: 0 10px; gap: 8px; box-shadow: none; }
  .iletisim-bar .wa-ikon { width: 30px; height: 30px; }
  .iletisim-bar .wa-metin { font-size: 16px; }
  body.iletisim-barli .site-footer { padding-bottom: 110px; }
}
@media (max-width: 350px) {
  .insta { padding: 0 4px; }
  .insta__ad { display: none; }
  /* En küçük telefonlar: logo, "Ara", Instagram ve menü tek satıra sığsın */
  .site-header { padding-left: 10px; padding-right: 10px; gap: 6px; }
  .header-actions { gap: 6px; }
  .logo { gap: 6px; }
  .logo__mark { width: 30px; height: 30px; }
  .logo__text { font-size: 19px; }
  .icon-btn.site-arama__dugme { padding: 0 9px 0 8px; }
  .iletisim-bar .btn:not(.btn--cta) { font-size: 13px; }
}
.thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(140px, 100%), 1fr)); gap: 8px; }
.thumbs a { display: block; aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; background: var(--soft); }
.thumbs img { width: 100%; height: 100%; object-fit: cover; }
.lightbox { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(8,20,25,.94); }
.lightbox[open] { display: flex; align-items: center; justify-content: center; }
.lightbox::backdrop { background: rgba(8,20,25,.94); }
.lightbox img { max-width: min(1600px, 94vw); max-height: 86vh; object-fit: contain; border-radius: 8px; }
.lightbox__btn { position: absolute; width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(255,255,255,.14); color: #FFFFFF; font-size: 28px; line-height: 1; cursor: pointer; }
.lightbox__btn:hover { background: rgba(255,255,255,.28); }
.lightbox__close { top: 16px; right: 16px; font-size: 20px; }
.lightbox__prev { left: 16px; top: 50%; transform: translateY(-50%); }
.lightbox__next { right: 16px; top: 50%; transform: translateY(-50%); }
.lightbox__count { position: absolute; bottom: 18px; left: 50%; transform: translateX(-50%); color: #C9D8DD; font-weight: 700; font-size: 14px; }
.prose img { max-width: 100%; height: auto; border-radius: 14px; }

/* ---------- Misafir yorumları ve puanlar (10 üzerinden) ---------- */
.puan-rozet { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 32px; padding: 0 8px; border-radius: 10px 10px 10px 2px; background: var(--sea); color: #FFFFFF; font-weight: 800; font-size: 15px; font-variant-numeric: tabular-nums; }
.puan-rozet--buyuk { min-width: 64px; height: 56px; font-size: 26px; border-radius: 14px 14px 14px 3px; }
.puan-baglanti { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--ink); }
.card__puan { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; font-weight: 700; color: var(--ink); }
.card__puan .puan-rozet { min-width: 34px; height: 26px; font-size: 13px; }
.card__puan .muted { font-weight: 500; }

.puan-ozet { display: grid; grid-template-columns: auto 1fr; gap: 20px 32px; align-items: center; padding: 22px; border-radius: 22px; background: var(--soft); }
.puan-ozet__genel { display: flex; align-items: center; gap: 14px; }
.puan-ozet__genel strong { display: block; font-size: 20px; }
.puan-ozet__genel .muted { font-size: 14px; }
.puan-ozet__konular { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px 24px; margin: 0; }
.puan-ozet__konular dt { font-size: 14px; font-weight: 700; color: var(--muted); }
.puan-ozet__konular dd { display: flex; align-items: center; gap: 10px; margin: 4px 0 0; }
.puan-ozet__konular b { min-width: 28px; text-align: right; font-variant-numeric: tabular-nums; }
.puan-cubuk { flex: 1; height: 8px; border-radius: 99px; background: #FFFFFF; overflow: hidden; }
.puan-cubuk span { display: block; height: 100%; border-radius: inherit; background: var(--sea); }
@media (max-width: 640px) { .puan-ozet { grid-template-columns: 1fr; } }

.yorum { display: flex; flex-direction: column; gap: 10px; padding: 18px 0; border-top: 1px solid var(--line); }
.yorum__ust { display: flex; align-items: center; gap: 12px; }
.yorum__harf { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--sea-tint); color: var(--sea-dark); font-weight: 800; }
.yorum__kim { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 14px; }
.yorum__kim strong { font-size: 16px; }
.yorum__metin { margin: 0; white-space: pre-line; }
.yorum__konular { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.yorum__konular li { padding: 4px 10px; border-radius: 999px; background: var(--soft); font-size: 13px; color: var(--muted); }
.yorum__konular b { color: var(--ink); }
.yorum__yanit { margin-left: 52px; padding: 12px 16px; border-left: 3px solid var(--sea); border-radius: 0 12px 12px 0; background: var(--sea-tint); font-size: 15px; }
.yorum__yanit p { margin: 4px 0 0; white-space: pre-line; }
@media (max-width: 640px) { .yorum__yanit { margin-left: 0; } }

.yorum-bildirim { margin: 0; padding: 14px 16px; border-radius: 14px; background: var(--ok-bg); color: var(--ok-ink); font-weight: 600; }
.yorum-bildirim--uyari { background: var(--warn-bg); color: var(--warn-ink); }

.yorum-form { padding-top: 6px; }
.yorum-form > summary { list-style: none; width: fit-content; }
.yorum-form > summary::-webkit-details-marker { display: none; }
.yorum-form[open] > summary { display: none; }
.yorum-form form { padding: 22px; border: 1px solid var(--line); border-radius: 22px; }
.gizli-alan { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.alan { display: flex; flex-direction: column; gap: 6px; font-weight: 700; font-size: 15px; }
.alan em { font-style: normal; font-weight: 500; }
.alan input, .alan textarea, .alan select { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--input); border-radius: 12px; background: #FFFFFF; color: var(--ink); font: inherit; font-weight: 500; }
.alan textarea { resize: vertical; }
.alan input:focus, .alan textarea:focus, .alan select:focus { outline: 2px solid var(--sea); outline-offset: 1px; }
.alan-ikili { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.onay-kutusu { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; }
.onay-kutusu input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--sea); }

.puan-sec { margin: 0; padding: 0; border: 0; display: flex; flex-direction: column; gap: 12px; }
.puan-sec legend { padding: 0; margin-bottom: 4px; font-weight: 800; }
.puan-sec legend .muted { font-weight: 500; font-size: 14px; }
.puan-sec__satir { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.puan-sec__ad { width: 170px; font-size: 15px; font-weight: 700; }
.puan-sec__dugmeler { display: flex; gap: 4px; }
.puan-sec__dugmeler label { position: relative; }
.puan-sec__dugmeler input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.puan-sec__dugmeler span { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 10px; background: #FFFFFF; font-weight: 700; font-size: 14px; cursor: pointer; }
.puan-sec__dugmeler label:hover span { border-color: var(--input); }
.puan-sec__dugmeler input:checked + span { background: var(--sea); border-color: var(--sea); color: #FFFFFF; }
.puan-sec__dugmeler input:focus-visible + span { outline: 2px solid var(--sea); outline-offset: 2px; }
@media (max-width: 480px) {
  .puan-sec__ad { width: 100%; }
  .puan-sec__dugmeler { width: 100%; gap: 3px; }
  .puan-sec__dugmeler label { flex: 1; }
  .puan-sec__dugmeler span { width: 100%; height: 34px; font-size: 13px; }
}

/* ---------- Tesis sayfası (yeni düzen) ---------- */
html:has(.bolum-sekmeleri) { scroll-padding-top: 150px; }

.galeri { position: relative; display: grid; gap: 10px; height: 440px; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); }
.galeri > a { display: block; min-width: 0; min-height: 0; overflow: hidden; border-radius: 14px; color: inherit; background: var(--soft); }
.galeri > a img { transition: transform .4s ease; }
.galeri > a:hover img { transform: scale(1.03); }
.galeri__kapak { grid-row: 1 / -1; border-radius: 22px 14px 14px 22px !important; }
.galeri--4 .galeri__kucuk:last-of-type { grid-column: span 2; }
.galeri--3 { grid-template-columns: 2fr 1fr; }
.galeri--2 { grid-template-columns: 2fr 1fr; }
.galeri--2 .galeri__kucuk { grid-row: 1 / -1; }
.galeri--1 { grid-template-columns: 1fr; }
.galeri--1 .galeri__kapak { border-radius: 22px !important; }
.galeri__tumu { position: absolute; right: 16px; bottom: 16px; display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 16px; border: 0; border-radius: 12px; background: #FFFFFF; color: var(--ink); font: inherit; font-weight: 800; font-size: 14px; box-shadow: 0 4px 16px rgba(20,36,58,.22); cursor: pointer; }
.galeri__tumu:hover { background: var(--soft); }
@media (max-width: 900px) { .galeri { height: 360px; } }
@media (max-width: 640px) {
  .galeri, .galeri--2, .galeri--3 { height: auto; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: auto; gap: 6px; margin: 0 calc(var(--gutter) * -1); }
  .galeri__kapak { grid-column: 1 / -1; grid-row: auto; height: 250px; border-radius: 0 !important; }
  .galeri__kucuk { height: 64px; border-radius: 10px !important; grid-row: auto !important; grid-column: auto !important; }
  .galeri__kucuk:first-of-type { margin-left: var(--gutter); }
  .galeri__kucuk:last-of-type { margin-right: var(--gutter); }
  .galeri--1 { grid-template-columns: 1fr; }
  .galeri__tumu { top: 198px; bottom: auto; right: calc(var(--gutter) + 4px); min-height: 38px; font-size: 13px; }
}

/* --ust-yukseklik: üst başlığın gerçek yüksekliği (layouts/site'taki betik ölçer); sekmeler tam altına yapışır, arada boşluk kalmaz */
.bolum-sekmeleri { position: sticky; top: var(--ust-yukseklik, 72px); z-index: 30; display: flex; gap: 4px; margin: 0 calc(var(--gutter) * -1); padding: 8px var(--gutter); overflow-x: auto; scrollbar-width: none; background: rgba(255,255,255,.96); backdrop-filter: blur(6px); border-bottom: 1px solid var(--line); }
.bolum-sekmeleri::-webkit-scrollbar { display: none; }
.bolum-sekmeleri a { flex: none; padding: 8px 14px; border-radius: 999px; color: var(--muted); font-weight: 700; font-size: 15px; text-decoration: none; white-space: nowrap; }
.bolum-sekmeleri a:hover { color: var(--ink); background: var(--soft); }
.bolum-sekmeleri a[aria-current] { color: #FFFFFF; background: var(--ink); }
@media (min-width: 901px) { .layout-2 > #iletisim { top: 150px; } } /* ekrandan uzunsa tesis/detay betiği küçültür */

.guncelleme-notu { margin: 0; padding-top: 12px; border-top: 1px solid var(--line); font-size: 14px; }
/* Fiyat tablosu olmayan tesiste fiyat notu (üstteki bilgi kutuları 2026-10-28'de kaldırıldı) */
.fiyat-notu { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; color: var(--muted); }
.fiyat-notu svg { color: var(--sea); }
.fiyat-notu strong { color: var(--price); }

.one-cikanlar { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.one-cikanlar li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: var(--ok-bg); color: var(--ok-ink); font-weight: 700; font-size: 14px; }

/* İşletmenin yazdığı tanıtımdaki başlıklar sayfa başlıklarından küçük kalsın */
.aciklama h1, .aciklama h2 { font-size: 22px; margin: 0 0 6px; }
.aciklama h3, .aciklama h4 { font-size: 18px; margin: 0 0 4px; }
.aciklama--kisa { max-height: 260px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 60%, transparent); mask-image: linear-gradient(#000 60%, transparent); }
.link-dugme { padding: 0; border: 0; background: none; color: var(--sea); font: inherit; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.olanak-gruplari { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px 28px; }
.olanak-grubu { display: flex; flex-direction: column; gap: 10px; }
.olanak-grubu > strong { font-size: 15px; }
.olanak-grubu ul { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.olanak-grubu li { display: flex; align-items: center; gap: 10px; font-size: 15px; }
.olanak-ikon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 30px; height: 30px; border-radius: 9px; background: var(--sea-tint); color: var(--sea-dark); }
@media (max-width: 640px) {
  .olanak-gruplari { gap: 16px; }
  .olanak-grubu ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 10px; }
  .olanak-grubu li { font-size: 14px; gap: 8px; }
  .olanak-ikon { width: 26px; height: 26px; border-radius: 8px; }
  .olanak-ikon svg { width: 15px; height: 15px; }
}

.price-table tr.bu-ay { background: var(--soft); }
.price-table th .pill { margin-left: 6px; vertical-align: 2px; }

.konum-adres { display: flex; align-items: flex-start; gap: 8px; margin: 0; }
.konum-adres svg { flex: none; margin-top: 3px; color: var(--sea); }
.harita { height: 320px; border-radius: 18px; overflow: hidden; background: var(--soft); }
.harita iframe { display: block; width: 100%; height: 100%; border: 0; }
@media (max-width: 640px) { .harita { height: 240px; } }
/* Tıklayınca yüklenen harita: yüklenene kadar sokak deseni + iğne + "Haritayı göster" */
.harita--kapali { position: relative; border: 1px solid var(--line);
  background: linear-gradient(115deg, transparent 46%, #FFFFFF 46%, #FFFFFF 50%, transparent 50%) 0 0 / 220px 160px,
              linear-gradient(20deg, transparent 47%, #FFFFFF 47%, #FFFFFF 50%, transparent 50%) 0 0 / 180px 140px,
              linear-gradient(160deg, #E4EFF2, #D8E8EC); }
.harita__ac { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--ink); text-decoration: none; }
.harita__pin { display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 50%; background: var(--cta); color: #FFFFFF; box-shadow: 0 10px 24px -10px rgba(196,81,29,.9); }
.harita__ac strong { padding: 10px 18px; border-radius: 12px; background: #FFFFFF; box-shadow: 0 6px 18px rgba(20,36,58,.16); font-size: 15px; }
.harita__ac:hover strong { color: var(--sea); }

.yan-puan { display: flex; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.yan-puan > span:last-child { display: flex; flex-direction: column; }
.yan-puan small { font-size: 13px; }
/* ---------- Kategori sayfası rehberi ---------- */
.kategori-rehberi { display: flex; flex-direction: column; gap: 24px; margin-top: 16px; padding-top: 32px; border-top: 1px solid var(--line); }
.en-iyiler { display: flex; flex-direction: column; gap: 10px; margin: 0; padding-left: 22px; }
.en-iyiler li { padding-left: 4px; }
.en-iyiler li::marker { font-weight: 800; color: var(--muted); }
.en-iyiler a { font-weight: 800; color: var(--ink); }
.en-iyiler .card__puan { margin-top: 4px; }
.sss { border: 1px solid var(--line); border-radius: 14px; background: #FFFFFF; }
.sss summary { padding: 14px 18px; font-weight: 800; cursor: pointer; }
.sss p { margin: 0; padding: 0 18px 16px; color: var(--ink); }
.sss[open] summary { color: var(--sea-dark); }

/* ---------- Tesis galerisi: bölüm sekmeleri (Tümü, Genel, Aqua Park, odalar …) ---------- */
.thumbs a[hidden] { display: none; }
.galeri-sekmeleri .chip { gap: 6px; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.galeri-sekmeleri .chip span { font-weight: 600; opacity: .65; }
.galeri-sekmeleri .chip[aria-current] span { opacity: .85; }

/* ---------- İşletme başvuru formu ---------- */
.basvuru-bolum { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 22px; border: 1px solid var(--line); border-radius: 22px; }
.basvuru-bolum legend { padding: 0 6px; font-family: var(--display); font-size: 20px; font-weight: 800; }
.basvuru-bolum legend .muted { font-family: var(--body); font-size: 14px; font-weight: 500; }
.fiyat-satirlari { display: flex; flex-direction: column; gap: 8px; }
.fiyat-satiri { display: grid; grid-template-columns: 90px minmax(0, 1fr) minmax(0, 1fr); gap: 10px; align-items: center; }
.olanak-secim { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px 16px; }
.olanak-secim .onay-kutusu { font-size: 15px; }
.tesis-sahibi { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border-radius: 16px; border: 1px dashed var(--input); font-size: 14px; }
.tesis-sahibi a { font-weight: 800; }
@media (max-width: 480px) { .fiyat-satiri { grid-template-columns: 70px minmax(0, 1fr) minmax(0, 1fr); gap: 6px; } .basvuru-bolum { padding: 16px; } }

/* ---------- Ana sayfa büyük fotoğraf ---------- */
.hero__zemin { width: 100%; height: 100%; background: linear-gradient(160deg, var(--sea) 0%, var(--sea-dark) 100%); }
.hero__zemin svg { display: block; width: 100%; height: 100%; }
.hero__etiket { position: absolute; right: 16px; top: 16px; padding: 6px 12px; border-radius: 999px; background: rgba(20,36,58,.55); color: #FFFFFF; font-size: 13px; font-weight: 700; backdrop-filter: blur(4px); }
@media (max-width: 640px) { .hero__etiket { right: 10px; top: 10px; font-size: 12px; } }

/* ---------- Sayfa altı: saate göre selam ---------- */
.selam { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 14px; margin: 36px 0 0; text-align: center; color: #B7C3D3; font-size: 14px; }
.selam strong { color: #FFFFFF; font-family: var(--display); font-size: 18px; font-weight: 800; }

/* ---------- Ana sayfa başlığı: aranan kelimeli, daha ölçülü ---------- */
.hero__text .h1.hero__baslik { font-size: clamp(30px, 3.4vw, 46px); line-height: 1.08; }
.hero__slogan { margin: -8px 0 0; font-family: var(--display); font-size: clamp(19px, 1.8vw, 24px); font-weight: 700; color: var(--ink); }
.hero__slogan strong { color: var(--sea); }
@media (max-width: 640px) { .hero__text .h1.hero__baslik { font-size: 28px; } .hero__slogan { font-size: 18px; } }


/* ---------- Ana sayfa: Avşa Adası hakkında + sık sorulanlar ---------- */
.avsa-hakkinda { background: var(--soft); }
.avsa-hakkinda__izgara { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.avsa-hakkinda .prose p:last-child { margin-bottom: 0; }
@media (max-width: 900px) { .avsa-hakkinda__izgara { grid-template-columns: 1fr; gap: 28px; } }

/* Feribot sefer sorgulama (/feribot-seferleri) */
.sefer-sorgu { display: grid; grid-template-columns: 1fr auto 1fr 1fr auto; gap: 12px; align-items: end; padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: var(--soft-2); }
.sefer-sorgu__alan { display: flex; flex-direction: column; gap: 6px; font-weight: 800; }
.sefer-sorgu__alan select, .sefer-sorgu__alan input { min-height: 48px; border: 1px solid var(--input); border-radius: 12px; padding: 0 12px; font: inherit; font-weight: 600; background: #FFFFFF; width: 100%; }
.sefer-sorgu__degistir { min-height: 48px; width: 48px; border: 1px solid var(--line); border-radius: 12px; background: #FFFFFF; font-size: 20px; cursor: pointer; color: var(--sea); }
.sefer-sorgu .btn { min-height: 48px; }
.sefer-tablosu { width: 100%; border-collapse: collapse; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.sefer-tablosu th { text-align: left; font-size: 14px; color: var(--muted); padding: 10px 16px; background: var(--soft); }
.sefer-tablosu td { padding: 12px 16px; border-top: 1px solid var(--line); vertical-align: top; }
.sefer-tablosu td small { display: block; color: var(--muted); font-size: 13px; }
.sefer-tablosu__saat { font-weight: 800; font-size: 18px; color: var(--sea); white-space: nowrap; }
/* Tesis yorumlarında "Google yorumlarını gör" bağlantısı */
.google-yorum { min-height: 38px; padding: 0 14px; font-size: 14px; gap: 6px; }
.google-yorum svg { color: #F4B400; fill: #F4B400; }

/* Firma sayfasının üstündeki gişe telefonları (feribot/detay) */
.firma-telefonlar { padding: 16px 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--soft-2); max-width: none; }
.firma-telefonlar h2 { margin: 0 0 8px; font-size: 20px; }
.firma-telefonlar ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 4px 20px; }
.firma-telefonlar a { font-weight: 800; white-space: nowrap; }

/* Yazı içindeki canlı sefer tablosu (yazilar/sefer-hatti) */
.sefer-hatti { display: flex; flex-direction: column; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 20px; background: var(--soft-2); }
.sefer-hatti .sefer-tablosu { background: #FFFFFF; }
.sefer-hatti__hat { margin: 6px 0 0; font-family: var(--display); font-size: 19px; font-weight: 800; color: var(--sea-dark); }
.sefer-hatti__hat .muted { font-size: 14px; font-weight: 600; }
.sefer-tablosu tr.bugun-yok td { opacity: .5; }
.sefer-aciklama i { font-style: normal; opacity: .5; font-weight: 700; }
/* Yazı içi haftalık tarife (iskele × gün) ve yan yana fiyat tabloları */
.tablo-kaydir { overflow-x: auto; margin: 0 0 1.2em; border: 1px solid var(--line); border-radius: 16px; background: #FFFFFF; -webkit-overflow-scrolling: touch; }
.prose .haftalik-tarife { max-width: none; min-width: 620px; margin: 0; border: 0; font-size: 15px; font-variant-numeric: tabular-nums; }
.prose .haftalik-tarife th, .prose .haftalik-tarife td { padding: 7px 10px; text-align: center; font-weight: 600; white-space: nowrap; }
.prose .haftalik-tarife thead th { background: var(--sea-tint); color: var(--sea-dark); font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.prose .haftalik-tarife tbody th { position: sticky; left: 0; text-align: left; background: #FFFFFF; font-weight: 800; color: var(--ink); box-shadow: inset -1px 0 0 var(--line); }
.prose .haftalik-tarife tbody tr:nth-child(even) td, .prose .haftalik-tarife tbody tr:nth-child(even) th { background: var(--soft-2); }
.prose .haftalik-tarife tr.vurgu td, .prose .haftalik-tarife tr.vurgu th { background: #FFF3E8; color: var(--cta); font-weight: 800; }
.prose .haftalik-tarife tr.vurgu--erdek td, .prose .haftalik-tarife tr.vurgu--erdek th { background: var(--sea-tint); color: var(--sea-dark); }
.prose .haftalik-tarife td:last-child:not(:first-child) { text-align: center; }
.fiyat-ikili { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0 18px; align-items: start; }
.prose .fiyat-ikili table { max-width: none; border-radius: 14px; border-collapse: separate; border-spacing: 0; overflow: hidden; background: #FFFFFF; }
.prose .fiyat-ikili thead th { background: var(--sea-tint); color: var(--sea-dark); font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
@media (max-width: 760px) {
  .sefer-hatti { padding: 14px; }
  .sefer-hatti .sefer-tablosu th:nth-child(4), .sefer-hatti .sefer-tablosu td:nth-child(4) { display: none; }
  .sefer-sorgu { grid-template-columns: 1fr auto 1fr; }
  .sefer-sorgu__alan:nth-of-type(3), .sefer-sorgu .btn { grid-column: 1 / -1; }
  .sefer-tablosu th, .sefer-tablosu td { padding: 10px 10px; }
}

/* ---------- Görünüm yenilemesi: liste, ulaşım ve rehber sayfaları (2026-10-27) ---------- */
/* Sayfa başlığı (bodrum.gen.tr ulaşım sayfaları gibi): koyu deniz geçişi, ışık ve dalga deseni, beyaz yazı, altta beyaz dalga */
.page-head { position: relative; overflow: hidden; padding: 30px var(--gutter) 54px; color: #FFFFFF;
  background: radial-gradient(700px 320px at 88% -10%, rgba(255,184,120,.38), transparent 65%),
              radial-gradient(800px 360px at 10% 130%, rgba(58,190,214,.35), transparent 65%),
              linear-gradient(125deg, #06374A 0%, #0A5F7C 48%, #0B7A93 100%); }
.page-head::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .06;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='22'%3E%3Cpath d='M0 11 Q16 1 32 11 T64 11' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E"); }
.page-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 22px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 18' preserveAspectRatio='none'%3E%3Cpath d='M0 10 Q20 0 40 10 T80 10 T120 10 T160 10 V18 H0Z' fill='%23fff'/%3E%3C/svg%3E") repeat-x;
  background-size: 160px 22px; }
.page-head > .wrap { position: relative; z-index: 1; }
.page-head .h1 { color: #FFFFFF; text-shadow: 0 2px 18px rgba(0,0,0,.18); }
.page-head .lead, .page-head > .wrap > p { color: rgba(255,255,255,.86); }
.page-head .muted { color: rgba(255,255,255,.75); }
.page-head .eyebrow { color: #FFD0AE; }
.page-head .breadcrumb, .page-head .breadcrumb a { color: rgba(255,255,255,.78); text-decoration: none; }
.page-head .breadcrumb a:hover { color: #FFFFFF; text-decoration: underline; }
.page-head .breadcrumb span { color: #FFFFFF; }
.page-head > .wrap > a:not(.btn), .page-head .lead a, .page-head > .wrap > p a { color: #FFFFFF; }
.page-head .chip { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.3); color: #FFFFFF; backdrop-filter: blur(4px); }
.page-head .chip:hover { background: rgba(255,255,255,.24); border-color: rgba(255,255,255,.6); color: #FFFFFF; }
.page-head .chip[aria-current] { background: #FFFFFF; border-color: #FFFFFF; color: var(--sea-dark); }
.page-head .tesis-sahibi { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.3); color: #FFFFFF; }
.page-head .card, .page-head .esnaf-kart, .page-head .sefer-sorgu, .page-head .tesis-sahibi .muted { color: var(--ink); }
.page-head .tesis-sahibi .muted { color: rgba(255,255,255,.85); }
.page-head .card .muted, .page-head .esnaf-kart .muted, .page-head .sefer-sorgu .muted { color: var(--muted); }
.page-head .card a:not(.btn), .page-head .esnaf-kart a:not(.btn) { color: var(--sea); }
.page-head .card .breadcrumb, .page-head .esnaf-kart .h1, .page-head .card .h1 { color: var(--ink); text-shadow: none; }

/* Başlıktaki rakam kutuları: [sayı + açıklama], arada ince çizgi */
.ozet-kutular { display: inline-grid; grid-auto-flow: column; grid-auto-columns: minmax(96px, auto); gap: 1px; margin-top: 4px; align-self: flex-start;
  border-radius: 18px; overflow: hidden; background: rgba(255,255,255,.22); border: 1px solid rgba(255,255,255,.22); max-width: 100%; }
.ozet-kutular > div { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 14px 18px; background: rgba(4,30,44,.38); text-align: center; }
.ozet-kutular strong { font-family: var(--display); font-size: 28px; line-height: 1.05; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: #FFFFFF; white-space: nowrap; }
.ozet-kutular span { font-size: 12px; color: rgba(255,255,255,.78); white-space: nowrap; }
@media (max-width: 560px) {
  .ozet-kutular { grid-auto-flow: row; grid-template-columns: repeat(2, 1fr); display: grid; }
  .ozet-kutular > div { padding: 12px 10px; }
  .ozet-kutular strong { font-size: 24px; }
}

/* Sıradaki sefer kutusu (Havaş sayfası gibi): solda etiket, sağda büyük saat; betik doldurur */
.siradaki-kutu { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-radius: 14px;
  background: linear-gradient(90deg, #FFF1E5, #FFF8F2); border: 1px solid #F7D3B8; }
.siradaki-kutu[hidden] { display: none; }
.siradaki-kutu > span { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; color: var(--cta); text-transform: uppercase; letter-spacing: .04em; }
.siradaki-kutu > span::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--cta); box-shadow: 0 0 0 4px rgba(196,81,29,.18); animation: siradaki-nabiz 1.8s infinite; }
.siradaki-kutu strong { font-family: var(--display); font-size: 30px; line-height: 1; font-weight: 800; color: var(--cta); font-variant-numeric: tabular-nums; }
.siradaki-kutu small { display: block; margin-top: 3px; font-size: 13px; font-weight: 600; color: var(--muted); text-transform: none; letter-spacing: 0; }
@keyframes siradaki-nabiz { 50% { box-shadow: 0 0 0 7px rgba(196,81,29,0); } }

/* Hat kartı (minibüs): simge + KALKIŞ etiketi + güzergah, saatler ızgara, alt bilgi rozetleri */
.hat-kartlari { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 18px; align-items: start; }
.hat-kart { display: flex; flex-direction: column; gap: 14px; padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: #FFFFFF; box-shadow: 0 14px 34px -26px rgba(20,36,58,.5); }
.hat-kart__bas { display: flex; align-items: center; gap: 12px; }
.hat-kart__ikon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(135deg, #F08A4B, var(--cta)); color: #FFFFFF; }
.hat-kart__bas small { display: block; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--cta); }
.hat-kart__bas h3 { margin: 0; font-family: var(--display); font-size: 19px; line-height: 1.2; }
.hat-kart .chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(70px, 1fr)); gap: 8px; }
.hat-kart .chip { justify-content: center; min-height: 40px; padding: 0 6px; border-radius: 12px; font-variant-numeric: tabular-nums; }
.hat-kart__bilgi { display: flex; flex-wrap: wrap; gap: 8px; }
.hat-kart__bilgi span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 10px; background: var(--soft); font-size: 13px; font-weight: 700; color: var(--ink); }
.sefer-grubu { display: flex; flex-direction: column; gap: 10px; }

/* Çipler ve kartlar: yumuşak geçiş, üzerine gelince belirginleşir */
.chip { transition: background-color .15s, border-color .15s, color .15s; }
.chip:hover { border-color: var(--sea); background: var(--sea-tint); color: var(--sea-dark); }
.card, .esnaf-kart, .esnaf-kategori, .ferry, .compact { transition: box-shadow .2s, transform .2s, border-color .2s; }
.card:hover, .esnaf-kart:hover, .esnaf-kategori:hover, .compact:hover { border-color: #C6D6DB; box-shadow: 0 14px 32px -18px rgba(20,36,58,.45); transform: translateY(-2px); }
.ferry:hover { transform: translateY(-2px); box-shadow: 0 14px 32px -16px rgba(20,36,58,.5); }
.card__media { overflow: hidden; }
.card__media img { transition: transform .45s; }
.card:hover .card__media img { transform: scale(1.04); }
.esnaf-kart__ad a { color: var(--ink); text-decoration: none; }
.esnaf-kart__ad a:hover { color: var(--sea); }
.esnaf-kategori strong { color: var(--ink); }
.esnaf-kategori:hover strong { color: var(--sea); }

/* Sorgu kutusu: beyaz kart, üstte deniz rengi şerit */
.sefer-sorgu { background: #FFFFFF; border-color: #D3E1E6; box-shadow: inset 0 4px 0 var(--sea), 0 18px 40px -26px rgba(20,36,58,.45); }
.sefer-sorgu__alan > span { font-size: 13px; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.sefer-sorgu__alan select:focus, .sefer-sorgu__alan input:focus { border-color: var(--sea); box-shadow: 0 0 0 3px rgba(10,108,140,.15); outline: none; }
.sefer-sorgu__degistir { transition: background-color .15s, transform .25s; }
.sefer-sorgu__degistir:hover { background: var(--sea-tint); transform: rotate(180deg); }

/* Sefer ve fiyat tabloları: köşeleri yuvarlak, başlık satırı belirgin, satır vurgusu */
.sefer-tablosu, .price-table { border-collapse: separate; border-spacing: 0; background: #FFFFFF; box-shadow: 0 1px 2px rgba(20,36,58,.04); }
.sefer-tablosu thead th, .price-table thead th { background: var(--sea-tint); color: var(--sea-dark); font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.price-table > :first-child > tr:first-child > * { border-top: 0; }
.price-table thead th:not(:first-child) { text-align: right; }
.sefer-tablosu tbody tr, .price-table tbody tr { transition: background-color .15s; }
.sefer-tablosu tbody tr:hover, .price-table tbody tr:hover { background: var(--soft-2); }
.sefer-tablosu__saat { font-variant-numeric: tabular-nums; letter-spacing: -.01em; }

/* Saati geçen seferler soluk + "Kalktı" etiketi (üstü çizili DEĞİL, kullanıcı isteği 2026-10-28), sıradaki sefer vurgulu
   (layouts/site'daki betik, [data-sefer-gun] içinde) */
.sefer-tablosu tr.gecti td { color: #687B82; } /* gri ama okunur (≥4.5:1, PageSpeed kontrast) */
.sefer-tablosu tr.gecti .sefer-tablosu__saat { color: #74878E; }
.sefer-tablosu tr.gecti .sefer-tablosu__saat::after, .ulasim-kutu__liste li.gecti b::after, .sefer-aciklama .kalkti::after {
  content: "Kalktı"; display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 999px; background: #EEF3F5; color: #5B6E75;
  font: 700 11px/1.5 var(--body); letter-spacing: .02em; vertical-align: 3px; }
.sefer-tablosu tr.gecti a { color: inherit; }
.sefer-tablosu tr.siradaki td { background-color: #FFF3E8; }
.sefer-tablosu tr.siradaki td:first-child { box-shadow: inset 4px 0 0 var(--cta); }
.sefer-tablosu tr.siradaki .sefer-tablosu__saat { color: var(--cta); }
.sefer-tablosu tr.siradaki .sefer-tablosu__saat::after { content: "Sıradaki"; display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px;
  background: var(--cta); color: #FFFFFF; font: 800 11px/1.5 var(--body); letter-spacing: .03em; vertical-align: 3px; }
.chip.gecti { background: var(--soft); border-color: var(--line); color: #A9BAC0; opacity: .75; }
.chip.siradaki { background: var(--cta); border-color: var(--cta); color: #FFFFFF; box-shadow: 0 6px 16px -8px rgba(196,81,29,.8); }
.sefer-aciklama { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: 13px; color: var(--muted); }
.sefer-aciklama .kalkti { color: #9DB0B6; font-weight: 700; }
.sefer-aciklama .kalkti::after { margin-left: 4px; vertical-align: 1px; }
.sefer-aciklama .kalkti--chip { display: inline-block; padding: 1px 8px; border-radius: 8px; background: var(--soft); border: 1px solid var(--line); opacity: .75; }
.sefer-aciklama .kalkti--chip::after { content: none; }
.sefer-aciklama b { display: inline-block; padding: 1px 8px; border-radius: 999px; background: var(--cta); color: #FFFFFF; font-size: 11px; }

/* ---------- Sefer sayfaları: zaman çizelgesi görünümü (2026-10-28) ----------
   Saat sütununda dikey çizgi + nokta (sıradaki turuncu, kalkan gri), büyük saat; güzergahta kalkış → varış oku;
   firma adı renkli rozet (--firma-ton = firma slug'ından renk tonu); bilet fiyatları kutu kutu. Telefonda satırlar kart olur. */
.sefer-baslik { display: flex; align-items: center; gap: 10px; }
.sefer-baslik__ikon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 36px; height: 36px; border-radius: 11px;
  background: linear-gradient(135deg, #12849F, var(--sea)); color: #FFFFFF; box-shadow: 0 8px 18px -10px rgba(10,108,140,.8); }
.iskele-atla { gap: 8px; }
.iskele-atla .chip { min-height: 36px; font-size: 14px; font-weight: 700; }
.sefer-iskele { scroll-margin-top: 90px; }
.sefer-tablosu { box-shadow: 0 14px 34px -28px rgba(20,36,58,.55); }
.sefer-tablosu td { vertical-align: middle; }
.sefer-tablosu td.sefer-tablosu__saat { position: relative; padding-left: 44px; font-family: var(--display); font-size: 22px; line-height: 1.15;
  background-image: linear-gradient(#D5E5EA, #D5E5EA); background-repeat: no-repeat; background-position: 19px 0; background-size: 2px 100%; }
.sefer-tablosu td.sefer-tablosu__saat::before { content: ""; position: absolute; left: 14px; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%;
  background: #FFFFFF; border: 3px solid var(--sea); box-sizing: border-box; }
.sefer-tablosu tbody tr:first-child td.sefer-tablosu__saat { background-position: 19px 100%; background-size: 2px 50%; }
.sefer-tablosu tbody tr:last-child td.sefer-tablosu__saat { background-position: 19px 0; background-size: 2px 50%; }
.sefer-tablosu tbody tr:only-child td.sefer-tablosu__saat { background-image: none; }
.sefer-tablosu td.sefer-tablosu__saat small { font-family: var(--body); font-weight: 600; letter-spacing: 0; }
.sefer-tablosu tr.gecti td.sefer-tablosu__saat::before { border-color: #C3D2D7; background: #C3D2D7; }
.sefer-tablosu tr.siradaki td.sefer-tablosu__saat::before { border-color: var(--cta); background: var(--cta); box-shadow: 0 0 0 4px rgba(196,81,29,.2); }
.sefer-tablosu tr.bugun-yok td.sefer-tablosu__saat::before { border-style: dashed; }
.rota { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; font-weight: 700; color: var(--ink); }
.rota svg { flex: none; color: var(--cta); }
.sefer-tablosu tr.gecti .rota, .sefer-tablosu tr.gecti .rota svg { color: inherit; }
.firma-rozet { display: inline-flex; align-items: center; gap: 7px; min-height: 30px; padding: 0 11px; border-radius: 999px; font-size: 14px; font-weight: 800; text-decoration: none; white-space: nowrap;
  background: hsl(var(--firma-ton, 195) 65% 95%); color: hsl(var(--firma-ton, 195) 60% 28%); border: 1px solid hsl(var(--firma-ton, 195) 50% 85%); }
.firma-rozet::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: hsl(var(--firma-ton, 195) 65% 45%); }
.firma-rozet:hover { background: hsl(var(--firma-ton, 195) 65% 90%); }
.sefer-tablosu tr.gecti .firma-rozet { opacity: .65; }

/* Bilet fiyatları kutu kutu: ilk kutu (tam yolcu bileti) vurgulu */
.price-table.bilet-kutulari { display: block; border: 0; border-radius: 0; overflow: visible; background: none; box-shadow: none; }
.bilet-kutulari > tbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 10px; }
.bilet-kutulari tr { display: flex; flex-direction: column; justify-content: space-between; gap: 6px; padding: 14px 16px 14px 18px; border: 1px solid var(--line); border-radius: 16px; background: #FFFFFF;
  box-shadow: inset 4px 0 0 var(--sea-tint); }
.bilet-kutulari tr:hover { background: var(--soft-2); }
.price-table.bilet-kutulari th, .price-table.bilet-kutulari td { display: block; padding: 0; border: 0; text-align: left; }
.price-table.bilet-kutulari th { font-size: 14.5px; line-height: 1.3; }
.price-table.bilet-kutulari th .muted { display: block; font-size: 12.5px; }
.price-table.bilet-kutulari td { font-family: var(--display); font-size: 24px; line-height: 1.1; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.price-table.bilet-kutulari td.has-price { color: var(--cta); }
.bilet-kutulari tr:first-child { background: linear-gradient(160deg, #FFF3E8, #FFFFFF 70%); border-color: #F7D3B8; box-shadow: inset 4px 0 0 var(--cta); }
.prose .price-table.bilet-kutulari { max-width: none; }

@media (max-width: 640px) {
  /* Satırlar kart: solda büyük saat, sağda güzergah ve firma */
  .sefer-tablosu { display: block; border: 0; border-radius: 0; overflow: visible; background: none; box-shadow: none; }
  .sefer-tablosu thead { display: none; }
  .sefer-tablosu tbody { display: flex; flex-direction: column; gap: 8px; }
  .sefer-tablosu tbody tr { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 4px 14px; padding: 12px 14px 12px 12px;
    border: 1px solid var(--line); border-radius: 14px; background: #FFFFFF; }
  .sefer-tablosu td, .sefer-tablosu th { display: block; padding: 0; border: 0; }
  .sefer-tablosu td.sefer-tablosu__saat { grid-row: span 2; min-width: 82px; padding: 0 12px 0 22px; border-right: 1px dashed var(--line); background-image: none !important; font-size: 25px; }
  .sefer-tablosu td.sefer-tablosu__saat::before { left: 2px; width: 11px; height: 11px; margin-top: -5.5px; }
  .sefer-tablosu tr.siradaki .sefer-tablosu__saat::after, .sefer-tablosu tr.gecti .sefer-tablosu__saat::after { display: table; margin: 5px 0 0; vertical-align: 0; }
  .sefer-tablosu tbody tr.siradaki { background: #FFF3E8; border-color: #F7D3B8; box-shadow: inset 4px 0 0 var(--cta); }
  .sefer-tablosu tr.siradaki td { background-color: transparent; }
  .sefer-tablosu tr.siradaki td:first-child { box-shadow: none; }
  .sefer-tablosu tbody tr.gecti { background: var(--soft-2); }
  .sefer-tablosu td:nth-child(3) { font-size: 14px; color: var(--muted); }
  .firma-rozet { min-height: 28px; font-size: 13px; }
  .sefer-baslik__ikon { width: 32px; height: 32px; }
}
/* ---------- Tesis sayfası dokunuşları (2026-10-27) ---------- */
/* Başlık altı rozetler: konum, denize uzaklık, aracısız */
.tesis-rozetler { gap: 8px; align-items: center; font-weight: 700; }
.tesis-rozet { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 12px; border-radius: 999px; background: var(--soft); border: 1px solid var(--line); color: var(--ink); font-size: 14px; }
.tesis-rozet svg { color: var(--sea); }
.tesis-rozet--deniz { background: #E3F3F8; border-color: #BFE0EA; color: var(--sea-dark); }

/* Sezon fiyatları: ay takvim yaprağı gibi, fiyat büyük, bu ay vurgulu */
.fiyat-aylar th { display: flex; align-items: center; gap: 12px; }
.fiyat-aylar__ay { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; flex: none; width: 44px; height: 44px; border-radius: 12px;
  background: #FFFFFF; border: 1px solid var(--line); overflow: hidden; position: relative; }
.fiyat-aylar__ay::before { content: ""; position: absolute; inset: 0 0 auto; height: 12px; background: var(--sea); }
.fiyat-aylar__ay small { position: relative; margin-top: 10px; font-size: 13px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; color: var(--ink); }
.fiyat-aylar td.has-price { font-family: var(--display); font-size: 18px; color: var(--cta); }
.fiyat-aylar td small { font-family: var(--body); font-size: 12.5px; }
.fiyat-aylar tr.bu-ay { background: #FFF6EE; }
.fiyat-aylar tr.bu-ay th { box-shadow: inset 4px 0 0 var(--cta); }
.fiyat-aylar tr.bu-ay .fiyat-aylar__ay::before { background: var(--cta); }

/* Olanaklar: grup grup açık zeminli kutular, simgeler sıkı */
.olanak-gruplari { gap: 14px; }
.olanak-grubu { padding: 16px 18px; border-radius: 16px; background: var(--soft-2, #F6F9FA); border: 1px solid var(--line); }
.olanak-grubu > strong { font-size: 13px; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.olanak-grubu ul { gap: 6px; }
.olanak-grubu li { font-size: 14.5px; }
.olanak-grubu .olanak-ikon { background: #FFFFFF; }
@media (max-width: 640px) {
  .olanak-gruplari { grid-template-columns: 1fr; gap: 10px; }
  .olanak-grubu { padding: 12px 14px; }
  .olanak-grubu ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; }
  .olanak-grubu li { font-size: 14px; gap: 8px; }
  .olanak-grubu .olanak-ikon { width: 26px; height: 26px; }
}

/* Fotoğraflar: yüklenirken açık gri parıltı, üzerine gelince hafif büyüme */
/* Parıltı opaklıkla (ekran kartında çalışır; arka plan kaydırmalı hâli her karede yeniden çizim istiyordu, PageSpeed 2026-10-28) */
.thumbs a, .galeri > a { background: #E9F0F2; animation: foto-parilti 1.4s ease-in-out infinite; }
.thumbs a:has(img[data-yuklendi]), .galeri > a:has(img[data-yuklendi]) { animation: none; background: var(--soft); }
.thumbs img { transition: transform .4s ease, opacity .3s; }
.thumbs a:hover img { transform: scale(1.06); }
@keyframes foto-parilti { 50% { opacity: .55; } }

/* Bugünkü feribot seferleri kutusu (tesis sayfası yan sütunu): gelen/giden sekmesi, kısa liste (iç kaydırma YOK: fare/parmak
   kutunun üstündeyken sayfa kaymıyordu, 2026-10-28) + "Tüm seferler" düğmesi */
.ulasim-kutu { background: var(--soft); border: 0; gap: 12px; }
.ulasim-kutu__bas { display: flex; flex-direction: column; gap: 1px; }
.ulasim-kutu__bas small { font-size: 13px; }
.ulasim-kutu__sekmeler { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 12px; background: #FFFFFF; border: 1px solid var(--line); }
.ulasim-kutu__sekmeler button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 0 6px; border: 0; border-radius: 9px; background: none; color: var(--muted); font: inherit; font-size: 13.5px; font-weight: 800; cursor: pointer; }
.ulasim-kutu__sekmeler button span { min-width: 22px; padding: 1px 6px; border-radius: 999px; background: var(--soft); font-size: 12px; }
.ulasim-kutu__sekmeler button[aria-selected="true"] { background: var(--sea); color: #FFFFFF; }
.ulasim-kutu__sekmeler button[aria-selected="true"] span { background: rgba(255,255,255,.22); }
.ulasim-kutu__liste { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; border-radius: 12px; background: #FFFFFF; border: 1px solid var(--line); overflow: hidden; }
.ulasim-kutu__liste[hidden], .ulasim-kutu__liste li[hidden] { display: none; }
.ulasim-kutu__liste li:not([hidden]) ~ li:not([hidden]) { border-top: 1px solid var(--line); }
.ulasim-kutu__tumu { align-self: stretch; min-height: 40px; margin-top: -4px; border: 1px dashed #C6D6DB; border-radius: 10px; background: #FFFFFF; color: var(--sea-dark); font: inherit; font-size: 13.5px; font-weight: 800; cursor: pointer; }
.ulasim-kutu__tumu:hover { border-color: var(--sea); background: var(--sea-tint); }
.ulasim-kutu__tumu[hidden] { display: none; }
.ulasim-kutu__liste li { display: flex; align-items: flex-start; gap: 10px; padding: 9px 12px; font-size: 14px; line-height: 1.3; }
.ulasim-kutu__liste b { flex: none; width: 48px; font-size: 16px; font-weight: 800; color: var(--sea); font-variant-numeric: tabular-nums; }
.ulasim-kutu__liste span { display: flex; flex-direction: column; min-width: 0; font-weight: 700; }
.ulasim-kutu__liste small { font-weight: 600; font-size: 12.5px; color: var(--muted); }
.ulasim-kutu__liste li.gecti { background: var(--soft-2); }
.ulasim-kutu__liste li.gecti b, .ulasim-kutu__liste li.gecti span, .ulasim-kutu__liste li.gecti small { color: #687B82; }
.ulasim-kutu__liste li.gecti b::after { display: block; width: max-content; margin: 3px 0 0; font-size: 10px; padding: 1px 6px; }
.ulasim-kutu__liste li.siradaki { background: #FFF3E8; box-shadow: inset 4px 0 0 var(--cta); }
.ulasim-kutu__liste li.siradaki b { color: var(--cta); }
.ulasim-kutu__liste li.siradaki b::after { content: "Sıradaki"; display: block; margin-top: 3px; width: max-content; padding: 1px 6px; border-radius: 999px; background: var(--cta); color: #FFFFFF; font-size: 10px; letter-spacing: .02em; }
.ulasim-kutu__bos { color: var(--muted); font-weight: 600; }

/* Masaüstünde telefon numarasına tıklanınca: "kopyalandı" bildirimi (layouts/site betiği) */
.kopya-bildirim { position: fixed; left: 50%; bottom: 28px; z-index: 200; transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
  display: block; width: max-content; max-width: min(560px, calc(100% - 32px)); text-align: center; line-height: 1.45; padding: 14px 20px; border-radius: 14px; background: var(--ink); color: #FFFFFF;
  box-shadow: 0 18px 40px -12px rgba(0,0,0,.45); font-size: 15px; transition: opacity .2s, transform .2s; }
.kopya-bildirim.acik { opacity: 1; transform: translate(-50%, 0); }
.kopya-bildirim strong { color: #FFD0AE; font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) {
  .thumbs a, .galeri > a { animation: none; }
  .kopya-bildirim { transition: none; }
  .card, .esnaf-kart, .esnaf-kategori, .ferry, .compact, .card__media img, .sefer-sorgu__degistir { transition: none; transform: none !important; }
  .siradaki-kutu > span::before { animation: none; }
}
/* Taksi ve esnaf sayfaları: profil başlığı, bilgi kutuları, değerlendirme (2026-10-29) */
.profil-ust { display: flex; align-items: center; gap: 18px; }
.profil-avatar { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; flex: none; width: 84px; height: 84px; border-radius: 24px;
  background: linear-gradient(140deg, var(--a, #2BB673), var(--b, #12925A)); color: #FFFFFF; box-shadow: 0 14px 30px -14px rgba(0,0,0,.55); }
.profil-avatar small { margin-top: 2px; font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.profil-avatar--taksi { --a: #FFD43B; --b: #F2A900; color: #1F2328; }
.profil-avatar--kucuk { width: 44px; height: 44px; border-radius: 13px; box-shadow: 0 8px 18px -10px rgba(0,0,0,.45); }
.page-head .profil-ust .h1 { margin: 0; }
.profil-puan { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; padding: 6px 14px 6px 6px; border-radius: 999px;
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.3); color: #FFFFFF; text-decoration: none; font-size: 15px; }
.profil-puan:hover { background: rgba(255,255,255,.24); color: #FFFFFF; }
.profil-puan .puan-rozet { background: #FFFFFF; color: var(--sea); }
.profil-puan--bos { padding-left: 12px; }
.profil-puan--bos svg { color: #FFD43B; }
.kart-ust { display: flex; align-items: center; gap: 12px; }
.card__puan { text-decoration: none; }
.card__puan--bos { color: var(--sea); font-weight: 700; }
.card__puan--bos svg { color: #F2A900; }
.bilgi-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 12px; }
.bilgi-kutu { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; background: #FFFFFF; }
.bilgi-kutu__ikon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--soft); color: var(--sea); }
.bilgi-kutu > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bilgi-kutu small { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.bilgi-kutu strong { font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.bilgi-kutu strong a { color: var(--ink); }
.bilgi-kutu > div > a { font-size: 14px; font-weight: 700; color: var(--sea); }
.plaka { display: inline-block; align-self: flex-start; padding: 1px 10px; border: 2px solid #1F2328; border-left: 10px solid #1D4ED8; border-radius: 6px; background: #FFFFFF; font-family: ui-monospace, monospace; letter-spacing: .06em; }
.degerlendir-bandi { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; padding: 18px 20px; border-radius: 18px; background: linear-gradient(120deg, #FFF8DB, #FFFFFF); border: 1px solid #F5D77E; }
.degerlendir-bandi > .stack { flex: 1 1 320px; }
.degerlendir-bandi__ikon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 52px; height: 52px; border-radius: 16px; background: linear-gradient(140deg, #FFD43B, #F2A900); color: #1F2328; }
@media (max-width: 560px) {
  .profil-ust { gap: 14px; }
  .profil-avatar:not(.profil-avatar--kucuk) { width: 64px; height: 64px; border-radius: 18px; }
  .profil-avatar:not(.profil-avatar--kucuk) svg { width: 28px; height: 28px; }
}
.page-head .profil-ust .card__type { color: rgba(255,255,255,.82); }

/* Nöbetçi eczane (/avsa-nobetci-eczane, eczane kategorisi ve kartlar; 2026-10-30) */
.nobetci-kutu { display: grid; gap: 14px; padding: clamp(18px, 3vw, 26px); border-radius: 22px; background: linear-gradient(135deg, #E9F6EC, #FFFFFF 70%); border: 2px solid #3E9A55; box-shadow: 0 10px 30px rgba(45, 90, 51, .12); }
.nobetci-kutu__ust { display: flex; align-items: center; gap: 16px; }
.nobetci-kutu__liste, .ilac-listesi { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px 18px; }
.nobetci-kutu__liste li, .ilac-listesi li { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.nobetci-kutu__liste svg { color: #2D7A3E; flex: none; }
.ilac-listesi li { padding: 10px 12px; border-radius: 12px; background: var(--soft); }
.ilac-listesi svg { color: #2D7A3E; flex: none; }
.nobetci-rozet { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; padding: 5px 12px; border-radius: 999px; background: #2D7A3E; color: #fff; font-size: 13px; font-weight: 800; letter-spacing: .02em; }
.nobetci-rozet__nokta { width: 9px; height: 9px; border-radius: 50%; background: #9BF0AE; box-shadow: 0 0 0 0 rgba(155, 240, 174, .8); animation: nobetci-nabiz 1.8s infinite; }
@keyframes nobetci-nabiz { 70% { box-shadow: 0 0 0 9px rgba(155, 240, 174, 0); } 100% { box-shadow: 0 0 0 0 rgba(155, 240, 174, 0); } }
@media (prefers-reduced-motion: reduce) { .nobetci-rozet__nokta { animation: none; } }
.nobetci-rozet--kucuk { padding: 3px 9px; font-size: 12px; }
.esnaf-kart--nobetci { border-color: #3E9A55; box-shadow: 0 0 0 1px #3E9A55; }
.nobetci-bandi { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; padding: 16px 20px; border-radius: 18px; background: linear-gradient(120deg, #E9F6EC, #FFFFFF); border: 1px solid #9CD3A9; }
.nobetci-bandi > .stack { flex: 1 1 300px; }
.saglik-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
.saglik-kart { display: flex; gap: 14px; align-items: flex-start; padding: 18px; border-radius: 18px; background: #fff; border: 1px solid var(--line); }
.saglik-kart--acil { background: #FDECEC; border-color: #F2B8B8; }
.saglik-kart__buyuk { flex: none; font-family: var(--display); font-size: 40px; line-height: 1; color: #B42318; }

/* Deniz suyu sıcaklığı (/avsa-deniz-suyu-sicakligi, 2026-10-31). Tonlar sıcaklığa göre: 0 = 18° altı … 27 = 27°+ */
.deniz-ton--0 { --ton: #3B6FB6; --ton-acik: #E6EEF9; }
.deniz-ton--18 { --ton: #2F8FB8; --ton-acik: #E3F2F8; }
.deniz-ton--20 { --ton: #1C9C9C; --ton-acik: #E0F4F2; }
.deniz-ton--22 { --ton: #2E9A5E; --ton-acik: #E4F4EA; }
.deniz-ton--24 { --ton: #D08A16; --ton-acik: #FBF0DC; }
.deniz-ton--27 { --ton: #C4511D; --ton-acik: #FBE7DC; }
.deniz-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.deniz-kart { display: flex; flex-direction: column; gap: 4px; padding: 18px; border-radius: 18px; background: #FFFFFF; border: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.deniz-kart p { margin: 6px 0 0; font-size: 14px; }
.deniz-kart__ust { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.deniz-kart__derece { font-family: var(--display); font-size: 40px; line-height: 1.05; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.deniz-kart__durum { font-weight: 800; color: var(--sea-dark); }
.deniz-kart__not { font-size: 13px; color: var(--muted); }
.deniz-kart--ana { background: linear-gradient(135deg, var(--ton, var(--sea)), #0A6C8C); border: 0; color: #FFFFFF; box-shadow: 0 12px 30px rgba(10, 108, 140, .22); }
.deniz-kart--ana .deniz-kart__derece { font-size: 56px; }
.deniz-kart--ana .deniz-kart__ust, .deniz-kart--ana .deniz-kart__not { color: rgba(255,255,255,.82); }
.deniz-kart--ana .deniz-kart__durum { color: #FFFFFF; font-size: 18px; }
.deniz-kart--hava:hover { border-color: var(--sea); background: var(--sea-tint); }
.deniz-olcek { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; }
.deniz-olcek > div { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 10px; background: var(--ton-acik); border-top: 4px solid var(--ton); font-size: 13px; }
.deniz-olcek strong { font-variant-numeric: tabular-nums; }
.deniz-olcek > div.secili { background: var(--ton); color: #FFFFFF; box-shadow: 0 6px 16px rgba(20,36,58,.18); }
.deniz-cizelge { margin: 0; padding: 14px; border: 1px solid var(--line); border-radius: 18px; background: #FFFFFF; }
.deniz-cizelge svg { display: block; width: 100%; height: auto; }
.deniz-cizelge .izgara { stroke: var(--line); stroke-width: 1; }
.deniz-cizelge .eksen { fill: var(--muted); font-size: 12px; font-family: var(--body); }
.deniz-cizelge .eksen.bu-ay { fill: var(--sea-dark); font-weight: 800; }
.deniz-cizelge .esik { stroke: #2E9A5E; stroke-width: 1; stroke-dasharray: 4 4; }
.deniz-cizelge .esik-yazi { fill: #2D7A3E; font-size: 12px; font-weight: 700; font-family: var(--body); }
.deniz-cizelge .bant { fill: var(--sea); opacity: .14; }
.deniz-cizelge .ortalama { fill: none; stroke: var(--sea-dark); stroke-width: 3; stroke-linejoin: round; }
.deniz-cizelge .bu-yil { fill: none; stroke: var(--cta); stroke-width: 2; stroke-dasharray: 5 4; }
.deniz-cizelge .bu-yil-nokta { fill: var(--cta); }
.deniz-cizelge .bugun { fill: #FFFFFF; stroke: var(--cta); stroke-width: 3; }
.deniz-lejant { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 8px; font-size: 13px; color: var(--muted); }
.deniz-lejant span { display: inline-flex; align-items: center; gap: 6px; }
.deniz-lejant i { display: inline-block; width: 18px; height: 10px; border-radius: 3px; }
.deniz-lejant .lejant-ortalama { height: 3px; background: var(--sea-dark); }
.deniz-lejant .lejant-bant { background: var(--sea); opacity: .2; }
.deniz-lejant .lejant-bu-yil { height: 0; border-top: 2px dashed var(--cta); border-radius: 0; }
.deniz-lejant .lejant-bugun { width: 10px; height: 10px; border-radius: 50%; border: 3px solid var(--cta); background: #FFFFFF; }
.deniz-aylar { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.deniz-ay { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 14px; background: var(--ton-acik); border-left: 4px solid var(--ton); }
.deniz-ay strong { font-family: var(--display); font-size: 24px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.deniz-ay__ad { font-weight: 800; }
.deniz-ay__ad small { margin-left: 4px; padding: 1px 7px; border-radius: 999px; background: var(--ton); color: #FFFFFF; font-size: 11px; vertical-align: 1px; }
.deniz-ay__aralik, .deniz-ay__ek { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.deniz-ay__durum { font-size: 13px; font-weight: 700; color: var(--ton); filter: brightness(.8); }
.deniz-ay--bu { box-shadow: 0 0 0 2px var(--ton); }
.deniz-tablo td, .deniz-tablo th { white-space: nowrap; font-variant-numeric: tabular-nums; }
.deniz-gunler { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; }
.deniz-gun { flex: 1 0 58px; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px; border-radius: 12px; background: var(--ton-acik); font-size: 12px; color: var(--muted); }
.deniz-gun strong { color: var(--ink); font-size: 15px; font-variant-numeric: tabular-nums; }
.deniz-gun__cubuk { display: flex; align-items: flex-end; width: 12px; height: 60px; border-radius: 6px; background: rgba(255,255,255,.7); }
.deniz-gun__cubuk i { display: block; width: 100%; border-radius: 6px; background: var(--ton); }
.deniz-karsilastirma { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.deniz-karsilastirma li { display: grid; grid-template-columns: minmax(110px, 170px) 1fr 64px; align-items: center; gap: 12px; padding: 6px 10px; border-radius: 10px; }
.deniz-karsilastirma li.avsa { background: var(--sea-tint); font-weight: 800; }
.deniz-karsilastirma small { padding: 1px 6px; border-radius: 999px; background: var(--sea); color: #FFFFFF; font-size: 11px; }
.deniz-karsilastirma strong { text-align: right; font-variant-numeric: tabular-nums; }
.deniz-karsilastirma__cubuk { height: 10px; border-radius: 6px; background: var(--soft); overflow: hidden; }
.deniz-karsilastirma__cubuk i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, #3B6FB6, #1C9C9C); }
.deniz-karsilastirma li.avsa .deniz-karsilastirma__cubuk i { background: var(--cta); }
.deniz-bolge { border: 1px solid var(--line); border-radius: 16px; background: #FFFFFF; overflow: hidden; }
.deniz-bolge > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; padding: 14px 18px; cursor: pointer; list-style: none; }
.deniz-bolge > summary::-webkit-details-marker { display: none; }
.deniz-bolge > summary::after { content: "▾"; margin-left: auto; color: var(--sea); }
.deniz-bolge[open] > summary::after { content: "▴"; }
.deniz-bolge > summary span { font-weight: 700; color: var(--sea-dark); font-variant-numeric: tabular-nums; }
.deniz-bolge > summary small { color: var(--muted); }
.deniz-bolge .price-table { border: 0; border-top: 1px solid var(--line); border-radius: 0; }
.deniz-ipuclari { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.deniz-ipucu { display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 16px; background: var(--soft); }
.deniz-ipucu p { margin: 0; font-size: 14px; flex: 1; }
.deniz-ipucu a { font-weight: 800; color: var(--sea); }
.deniz-ipucu--acil { background: #FDECEC; }
.deniz-ipucu--acil a { color: #B42318; }
@media (max-width: 640px) {
  .deniz-kart--ana .deniz-kart__derece { font-size: 46px; }
  .deniz-olcek { grid-template-columns: repeat(3, 1fr); }
  .deniz-aylar { grid-template-columns: repeat(2, 1fr); }
  .deniz-karsilastirma li { grid-template-columns: 104px 1fr 58px; gap: 8px; padding: 6px; font-size: 14px; }
  .deniz-cizelge { padding: 8px; }
  .deniz-cizelge .eksen { font-size: 22px; } /* çizelge telefonda yarı boyuta küçülüyor */
  .deniz-cizelge .esik-yazi { font-size: 20px; }
}
/* Koy koy deniz durumu (deniz suyu sayfası, partials/deniz-koylar; 2026-10-31) */
.koy--sakin { --koy: #2E8B57; --koy-acik: #E4F4EA; }
.koy--hafif { --koy: #B8860B; --koy-acik: #FBF3DA; }
.koy--dalgali { --koy: #D2691E; --koy-acik: #FCEBDD; }
.koy--tehlike { --koy: #C0392B; --koy-acik: #FBE3E0; }
#koylar [data-zaman]:not(.aktif) { display: none; }
.koy-saatler { display: flex; flex-wrap: wrap; gap: 8px; }
.koy-saatler .chip { cursor: pointer; font-family: inherit; }
.koy-saatler .chip.aktif { background: var(--sea); border-color: var(--sea); color: #FFFFFF; }
.koy-ozet { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1px; border-radius: 16px; overflow: hidden; background: var(--line); border: 1px solid var(--line); }
.koy-ozet > div { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; background: #FFFFFF; }
.koy-ozet span { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.koy-ozet strong { font-size: 16px; }
.koy-harita { margin: 0; display: grid; gap: 8px; }
.koy-harita__kaydir { overflow-x: auto; border-radius: 18px; border: 1px solid var(--line); background: #CFE8F1; }
.koy-harita svg { display: block; width: 100%; max-width: 680px; height: auto; margin: 0 auto; }
.koy-harita .deniz { fill: #CFE8F1; }
.koy-harita .ada { fill: #F3EBD3; stroke: #B9A777; stroke-width: 1.5; }
.koy-harita .diger-ada { fill: #E7E1CC; stroke: #C9BC94; stroke-width: 1; }
.koy-harita .yerlesim { fill: #6B5B32; font: 800 17px var(--body); letter-spacing: .12em; }
.koy-harita .deniz-adi { fill: #4F8DA3; font: 800 18px var(--body); letter-spacing: .3em; }
.koy-harita .koy-adi { fill: var(--ink); font: 700 16px var(--body); paint-order: stroke; stroke: #CFE8F1; stroke-width: 5px; stroke-linejoin: round; }
.koy-isaret circle { fill: var(--koy); stroke: #FFFFFF; stroke-width: 3; }
.koy-isaret text { fill: #FFFFFF; font: 800 16px var(--body); }
.koy-isaret:hover circle, .koy-isaret:focus circle { stroke: var(--ink); }
.koy-harita .pusula circle { fill: rgba(255,255,255,.85); stroke: var(--sea); stroke-width: 2; }
.koy-harita .pusula text { fill: var(--sea-dark); font: 800 14px var(--body); }
.koy-harita .pusula path { fill: var(--cta); }
.koy-harita .pusula .pusula__yazi { fill: var(--ink); font-size: 15px; paint-order: stroke; stroke: #CFE8F1; stroke-width: 5px; }
.koy-lejant { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--muted); }
.koy-lejant span { display: inline-flex; align-items: center; gap: 6px; }
.koy-lejant i { width: 12px; height: 12px; border-radius: 50%; background: var(--koy); }
.koy-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.koy-kart { display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 16px; background: #FFFFFF; border: 1px solid var(--line); border-top: 4px solid var(--koy); scroll-margin-top: 90px; }
.koy-kart:target { box-shadow: 0 0 0 3px var(--koy); }
.koy-kart__ust { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.koy-kart__ust a { color: var(--ink); }
.koy-rozet { flex: none; padding: 2px 9px; border-radius: 999px; background: var(--koy-acik); color: var(--koy); font-size: 12px; font-weight: 800; filter: brightness(.85); }
.koy-kart p { margin: 0; font-size: 13px; color: var(--muted); }
.koy-kart dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 4px 0 0; }
.koy-kart dt { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.koy-kart dd { margin: 0; font-weight: 800; font-variant-numeric: tabular-nums; }
.koy-ok { display: inline-block; margin-right: 3px; color: var(--sea); }
.koy-kart__not { font-size: 12px !important; }
@media (max-width: 640px) {
  .koy-harita svg { width: 560px; max-width: none; } /* telefonda yazılar okunsun: harita yana kayar */
}
/* Bilet fiyatları: güncel + gelecek yaz (beklenen) üç sütun; telefonda dar boşluk (2026-10-31) */
@media (max-width: 560px) { .price-table thead ~ tbody th, .price-table thead ~ tbody td, .price-table thead th { padding: 12px 10px; } }

/* Plaj rehberi (/ada-rehberi/avsa-adasi-plajlari, yazilar/plajlar, 2026-11-01): süzgeç, ada haritası, plaj kartları */
.plaj-rehberi { display: grid; gap: 22px; }
.plaj-arac { display: grid; gap: 10px; padding: 16px; border-radius: 20px; background: var(--sea-tint); border: 1px solid #CFE3EA; }
.plaj-ara { display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; border: 1.5px solid var(--input); }
.plaj-ara:focus-within { border-color: var(--sea); box-shadow: 0 0 0 3px rgba(10,108,140,.18); }
.plaj-ara svg { flex: none; width: 20px; height: 20px; fill: none; stroke: var(--sea); stroke-width: 2.4; stroke-linecap: round; }
.plaj-ara input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: 600 16px var(--body); color: var(--ink); }
.plaj-suzgec { display: flex; flex-wrap: wrap; gap: 8px; }
.plaj-suzgec .chip { min-height: 38px; padding: 0 14px; cursor: pointer; font-family: var(--body); }
.plaj-suzgec .chip[aria-pressed="true"] { background: var(--sea); border-color: var(--sea); color: #FFFFFF; }
.plaj-sayi { display: inline-grid; place-items: center; min-width: 22px; height: 22px; margin-left: 6px; padding: 0 6px; border-radius: 999px; background: var(--sea-tint); color: var(--sea-dark); font-size: 12px; }
.chip[aria-pressed="true"] .plaj-sayi { background: rgba(255,255,255,.22); color: #FFFFFF; }
.plaj-sonuc { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: 14px; font-weight: 800; color: var(--sea-dark); }
.plaj-temizle { padding: 0; border: 0; background: none; color: var(--cta); font: 800 14px var(--body); text-decoration: underline; cursor: pointer; }
.plaj-temizle[hidden] { display: none; }
.plaj-duzen { display: grid; grid-template-columns: minmax(300px, 400px) 1fr; gap: 22px; align-items: start; }
.plaj-harita { position: sticky; top: 84px; }
.plaj-harita figcaption { font-size: 13px; }
.plaj-isaret { cursor: pointer; }
.plaj-isaret circle { fill: var(--cta); stroke: #FFFFFF; stroke-width: 3; transition: fill .15s; }
.plaj-isaret text { fill: #FFFFFF; font: 800 17px var(--body); pointer-events: none; }
.plaj-isaret:hover circle, .plaj-isaret:focus circle { fill: var(--sea-dark); }
.plaj-isaret.soluk { opacity: .22; }
.plaj-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 14px; }
.plaj-kart { display: flex; flex-direction: column; overflow: hidden; border-radius: 20px; background: #FFFFFF; border: 1px solid var(--line); box-shadow: 0 10px 30px -24px rgba(20,36,58,.5); scroll-margin-top: 90px; transition: box-shadow .2s; }
.plaj-kart[hidden] { display: none; }
.plaj-kart.secili, .plaj-kart:target { box-shadow: 0 0 0 3px var(--cta), 0 14px 34px -20px rgba(20,36,58,.5); }
.plaj-kart__gorsel { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #0A6C8C, #2FA3B9 60%, #9ED8D8); }
.plaj-kart__gorsel img { display: block; width: 100%; height: 100%; object-fit: cover; }
.plaj-kart__gorsel--bos { aspect-ratio: 16 / 5; }
.plaj-kart__gorsel--bos::after { content: ""; position: absolute; inset: auto 0 0; height: 18px; opacity: .5;
  background: radial-gradient(circle at 10px -4px, transparent 12px, #FFFFFF 13px) 0 0 / 20px 18px repeat-x; }
.plaj-no { position: absolute; top: 10px; left: 10px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--cta); color: #FFFFFF; font-weight: 800; border: 2px solid #FFFFFF; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.plaj-deniz { position: absolute; top: 12px; right: 10px; }
.plaj-deniz .koy-rozet { display: inline-block; padding: 4px 10px; background: #FFFFFF; filter: none; box-shadow: 0 2px 8px rgba(0,0,0,.2); }
.plaj-kart__govde { display: flex; flex: 1; flex-direction: column; gap: 8px; padding: 14px 16px 16px; }
.plaj-kart__baslik { margin: 0; font-family: var(--display); font-size: 21px; line-height: 1.15; font-weight: 800; }
.plaj-etiketler { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 0; font-size: 13px; font-weight: 700; color: var(--sea-dark); }
.plaj-etiketler span + span::before { content: "·"; margin-right: 10px; color: var(--input); }
.plaj-kart__ozet { margin: 0; font-size: 15px; }
.plaj-ozellikler { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.plaj-ozellikler li { padding: 3px 9px; border-radius: 999px; background: var(--soft); font-size: 12px; font-weight: 700; color: var(--muted); }
.plaj-ozellikler li[data-ozellik-adi="sig"] { background: #E4F4EA; color: #2D5A33; }
.plaj-ozellikler li[data-ozellik-adi="sakin"], .plaj-ozellikler li[data-ozellik-adi="dogal"] { background: #EEF2E3; color: #4E5B2A; }
.plaj-ozellikler li[data-ozellik-adi="tarih"] { background: #F4E9E1; color: #7A3E1A; }
.plaj-ozellikler li[data-ozellik-adi="gun_batimi"] { background: #FFF1E3; color: #9A4A14; }
.plaj-ulasim { margin: 0; font-size: 14px; }
.plaj-detay > summary { cursor: pointer; font-weight: 800; color: var(--sea); list-style: none; }
.plaj-detay > summary::-webkit-details-marker { display: none; }
.plaj-detay > summary::after { content: " ▾"; }
.plaj-detay[open] > summary::after { content: " ▴"; }
.plaj-detay .prose { margin-top: 8px; font-size: 15px; }
.plaj-baglantilar { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: auto 0 0; padding-top: 6px; border-top: 1px solid var(--line); font-size: 14px; font-weight: 800; }
.plaj-baglantilar a { text-decoration: none; }
.plaj-bos { grid-column: 1 / -1; margin: 0; padding: 24px; border-radius: 16px; background: var(--soft); text-align: center; font-weight: 700; }
.plaj-bos[hidden] { display: none; }
.plaj-digerleri { display: grid; gap: 10px; padding: 18px; border-radius: 20px; border: 1px dashed var(--input); }
.plaj-digerleri p { margin: 0; }
.plaj-adlar { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.plaj-adlar li { padding: 6px 12px; border-radius: 999px; background: var(--soft); font-size: 14px; font-weight: 700; }
.plaj-adlar li.bulundu { background: var(--cta); color: #FFFFFF; }
.plaj-sorular .katla { padding: 12px 16px; border-radius: 14px; background: #FFFFFF; border: 1px solid var(--line); }
.plaj-sorular .katla p { margin: 0; }
@media (max-width: 900px) {
  .plaj-duzen { grid-template-columns: 1fr; }
  .plaj-harita { position: static; }
  .plaj-harita svg { width: 100%; max-width: 460px; }
  .plaj-harita .koy-harita__kaydir { overflow: hidden; }
  .plaj-isaret circle { r: 26px; }
  .plaj-isaret text { font-size: 23px; }
  .plaj-harita .yerlesim { font-size: 26px; }
}
@media (max-width: 560px) {
  .plaj-arac { padding: 12px; border-radius: 16px; }
  .plaj-suzgec { flex-wrap: nowrap; overflow-x: auto; margin: 0 -12px; padding: 0 12px 2px; scrollbar-width: none; }
  .plaj-suzgec .chip { flex: none; }
  .plaj-kartlar { grid-template-columns: 1fr; }
}

/* ====================================================================================
   erdek.com görünümü (2026-11): açılış, rakam şeridi, köy kartları, rehber mozaiği,
   üst menü ve alt bilgi. Önceki kurallardan sonra gelir, aynı sınıfları ezer.
   ==================================================================================== */
:root { --olive: #6E7B3B; --sand: #F3E9D7; --gece: #0E2A44; }
body { background: var(--soft-2); }

/* Üst menü: yarı saydam, bulanık zemin */
.site-header { background: rgba(251,248,243,.88); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom-color: rgba(20,36,58,.08); }
.logo__mark { background: linear-gradient(140deg, #1F6E94, var(--gece)); color: #FFE3A8; box-shadow: 0 4px 12px rgba(14,42,68,.25); }
.logo__text span { color: var(--cta); }
.main-nav a { position: relative; padding: 6px 0; }
.main-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; border-radius: 2px; background: var(--cta); transform: scaleX(0); transition: transform .2s ease; }
.main-nav a:hover::after, .main-nav a[aria-current]::after { transform: scaleX(1); }
.main-nav a:hover, .main-nav a[aria-current] { color: var(--ink); }

/* Açılış */
.acilis { position: relative; overflow: hidden; color: #FFFFFF; background: var(--gece); min-height: min(86vh, 720px); display: flex; align-items: center; }
.acilis__foto, .acilis__cizim { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.acilis--foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,42,68,.55), rgba(14,42,68,.25) 45%, rgba(14,42,68,.7)); }
.acilis__dalga { animation: dalga 9s ease-in-out infinite alternate; }
.acilis__dalga--2 { animation-duration: 7s; animation-direction: alternate-reverse; }
@keyframes dalga { from { transform: translateX(-24px); } to { transform: translateX(24px); } }
.acilis__ic { position: relative; z-index: 1; width: 100%; padding: 72px var(--gutter) 96px; display: flex; flex-direction: column; gap: 18px; }
.acilis__ust { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-weight: 700; font-size: 14px; letter-spacing: .04em; text-transform: uppercase; color: #FFE3A8; }
.acilis__baslik { margin: 0; max-width: 820px; font-family: var(--display); font-weight: 800; font-size: clamp(34px, 6vw, 66px); line-height: 1.02; letter-spacing: -0.03em; text-wrap: balance; text-shadow: 0 2px 24px rgba(0,0,0,.25); }
.acilis__slogan { margin: 0; max-width: 620px; font-size: clamp(16px, 2vw, 19px); color: rgba(255,255,255,.88); }
.acilis__slogan strong { color: #FFFFFF; }
.acilis__arama { display: flex; align-items: center; gap: 10px; max-width: 640px; margin-top: 8px; padding: 8px 8px 8px 18px; border-radius: 999px; background: #FFFFFF; color: var(--muted); box-shadow: 0 18px 40px rgba(0,0,0,.25); }
.acilis__arama input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 16px; color: var(--ink); padding: 10px 0; }
.acilis__arama .btn { border-radius: 999px; padding-inline: 26px; }
.acilis__turler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; max-width: 760px; margin-top: 10px; }
.tur-kutu { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; text-decoration: none; color: #FFFFFF; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: background .2s, transform .2s; }
.tur-kutu:hover { color: #FFFFFF; background: rgba(255,255,255,.22); transform: translateY(-2px); }
.tur-kutu__simge { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: #FFE3A8; color: var(--gece); }
.tur-kutu--pansiyon .tur-kutu__simge { background: #CFE3B4; }
.tur-kutu--apart .tur-kutu__simge { background: #BFE0EE; }
.tur-kutu--motel .tur-kutu__simge { background: #F4C7B0; }
.tur-kutu strong { display: block; font-size: 16px; }
.tur-kutu small { display: block; font-size: 13px; color: rgba(255,255,255,.75); }
.acilis__hizli { display: flex; gap: 8px; flex-wrap: wrap; }
.acilis .chip--cam { background: rgba(255,255,255,.92); color: var(--ink); border-color: transparent; }

/* Rakam şeridi + hava */
.seritler { position: relative; z-index: 2; margin-top: -44px; padding: 0 var(--gutter); }
.seritler__ic { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; border-radius: 20px; background: #FFFFFF; box-shadow: 0 18px 40px rgba(20,36,58,.12); }
.rakamlar { display: flex; flex-wrap: wrap; gap: 8px 36px; margin: 0; padding: 0; list-style: none; align-items: center; }
.rakamlar li { display: flex; align-items: baseline; gap: 8px; }
.rakamlar strong { font-family: var(--display); font-size: 30px; font-weight: 800; color: var(--sea); letter-spacing: -0.02em; }
.rakamlar span { color: var(--muted); font-weight: 600; }
.seritler .hava-kutulari { margin: 0; }

/* Bölüm başlığı */
.bolum-baslik { display: flex; flex-direction: column; gap: 4px; }
.bolum-baslik__ust { font-weight: 800; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--cta); }
.bag-ok { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; text-decoration: none; }

/* Köy kartları (yana kayar) */
.koyler-bolum { background: linear-gradient(180deg, var(--sand), var(--soft-2)); }
.koy-seridi { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 240px); gap: 14px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.koy-kart { position: relative; display: block; aspect-ratio: 3 / 4; border-radius: 18px; overflow: hidden; scroll-snap-align: start; color: #FFFFFF; text-decoration: none; background: var(--tint-1); box-shadow: 0 8px 22px rgba(20,36,58,.12); }
.koy-kart img, .koy-kart .ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.koy-kart::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(14,42,68,.85)); }
.koy-kart:hover img { transform: scale(1.06); }
.koy-kart__ad { position: absolute; z-index: 1; left: 14px; right: 14px; bottom: 14px; font-family: var(--display); font-weight: 800; font-size: 20px; line-height: 1.1; }
.koy-kart:hover { color: #FFFFFF; }

/* Rehber mozaiği */
.rehber-mozaik { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); grid-auto-rows: 170px; gap: 14px; }
.rehber-mozaik > :first-child { grid-row: span 2; grid-column: span 2; }
.rehber-kutu { position: relative; overflow: hidden; border-radius: 18px; color: #FFFFFF; text-decoration: none; background: var(--gece); }
.rehber-kutu img, .rehber-kutu .ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.rehber-kutu::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, transparent 30%, rgba(14,42,68,.82)); }
.rehber-kutu:hover img { transform: scale(1.05); }
.rehber-kutu:hover { color: #FFFFFF; }
.rehber-kutu__yazi { position: absolute; z-index: 1; left: 16px; bottom: 14px; right: 16px; display: flex; flex-direction: column; }
.rehber-kutu__yazi strong { font-family: var(--display); font-size: 22px; font-weight: 800; line-height: 1.1; }
.rehber-kutu__yazi small { color: rgba(255,255,255,.8); font-weight: 600; }
.rehber-kutu--hava { background: linear-gradient(140deg, #F6B35E, var(--cta)); }
.rehber-kutu--hava::after { display: none; }
.rehber-kutu__simge { position: absolute; top: 16px; left: 16px; color: #FFFFFF; }

/* Kartlar: yumuşak gölge, üzerine gelince yükselir */
.card { border-radius: 18px; background: #FFFFFF; transition: transform .2s ease, box-shadow .2s ease; }
.card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(20,36,58,.12); }
.owner-cta { background: linear-gradient(140deg, var(--gece), #1F5878); color: #FFFFFF; }
.owner-cta p { color: rgba(255,255,255,.82); }

/* Kaydırınca belirme (layouts/site betiği; betik yoksa her şey görünür) */
.belir-hazir [data-belir] { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.belir-hazir [data-belir].belirdi { opacity: 1; transform: none; }

/* Alt bilgi: gece mavisi, üstte dalga */
.site-footer { position: relative; margin-top: 48px; background: var(--gece); padding-top: 64px; }
.site-footer__dalga { position: absolute; left: 0; top: -47px; width: 100%; height: 48px; color: var(--gece); }
.footer-tanitim { flex: 1 1 260px; display: flex; flex-direction: column; gap: 12px; }
.footer-tanitim p { margin: 0; max-width: 320px; color: #B7C3D3; }
.site-footer .logo__text span { color: #F6B35E; }
.footer-bottom__baglantilar { display: flex; flex-wrap: wrap; gap: 18px; }
.alt__imza { margin: 18px 0 0; font-size: 13px; color: #8FA0B6; text-align: center; }
.site-footer .alt__imza a { color: #D5DEE9; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 760px) {
  .acilis { min-height: auto; }
  .acilis__ic { padding-top: 44px; padding-bottom: 80px; gap: 14px; }
  .acilis__turler { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .tur-kutu { padding: 10px; gap: 10px; }
  .tur-kutu__simge { width: 36px; height: 36px; }
  .acilis__hizli { flex-wrap: nowrap; overflow-x: auto; }
  .acilis__arama { padding-left: 14px; }
  .acilis__arama .btn { padding-inline: 16px; }
  .rakamlar strong { font-size: 24px; }
  .rehber-mozaik { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 140px; }
  .rehber-mozaik > :first-child { grid-column: span 2; grid-row: span 1; }
}
@media (prefers-reduced-motion: reduce) { .acilis__dalga { animation: none; } }

/* Yazı sayfası başlığı: kapak fotoğrafı tam genişlik, üstünde başlık (yazilar/detay) */
.yazi-bas { position: relative; overflow: hidden; background: linear-gradient(140deg, var(--gece), #1F5878); color: #FFFFFF; }
.yazi-bas--foto { min-height: clamp(260px, 46vh, 440px); display: flex; align-items: flex-end; }
.yazi-bas__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.yazi-bas--foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,42,68,.15), rgba(14,42,68,.85)); }
.yazi-bas__ic { position: relative; z-index: 1; width: 100%; padding: 48px var(--gutter) 32px; display: flex; flex-direction: column; gap: 10px; }
.yazi-bas .breadcrumb, .yazi-bas .breadcrumb a { color: rgba(255,255,255,.85); }
.yazi-bas__baslik { margin: 0; max-width: 900px; font-family: var(--display); font-weight: 800; font-size: clamp(30px, 5vw, 54px); line-height: 1.05; letter-spacing: -0.02em; text-shadow: 0 2px 18px rgba(0,0,0,.3); }
.yazi-bas__ozet { margin: 0; max-width: 720px; font-size: 18px; color: rgba(255,255,255,.88); }
.prose img { border-radius: 14px; height: auto; }
.rehber-mozaik--duz > :first-child { grid-row: auto; grid-column: auto; }
.konaklama-cagri { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 22px 24px; border-radius: 20px; background: var(--sand); color: var(--ink); text-decoration: none; }
.konaklama-cagri:hover { color: var(--ink); }
.konaklama-cagri strong { display: block; font-family: var(--display); font-size: 20px; }