/* Typography and UX polish for the Turkish version.
   The visual palette and all page content remain unchanged. */
:root {
  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body: 'Raleway', 'Segoe UI', Arial, sans-serif;
  --radius: 10px;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Match the main page: editorial display face for genuine headings. */
.page-hero h1,
.inner-hero h1,
.tour-card-body h2,
.tour-card-body h3,
.service-card h3,
.activity-card h3,
.day-title,
.contact-info h2,
.contact-info h3,
.contact-form h2,
.contact-form h3,
.empty-state h2,
.footer-logo,
.main_title_a span,
.main_title_a font {
  font-family: var(--font-display);
}

/* Several legacy pages use h2 as a paragraph wrapper. Treat only direct
   content h2 elements as reading text, without affecting card headings. */
.page-content > h2,
.day-block h2,
.activity-card h2 {
  font-family: var(--font-body) !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-wrap: pretty;
}

.page-content > h2 {
  margin: 0 0 18px !important;
}

/* Real section headings follow the main page's Playfair treatment. */
.page-content > h3 {
  font-family: var(--font-display);
  font-size: clamp(20px, 2.4vw, 27px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0;
  text-transform: none;
}

/* Long-form text should be calm and readable. */
.page-content > p,
.page-content > ul,
.page-content > ol,
.page-content p,
.page-content li,
.day-card p,
.day-block p,
.activity-card p,
.service-card p,
.service-card li,
.tour-card-body p,
.contact-info address p,
.empty-state p {
  font-family: var(--font-body);
  font-weight: 400 !important;
  line-height: 1.75;
}

.page-content > p,
.page-content > h2,
.page-content > ul,
.page-content > ol,
.intro-inner p,
.tour-card-body p,
.service-card p {
  max-width: 72ch;
}

/* Keep italics only where they are intentionally decorative on the home page.
   Excursion descriptions and utility text always remain upright. */
.page-content > h2,
.day-block h2,
.activity-card h2,
.inner-hero h1,
.tour-card-body h2,
.service-note,
.note-small {
  font-style: normal !important;
}

.main-nav li a,
.mobile-nav li a,
button,
input,
textarea,
select,
.btn-gold,
.btn-outline,
.btn-submit,
[class*="btn-"] {
  font-family: var(--font-body);
}

.main-nav li a {
  min-height: 44px;
  display: flex;
  align-items: center;
}

.hamburger {
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
}

.mobile-nav {
  max-height: calc(100dvh - var(--nav-h));
  overflow-y: auto;
  overscroll-behavior: contain;
  box-shadow: 0 18px 40px rgba(0,0,0,.32);
}

.mobile-nav li a {
  min-height: 48px;
  display: flex;
  align-items: center;
}

button,
input,
textarea,
select {
  font: inherit;
}

input,
textarea,
.form-group input,
.form-group textarea,
.contact-form input,
.contact-form textarea {
  font-size: 16px !important;
}

button,
.btn-gold,
.btn-outline,
.btn-submit,
[class*="btn-"] {
  min-height: 44px;
}

:where(a, button, input, textarea, select):focus-visible {
  outline: 3px solid var(--gold-light, #e8c97a);
  outline-offset: 3px;
}

img[loading="lazy"] {
  content-visibility: auto;
}

@media (max-width: 600px) {
  body {
    font-size: 15.5px;
    line-height: 1.7;
  }

  .page-content {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .page-content > h2,
  .day-block h2,
  .activity-card h2 {
    font-size: 15.5px !important;
    line-height: 1.72 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}


/* Softer, brighter finish for Turkish pages while preserving the original dark-gold identity */
:root {
  --dark: #20313a;
  --dark-2: #293b45;
  --dark-3: #344854;
  --text: #f6f2ea;
  --text-muted: #d8d1c5;
}

body {
  background: linear-gradient(180deg, #22343d 0%, #2a3d47 100%);
}

#pagetop,
#navigation,
#footer,
.mobile-nav {
  background: rgba(34, 52, 61, 0.96) !important;
}

#intro_section {
  background: #30444f !important;
}

.slide-overlay {
  background: linear-gradient(
    135deg,
    rgba(14, 22, 28, 0.56) 0%,
    rgba(14, 22, 28, 0.24) 58%,
    rgba(14, 22, 28, 0.50) 100%
  ) !important;
}

.main-nav li a:hover,
.main-nav li.active a,
.mobile-nav li a:hover {
  background: rgba(232, 201, 122, 0.14) !important;
}

.page-content,
.content-panel,
.contact-wrap,
.service-card,
.tour-card,
.activity-card,
.day-card,
.contact-form,
.contact-info {
  box-shadow: 0 18px 42px rgba(17, 20, 24, 0.10);
}


/* v4: brighter Turkish pages and original AI media */
body { background:#eef3f4 !important; color:#25343b !important; }
.page-content { color:#25343b; }
.page-hero,
.inner-hero { background:linear-gradient(135deg,#e7f0f1 0%,#f7f3e9 100%) !important; }
.page-hero h1,
.inner-hero h1 { color:#203740 !important; }
.page-hero .eyebrow,
.inner-hero .eyebrow { color:#a98632 !important; }
.service-card,
.tour-card,
.activity-card,
.day-card,
.contact-form,
.contact-info,
.content-panel { background:#fff !important; color:#25343b !important; }
#video-section .video-overlay { background:rgba(23,43,52,.28) !important; }


/* V5: slider dots are intentionally omitted; original YouTube iframe remains active. */
#slider .slider-dots { display:none !important; }


/* ================================================================
   V5.1 READABILITY FIX
   The light body background introduced in v4/v5 kept the original
   dark-theme text variables (--text:#f6f2ea, --text-muted:#d8d1c5),
   which made content text invisible (light-on-light).
   These rules give all light-background zones proper dark text,
   while dark zones (topbar, nav, footer, slider, intro, video)
   keep their original light text untouched.
   ================================================================ */

/* --- Long-form content on the light page background --- */
.page-content h2,
.page-content > h2,
.page-content h4 { color: #2d3c44 !important; }

.page-content p,
.page-content li,
.page-content td { color: #55656d !important; }

.page-content h3 { color: #a98632 !important; }

.page-hero p { color: #5a6a72 !important; }

/* --- White cards: headings were var(--white), invisible on white --- */
.service-card h3,
.tour-card-body h3,
.day-card h3,
.contact-info h3,
.contact-form h3 { color: #213741 !important; }

.service-card p,
.service-card li,
.tour-card-body p,
.day-card p,
.day-card li,
.contact-info p,
.contact-info span,
.contact-info address,
.contact-form label { color: #55656d !important; }

.day-card .day-label,
.tour-number,
.section-eyebrow { color: #a98632 !important; }

.card-icon { color: #a98632 !important; }

.price-note {
  background: rgba(169, 134, 50, 0.10) !important;
  border-left-color: #a98632 !important;
  color: #7c6220 !important;
}

.badge,
.tour-badge {
  background: rgba(169, 134, 50, 0.12) !important;
  border-color: rgba(169, 134, 50, 0.4) !important;
  color: #7c6220 !important;
}

/* --- Contact page & forms on light cards --- */
.contact-item span { color: #55656d !important; }
.contact-item i { color: #a98632 !important; }
.contact-item a,
.page-content a:not([class]) { color: #a98632 !important; }

.form-group label { color: #55656d !important; }
.form-group input,
.form-group textarea,
.contact-form input,
.contact-form textarea {
  background: #fff !important;
  color: #25343b !important;
  border: 1px solid rgba(32, 55, 64, 0.28) !important;
}
.form-group input::placeholder,
.form-group textarea::placeholder,
.contact-form input::placeholder,
.contact-form textarea::placeholder { color: #8b979d !important; }

.btn-outline,
.btn-outline-gold {
  color: #55656d !important;
  border-color: rgba(169, 134, 50, 0.5) !important;
}
.btn-outline:hover,
.btn-outline-gold:hover { color: #a98632 !important; }

/* --- Empty state (news page) --- */
.empty-state,
.empty-state p { color: #55656d !important; }
.empty-state i { color: rgba(169, 134, 50, 0.5) !important; }

/* --- Note/footnote text in tour programs --- */
.page-content p[style*="--text-muted"] { color: #55656d !important; }
.page-content p[style*="--text)"] { color: #2d3c44 !important; }

/* --- Intentionally dark inline boxes keep light text --- */
.page-content div[style*="--dark-3"] h2,
.page-content div[style*="--dark-3"] p,
.page-content div[style*="--dark-2"] h2,
.page-content div[style*="--dark-2"] p { color: #e6ddc9 !important; }
.page-content div[style*="--dark-3"] h2[style*="--gold"],
.page-content div[style*="--dark-2"] h2[style*="--gold"] { color: #e8c97a !important; }
.page-content div[style*="--dark-3"] p[style*="--text-muted"],
.page-content div[style*="--dark-2"] p[style*="--text-muted"] { color: #cfc8ba !important; }

/* --- Dark structural zones: restore their light text explicitly,
       protecting them from the generic content rules above --- */
#intro_section h1,
#intro_section h2 { color: #f0ece2 !important; }
#intro_section p { color: #cfc8ba !important; }
#footer .footer-copy,
#footer .footer-badge span { color: rgba(255, 255, 255, 0.72) !important; }

/* ==================================================================
   V7 PERMANENT VISIBILITY FIX — TURKISH VERSION ONLY
   Internal-page content must never depend on IntersectionObserver.
   This prevents text/cards from remaining opacity:0 when JS is cached,
   blocked, delayed or fails before the reveal observer is initialized.
   ================================================================== */
html body .reveal,
html body .reveal.visible {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
}

/* Explicit readable colours on all light Turkish content surfaces. */
html body .page-content,
html body .page-content article,
html body .page-content section,
html body .page-content .service-card,
html body .page-content .tour-card,
html body .page-content .tour-card-body,
html body .page-content .day-card,
html body .page-content .contact-info,
html body .page-content .contact-form,
html body .page-content .content-panel {
  opacity: 1 !important;
  visibility: visible !important;
}

html body .page-content h1,
html body .page-content h2,
html body .page-content h4,
html body .service-card h3,
html body .tour-card h2,
html body .tour-card h3,
html body .tour-card-body h2,
html body .tour-card-body h3,
html body .day-card h2,
html body .day-card h3,
html body .contact-info h2,
html body .contact-info h3,
html body .contact-form h2,
html body .contact-form h3 {
  color: #213741 !important;
  opacity: 1 !important;
}

html body .page-content p,
html body .page-content li,
html body .page-content td,
html body .page-content span:not(.footer-logo),
html body .service-card p,
html body .service-card li,
html body .tour-card p,
html body .tour-card li,
html body .tour-card-body p,
html body .tour-card-body li,
html body .day-card p,
html body .day-card li,
html body .contact-info p,
html body .contact-info span,
html body .contact-form label {
  color: #4b5d66 !important;
  opacity: 1 !important;
}

/* Gold accents remain clearly visible. */
html body .page-content h3,
html body .page-content .eyebrow,
html body .page-content .section-eyebrow,
html body .page-content .tour-number,
html body .page-content .tour-badge,
html body .page-content .badge,
html body .page-content .card-icon {
  color: #8a6a20 !important;
  opacity: 1 !important;
}

/* Preserve intended light text inside genuinely dark boxes. */
html body .page-content div[style*="--dark-2"],
html body .page-content div[style*="--dark-3"],
html body .page-content .dark-panel {
  color: #f2eee5 !important;
}
html body .page-content div[style*="--dark-2"] h1,
html body .page-content div[style*="--dark-2"] h2,
html body .page-content div[style*="--dark-2"] h3,
html body .page-content div[style*="--dark-2"] h4,
html body .page-content div[style*="--dark-2"] p,
html body .page-content div[style*="--dark-2"] span,
html body .page-content div[style*="--dark-3"] h1,
html body .page-content div[style*="--dark-3"] h2,
html body .page-content div[style*="--dark-3"] h3,
html body .page-content div[style*="--dark-3"] h4,
html body .page-content div[style*="--dark-3"] p,
html body .page-content div[style*="--dark-3"] span,
html body .page-content .dark-panel * {
  color: #f2eee5 !important;
  opacity: 1 !important;
}

/* Page hero is light in the current Turkish design. */
html body .page-hero,
html body .inner-hero,
html body .page-hero *,
html body .inner-hero * {
  opacity: 1 !important;
  visibility: visible !important;
}
html body .page-hero h1,
html body .inner-hero h1 {
  color: #203740 !important;
}
html body .page-hero p,
html body .inner-hero p {
  color: #52636c !important;
}
html body .page-hero .eyebrow,
html body .inner-hero .eyebrow {
  color: #8a6a20 !important;
}
