:root{--navy:#081830;--blue:#0647bc;--line:#dbe3ef;--light:#f4f7fc;--black:#060e1e}
*{box-sizing:border-box}body{margin:0;color:var(--navy);background:#fff;font:16px/1.55 Arial,sans-serif}a{color:var(--blue)}img{max-width:100%;display:block}button{font:inherit;cursor:pointer}h1,h2,h3{line-height:1.12;margin:0 0 .65em}h1,h2{font-family:Georgia,serif}h2{font-size:clamp(1.6rem,3.2vw,2.4rem)}.wrap{width:min(1180px,calc(100% - 40px));margin:auto}.bar,.foot{display:flex;align-items:center;justify-content:space-between;gap:24px}.bar{min-height:76px}.logo{width:220px}.top nav,.foot nav{display:flex;gap:22px;flex-wrap:wrap}.top a,.foot a{text-decoration:none;color:inherit}.top nav a{font-weight:700}.top nav a:hover,.top nav a[aria-current]{color:var(--blue)}.toggle{display:none}.hero{color:white;min-height:clamp(400px,45vw,640px);display:grid;align-items:center;background:linear-gradient(90deg,#060e1e 0%,#060e1eaa 40%,transparent 75%),url('0.webp') right center/auto 100% no-repeat,var(--black)}.hero h1,.page-title h1{font-size:clamp(2.75rem,6vw,5.75rem)}.button{display:inline-block;border-radius:30px;background:var(--blue);color:white;padding:12px 23px;text-decoration:none;font-weight:700}.button:hover{background:#003898}.section{padding-block:32px}.section>h2,.center{text-align:center}.quick,.mosaic,.grid{display:grid;gap:16px}.quick{grid-template-columns:repeat(6,1fr)}.quick a{display:grid;justify-items:center;text-align:center;align-content:center;min-height:100px;padding:12px;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:var(--navy);font-weight:700}.quick span{font-size:26px;color:var(--blue)}.mosaic{grid-template-columns:repeat(12,1fr)}.photo{grid-column:span 3;position:relative;overflow:hidden;border-radius:18px;min-height:170px;color:white}.photo:first-child{grid-column:span 7}.photo:nth-child(2){grid-column:span 5}.photo img{width:100%;height:100%;position:absolute;object-fit:cover}.photo::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 38%,#060e1edb)}.photo strong{position:absolute;z-index:1;left:18px;bottom:14px;font-size:1.3rem}.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.card{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff}.card img{width:100%;height:165px;object-fit:cover}.card>div{padding:20px}.card p:last-child{margin-bottom:0}.review-bg{background:var(--light)}.carousel{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 32px)/3);overflow-x:auto;gap:16px;scroll-snap-type:x mandatory}.carousel .card{scroll-snap-align:start}.arrow,details,.toggle{border:1px solid var(--line);border-radius:10px;padding:10px 15px;background:white;color:var(--navy)}details{margin-bottom:8px}summary{cursor:pointer;font-weight:700}footer,.page-title{background:var(--black);color:white;padding:32px 0}.page-title h1{margin:0}.foot>a{font:bold 1.3rem Georgia,serif}
@media(max-width:790px){.bar{flex-wrap:wrap;gap:8px}.toggle{display:block}.top nav{display:none;width:100%;padding-bottom:16px}.top nav.open{display:flex}.quick{grid-template-columns:repeat(3,1fr)}.mosaic{grid-template-columns:repeat(2,1fr)}.photo,.photo:first-child,.photo:nth-child(2){grid-column:auto}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foot{align-items:flex-start;flex-direction:column}.carousel{grid-auto-columns:75%}}
@media(max-width:480px){.wrap{width:calc(100% - 28px)}.logo{width:175px}.grid{grid-template-columns:1fr}.photo{min-height:135px}.hero{background-size:cover;background-position:60% center}.carousel{grid-auto-columns:90%}}

/* Ana sayfa */
body { font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; }
h1, h2, h3, .foot > a { font-family: inherit; }
h1, h2, h3 { line-height: 1.22; }
h2 { margin-bottom: .85em; }
.hero {
  background-size: cover;
  background-position: center, center 57%;
}
.hero h1 { font-size: clamp(2.45rem, 4.9vw, 5.1rem); line-height: 1.14; margin-bottom: .52em; }
.menu-grid { align-items: start; }
.menu-card { box-shadow: 0 8px 24px #0818300a; }
.menu-card ul { padding-left: 1.15rem; margin-bottom: 0; }
.menu-card li { margin-block: .35rem; }
.menu-card li::marker { color: var(--blue); }
.review-bg h2 { text-align: left; }
.review-panel { padding: clamp(12px, 2vw, 24px); border: 1px solid var(--line); border-radius: 24px; background: white; }
.review-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; padding: 16px; background: var(--light); border-radius: 12px; }
.review-panel .carousel { margin-top: 16px; }
.review-panel .card { background: var(--light); }
.review-date { font-size: .875rem; color: #47556a; }
.review-stars { color: #8c5c00; }
.review-panel .review-photo { margin-top: 12px; height: auto; border-radius: 8px; }
.review-controls { display: flex; justify-content: center; gap: 8px; margin-top: 12px; }
@media (max-width: 600px) {
  .hero { background-position: center, 62% center; }
}

/* Ortak başlıklar ve tekne kataloğu */
.hero h1 { font-size: clamp(2rem, 3.4vw, 3.75rem); font-weight: 620; line-height: 1.18; }
.page-title { padding: clamp(24px, 3.5vw, 44px) 0; background: linear-gradient(115deg, #081830, #102b4a); }
.page-title h1 { font-size: clamp(1.8rem, 2.8vw, 3rem); font-weight: 620; }
h2 { font-size: clamp(1.35rem, 2.2vw, 2rem); font-weight: 620; }
.card h2, .card h3, .photo strong { font-size: clamp(1.02rem, 1.35vw, 1.25rem); font-weight: 640; }
.card h2, .card h3 { margin-bottom: .6em; }
.card a { text-underline-offset: 4px; }
.grid { gap: clamp(14px, 1.7vw, 24px); }
.card { box-shadow: 0 6px 22px #08183009; }
.card > div { padding: clamp(15px, 1.6vw, 22px); }
.fleet-intro { max-width: 64ch; color: #47556a; }
.fleet-nav, .vessel-actions { display: flex; flex-wrap: wrap; gap: 12px 18px; }
.fleet-nav a { text-decoration: none; padding: 7px 14px; border: 1px solid var(--line); border-radius: 24px; font-size: .9rem; }
.fleet-section { margin-top: 36px; scroll-margin-top: 20px; }
.vessel img { height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.vessel details { margin-block: 12px; font-size: .875rem; }
.vessel ul { padding-left: 1.1rem; }
.vessel-actions { margin-top: 14px; font-size: .875rem; }
.review-source { display: inline-block; margin-top: 12px; font-size: .82rem; color: #47556a; }

.gallery-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 28px; }
.vessel-specs { padding: 20px; margin-bottom: 28px; border: 1px solid var(--line); border-radius: 16px; background: var(--light); }
.vessel-specs h2 { font-size: 1.15rem; }
.vessel-specs ul { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0; padding-left: 20px; }
.vessel-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(10px, 2vw, 22px); }
.vessel-gallery a { overflow: hidden; border-radius: 14px; background: var(--light); }
.vessel-gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.vessel-gallery a:hover img { filter: brightness(.9); }
.gallery-viewer { max-width: 94vw; max-height: 94dvh; padding: 12px; border: 0; border-radius: 16px; background: var(--black); color: white; }
.gallery-viewer::backdrop { background: #030a16df; }
.gallery-viewer img { max-height: 73dvh; width: auto; margin: auto; object-fit: contain; }
.gallery-viewer form { display: flex; justify-content: flex-end; margin-bottom: 8px; }
.gallery-viewer button { min-width: 40px; min-height: 36px; border: 0; border-radius: 8px; background: var(--light); color: var(--navy); }
.gallery-controls { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 10px; }
@media (max-width: 650px) { .vessel-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Boğaz bannerı ve sabit üst menü */
:root { --header-height: 88px; }
.top {
  position: sticky;
  top: 0;
  z-index: 20;
  background: #fff;
  box-shadow: 0 5px 24px #08183012;
  transition: background-color .22s ease, box-shadow .22s ease;
}
.top .bar { height: var(--header-height); gap: clamp(12px, 1.8vw, 28px); position: relative; }
.top .logo { width: clamp(130px, 15vw, 192px); }
.top nav {
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 100px;
  background: var(--light);
}
.top nav a { padding: 3px clamp(10px, 1.2vw, 18px); font-size: .91rem; font-weight: 600; }
.top nav a + a { border-left: 1px solid #122f5329; }
.top .header-contact {
  display: inline-flex;
  align-items: center;
  gap: .65em;
  border-radius: 100px;
  padding: 11px 17px;
  background: #0c6449;
  color: #fff;
  font-weight: 650;
  font-size: .875rem;
  white-space: nowrap;
}
.top .header-contact:hover { background: #084d39; }
.home .top { margin-bottom: calc(-1 * var(--header-height)); }
.home .top:not(.is-scrolled) { background: transparent; box-shadow: none; }
.home .top:not(.is-scrolled) nav {
  background: #09182bb3;
  border-color: #ffffff32;
  box-shadow: 0 10px 26px #030a2460;
  backdrop-filter: blur(14px);
}
.home .top:not(.is-scrolled) nav a { color: #fff; }
.home .top:not(.is-scrolled) nav a:hover { color: #c6e0ff; }
.home .top:not(.is-scrolled) nav a + a { border-color: #ffffff40; }
.home .top:not(.is-scrolled) .bar > a:first-child {
  background: #ffffffeb;
  border-radius: 12px;
  padding: 3px 7px;
}
.hero {
  min-height: clamp(440px, 44vw, 780px);
  padding-block: calc(var(--header-height) + 35px) 55px;
  background: linear-gradient(90deg, #061424b3 0%, #06142470 27%, #06142410 56%, transparent 76%),
    url('bogaz-banner.webp') center / cover no-repeat #081830;
}
.hero h1 { text-shadow: 0 2px 18px #0413268c; }
[id] { scroll-margin-top: calc(var(--header-height) + 14px); }
@media (max-width: 940px) {
  :root { --header-height: 72px; }
  .top .bar { flex-wrap: nowrap; gap: 8px; }
  .top .toggle { display: block; margin-left: auto; font-size: .875rem; padding: 6px 10px; }
  .top nav { display: none; position: absolute; inset: calc(100% + 6px) 0 auto; width: auto; padding: 8px; border-radius: 16px; box-shadow: 0 10px 24px #09182b25; }
  .top nav.open { display: flex; flex-direction: column; align-items: stretch; }
  .top nav a { padding: 9px 14px; }
  .top nav a + a { border-left: 0; }
  .top .header-contact { padding: 8px 10px; }
}
@media (max-width: 550px) {
  .hero { min-height: 520px; align-items: end; background-position: 70% center; background-image: linear-gradient(0deg, #061424d9, transparent 72%), url('bogaz-banner.webp'); }
}
@media (prefers-reduced-motion: reduce) {
  .top { transition: none; }
}

/* Ana sayfa bölüm aralıkları ve başlık ölçeği */
.home main .section {
  padding-block: clamp(36px, 3.6vw, 64px);
}
.home main .section > h2 {
  font-size: clamp(1.125rem, 1.45vw, 1.5rem);
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: clamp(18px, 2vw, 28px);
  text-wrap: balance;
}
.home .quick, .home .mosaic, .home .menu-grid {
  gap: clamp(12px, 1.6vw, 24px);
}
.home .quick a { font-size: .875rem; }
.home .photo strong { font-size: clamp(.875rem, 1.2vw, 1.0625rem); }
.home .menu-card h3, .home .review-panel h3 { font-size: 1.0625rem; }

.hero { position: relative; isolation: isolate; }
.hero-birds { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.hero > .wrap { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) {
  .hero-birds { display: none; }
}

/* Ana sayfa hızlı bağlantı kartları */
.home .quick a {
  background: linear-gradient(145deg, #f8fcff, #eaf3ff);
  border-color: #cddff5;
  box-shadow: 0 3px 12px #174a8210;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
@media (hover: hover) {
  .home .quick a:hover {
    transform: translateY(-4px);
    border-color: #8fb8e8;
    box-shadow: 0 9px 22px #174a8224;
  }
}
.home .quick a:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  .home .quick a { transition: none; }
  .home .quick a:hover { transform: none; }
}

.service-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); align-items: start; gap: clamp(24px, 4vw, 56px); }
.service-layout article > h2, .service-aside h2 { font-size: 1.25rem; margin-top: 1.4em; }
.service-cover { width: 100%; aspect-ratio: 3 / 1; object-fit: cover; border-radius: 16px; }
.service-aside { padding: 22px; border-radius: 16px; border: 1px solid var(--line); background: var(--light); }
.service-aside h2:first-child { margin-top: 0; }
.service-aside ul { padding-left: 1.1em; }
.service-aside li { margin-block: .6em; }
@media (max-width: 760px) { .service-layout { grid-template-columns: minmax(0, 1fr); } }

.iftar-content img { border-radius: 14px; margin-block: 18px; height: auto; }
.iftar-content iframe { display: block; width: min(100%, 640px); aspect-ratio: 16 / 9; border: 0; border-radius: 14px; margin-block: 18px; }
.iftar-content h2, .iftar-content h3 { margin-top: 1.5em; }

.service-sidebar {
  display: grid;
  gap: 16px;
  min-width: 0;
}
.service-sidebar h2 { margin: 0 0 10px; font-size: 1.15rem; }
.service-sidebar-booking {
  padding: 22px;
  border-radius: 18px;
  border-top: 3px solid #c69a55;
  background: linear-gradient(145deg, #091d34, #194969);
  color: #fff;
  box-shadow: 0 8px 24px #102c4824;
}
.service-sidebar-booking p { margin: 0 0 16px; color: #e4edf7; font-size: .92rem; }
.service-sidebar-booking .button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding-inline: 14px;
  background: #0b6349;
  font-size: .88rem;
}
.service-sidebar-booking .button:hover { background: #084b39; }
.service-sidebar-links {
  padding: 20px;
  border: 1px solid #dce7f2;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px #102c480d;
}
.service-sidebar-links ul { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.service-sidebar-links li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 9px 11px;
  border-radius: 9px;
  background: #eff5fc;
  color: #16395a;
  text-decoration: none;
  font-size: .87rem;
  line-height: 1.45;
}
.service-sidebar-links li a:hover,
.service-sidebar-links li a:focus-visible { background: #dfeeff; color: #0a397c; }
.service-sidebar-links li span { color: #0d4aaa; }
.service-sidebar-fleet { display: inline-block; margin-top: 12px; font-size: .87rem; }

/* İç sayfa başlık bandı */
.page-title h1 {
  font-family: "Instrument Sans", "Segoe UI", system-ui, sans-serif;
  font-size: clamp(1.35rem, 2.15vw, 2rem);
  font-weight: 450;
  line-height: 1.3;
  letter-spacing: -.018em;
  text-wrap: balance;
}

/* Ana sayfa bannerı, menü dahil ilk ekranı doldurur. */
.home .hero {
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100svh;
}
@media (max-height: 440px) {
  .home .hero {
    padding-block: calc(var(--header-height) + 12px) 16px;
  }
}

.home .hero .hero-title {
  max-width: 16ch;
  font-size: clamp(2rem, 5vw, 4.75rem);
  font-weight: 720;
  letter-spacing: -.045em;
  line-height: 1.08;
  text-shadow: 0 3px 24px #061424cf;
}
.home .hero-title span {
  display: inline-block;
  font-size: .68em;
  font-weight: 560;
  letter-spacing: -.025em;
  color: #e0efff;
}
@media (max-width: 550px) {
  .home .hero .hero-title { max-width: 100%; }
}

.service-menu-panel, .service-menu-chevron { display: none; }
.service-menu > a { display: block; }
@media (min-width: 941px) {
  .service-menu > a { border-inline: 1px solid #122f5329; }
  .home .top:not(.is-scrolled) .service-menu > a { border-color: #ffffff40; }
  .service-menu-chevron { display: inline; }
  .service-menu-panel {
    position: absolute;
    inset: 100% 0 auto;
    padding: 18px;
    max-height: calc(100vh - var(--header-height) - 12px);
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 20px 45px #08183033;
  }
  .service-menu:hover .service-menu-panel,
  .service-menu:focus-within .service-menu-panel { display: block; }
  .service-menu::after { content: ''; position: absolute; top: 50%; bottom: 0; width: 125px; pointer-events: none; }
  .service-menu:hover::after { pointer-events: auto; top: calc(50% + 14px); }
  .service-menu-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .top .service-menu-panel a,
  .home .top:not(.is-scrolled) .service-menu-panel a { color: var(--navy); border: 0; }
  .top .service-menu-grid a { display: flex; align-items: center; gap: 10px; padding: 6px; border-radius: 8px; background: var(--light); }
  .top .service-menu-grid a:hover, .top .service-menu-grid a:focus-visible { background: #dfedff; }
  .service-menu-grid img { flex: none; object-fit: cover; border-radius: 5px; }
  .top .service-menu-all { display: inline-block; margin-top: 10px; }
}

@media (min-width: 941px) {
  .top .service-menu-panel {
    inset: 100% auto auto 50%;
    width: min(1120px, calc(100vw - 48px));
    transform: translateX(-50%);
    padding: 20px;
  }
  .service-menu-grid { gap: 10px; }
  .top .service-menu-grid a { gap: 12px; padding: 8px; line-height: 1.35; }
  .service-menu-grid img { width: 96px; height: 64px; }
  .top .service-menu-panel a:hover,
  .top .service-menu-panel a:focus-visible,
  .home .top:not(.is-scrolled) .service-menu-panel a:hover,
  .home .top:not(.is-scrolled) .service-menu-panel a:focus-visible {
    color: #12345c;
  }
}

.home .menu-grid { align-items: stretch; }
@media (min-width: 791px) {
  .home .menu-card-iftar { grid-column: span 2; }
  .home .menu-card-iftar ul { columns: 2; column-gap: 28px; }
  .home .menu-card-iftar li { break-inside: avoid; }
}
@media (min-width: 481px) and (max-width: 790px) {
  .home .menu-card-iftar { grid-column: 1 / -1; }
}

.fleet-grid { gap: clamp(16px, 2.5vw, 30px); }
.fleet-grid .vessel { border-radius: 18px; box-shadow: 0 8px 24px #102c4810; }
.fleet-grid .vessel-cover { display: block; overflow: hidden; background: var(--light); }
.fleet-grid .vessel-cover img { transition: transform .25s ease; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .fleet-grid .vessel-cover:hover img { transform: scale(1.04); }
}
.fleet-grid .vessel h3 { font-size: 1.15rem; color: #102d4c; }
.fleet-grid .vessel-actions a { padding: 8px 12px; border-radius: 8px; background: #eaf3fd; color: #123a67; text-decoration: none; }
.fleet-grid .vessel-actions a:hover { background: #d8eaff; }

.dining-page { background: #f5f8fc; }
.dining-content { padding-block: clamp(24px, 4vw, 56px); }
.dining-links { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.dining-links a {
  padding: 8px 16px;
  border: 1px solid #cddff3;
  border-radius: 100px;
  background: #fff;
  color: #173b62;
  font-size: .9rem;
  text-decoration: none;
}
.dining-links a:hover, .dining-links a:focus-visible { background: #e2efff; }
.dining-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.dining-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #dce7f2;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px #102c480d;
}
.dining-card:target { outline: 2px solid #4480bc; outline-offset: 3px; }
.dining-cover { position: relative; isolation: isolate; background: #112b46; }
.dining-cover img { width: 100%; height: clamp(130px, 16vw, 200px); object-fit: cover; }
.dining-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 22%, #081c33ed); }
.dining-cover h2 { position: absolute; z-index: 1; inset: auto 20px 16px; margin: 0; color: white; font-size: clamp(1.2rem, 2vw, 1.65rem); }
.dining-card ul { padding: 16px 22px 22px; margin: 0; list-style: none; }
.dining-card li { padding: 8px 0; border-bottom: 1px solid #e8eff6; }
.dining-card li:last-child { border-bottom: 0; }
.dining-booking { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 26px; padding: 24px; border-radius: 18px; color: #fff; background: #102c48; }
.dining-booking h2 { margin: 0 0 6px; font-size: 1.25rem; }
.dining-booking p { margin: 0; }
.dining-booking .button { background: #0b6349; }
@media (min-width: 791px) {
  .dining-card-iftar { grid-column: span 2; }
  .dining-card-iftar ul { columns: 2; column-gap: 24px; }
  .dining-card-iftar li { break-inside: avoid; }
}
@media (max-width: 790px) { .dining-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dining-card-iftar { grid-column: 1 / -1; } }
@media (max-width: 520px) { .dining-grid { grid-template-columns: minmax(0, 1fr); } }