/* ============================================================
   MAVİ RESTAURANT — contact.css
   ============================================================ */

.nl.active-page { color:#fff !important; }
.nl.active-page::after { transform:scaleX(1) !important; transform-origin:left !important; }

/* ── HERO ───────────────────────────────────────────────────── */
.ct-hero {
  position:relative;
  min-height:72vh;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  overflow:hidden; background:var(--navy);
  text-align:center;
}
.ct-hero-bg {
  position:absolute; inset:0;
  background:url('https://images.unsplash.com/photo-1559339352-11d035aa65de?w=1800&q=85') center/cover no-repeat;
  animation:hzoom 18s ease-in-out infinite alternate;
}
.ct-hero-ov {
  position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(8,15,26,.72) 0%, rgba(8,15,26,.85) 70%, rgba(8,15,26,.96) 100%);
}
.ct-hero-content {
  position:relative; z-index:2;
  padding:9rem 1.5rem 2rem;
  max-width:680px;
}
.ct-hero-title {
  font-family:var(--serif);
  font-size:clamp(3rem,6vw,5rem); font-weight:300; line-height:1.1; color:#fff;
  margin-bottom:1.1rem;
  opacity:0; animation:fu 1s .5s forwards;
}
.ct-hero-title em { font-style:italic; color:var(--foam); }
.ct-hero-sub {
  font-size:1rem; font-weight:300; color:rgba(255,255,255,.6); line-height:1.8;
  opacity:0; animation:fu 1s .7s forwards;
}

/* Hero hızlı kartlar */
.ct-hero-cards {
  position:relative; z-index:2;
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:rgba(255,255,255,.08);
  width:100%; margin-top:3rem;
  border-top:1px solid rgba(255,255,255,.1);
}
@media(max-width:991px) { .ct-hero-cards { grid-template-columns:repeat(2,1fr); } }
@media(max-width:575px) { .ct-hero-cards { grid-template-columns:1fr; } }

.ct-hero-card {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.4rem; padding:1.8rem 1.2rem;
  background:rgba(8,15,26,.6); backdrop-filter:blur(10px);
  text-decoration:none; color:inherit;
  transition:background .3s;
}
.ct-hero-card:hover { background:rgba(255,255,255,.06); }
.ct-hero-card--nolink { cursor:default; }
.ct-hero-card i { font-size:1.4rem; color:var(--gold); }
.ct-hc-label { font-size:.6rem; font-weight:600; letter-spacing:.25em; text-transform:uppercase; color:rgba(255,255,255,.4); }
.ct-hc-value { font-size:.88rem; font-weight:400; color:#fff; text-align:center; line-height:1.4; }

.ct-hero-wave { position:absolute; bottom:-2px; left:0; right:0; z-index:3; line-height:0; }

/* ph-eyebrow burada da geçerli */
.ph-eyebrow {
  display:flex; align-items:center; justify-content:center; gap:16px;
  font-size:.68rem; font-weight:500; letter-spacing:.4em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1.4rem;
  opacity:0; animation:fu .9s .3s forwards;
}
.ph-eyebrow span { width:36px; height:1px; background:var(--gold); display:inline-block; }

/* ── MAIN SECTION ───────────────────────────────────────────── */
.ct-main { background:var(--warm); padding:5rem 0 6rem; }

/* ── FORM CARD ──────────────────────────────────────────────── */
.ct-form-card {
  background:#fff;
  border:1px solid rgba(0,0,0,.07);
  border-radius:var(--radius);
  padding:2.8rem 3rem;
  box-shadow:var(--shadow-soft);
  position:relative; overflow:hidden;
}
.ct-form-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--ocean), var(--teal), var(--gold));
}
.ct-form-desc { font-size:.9rem; color:var(--text-mid); line-height:1.75; margin-bottom:1.8rem; }

/* Konu butonları */
.ct-topic-select {
  display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:2rem;
}
.ct-topic-btn {
  display:inline-flex; align-items:center; gap:.45rem;
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-mid); background:transparent;
  border:1px solid rgba(0,0,0,.14); border-radius:var(--radius);
  padding:.55rem 1.1rem; cursor:pointer; transition:all .3s var(--ease);
}
.ct-topic-btn:hover { border-color:var(--teal); color:var(--teal); }
.ct-topic-btn.active { background:var(--navy); border-color:var(--navy); color:#fff; }
.ct-topic-btn i { font-size:.8rem; }

/* Form elements */
.ct-label {
  display:block; font-family:var(--sans); font-size:.68rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--navy);
  margin-bottom:.45rem;
}
.ct-label span { color:var(--teal); }

.ct-input {
  width:100%; display:block;
  font-family:var(--sans); font-size:.92rem;
  color:var(--text-dark);
  background:#fafafa;
  border:1px solid rgba(0,0,0,.14); border-radius:var(--radius);
  padding:.72rem 1rem;
  outline:none;
  transition:border-color .3s, box-shadow .3s, background .3s;
  -webkit-appearance:none;
}
.ct-input:focus {
  border-color:var(--teal); background:#fff;
  box-shadow:0 0 0 3px rgba(46,139,139,.12);
}
.ct-input.ct-invalid { border-color:#dc3545; box-shadow:0 0 0 3px rgba(220,53,69,.1); }
.ct-textarea { resize:vertical; min-height:130px; }

.ct-error {
  display:none; font-size:.72rem; color:#dc3545; margin-top:.3rem;
}
.ct-input.ct-invalid + .ct-error { display:block; }

/* Rezervasyon ek alanlar */
.ct-res-divider {
  position:relative; text-align:center; margin-bottom:.5rem;
}
.ct-res-divider::before {
  content:''; position:absolute; top:50%; left:0; right:0; height:1px;
  background:rgba(0,0,0,.1);
}
.ct-res-divider span {
  position:relative; background:#fff; padding:0 1rem;
  font-size:.68rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--teal);
}

/* Checkbox */
.ct-checkbox-wrap {
  display:flex; align-items:flex-start; gap:.7rem; cursor:pointer;
}
.ct-checkbox-wrap input { position:absolute; opacity:0; width:0; height:0; }
.ct-checkmark {
  width:18px; height:18px; border-radius:3px; flex-shrink:0;
  border:1px solid rgba(0,0,0,.2); background:#fff; margin-top:2px;
  transition:all .25s; position:relative;
}
.ct-checkbox-wrap input:checked ~ .ct-checkmark {
  background:var(--teal); border-color:var(--teal);
}
.ct-checkbox-wrap input:checked ~ .ct-checkmark::after {
  content:''; position:absolute; left:5px; top:2px;
  width:6px; height:10px; border:2px solid #fff; border-top:none; border-left:none;
  transform:rotate(45deg);
}
.ct-checkbox-label { font-size:.84rem; color:var(--text-mid); line-height:1.5; }
.ct-link { color:var(--teal); text-decoration:none; transition:color .3s; }
.ct-link:hover { color:var(--ocean); }

/* Submit button */
.ct-submit-btn {
  width:100%; padding:1rem;
  font-family:var(--sans); font-size:.76rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase;
  background:var(--gold); color:var(--navy);
  border:none; border-radius:var(--radius); cursor:pointer;
  position:relative; overflow:hidden;
  transition:background .3s, color .3s;
}
.ct-submit-btn::before {
  content:''; position:absolute; inset:0;
  background:var(--gold-l); transform:translateX(-101%);
  transition:transform .4s var(--ease);
}
.ct-submit-btn:hover::before { transform:translateX(0); }
.ct-submit-btn > * { position:relative; z-index:1; }

/* Success state */
.ct-success {
  text-align:center; padding:3rem 2rem;
}
.ct-success-icon { font-size:3.5rem; color:var(--teal); margin-bottom:1rem; }
.ct-success h4 {
  font-family:var(--serif); font-size:1.8rem; font-weight:300;
  color:var(--navy); margin-bottom:.6rem;
}
.ct-success p { font-size:.95rem; color:var(--text-mid); }
.ct-success-reset {
  margin-top:1.5rem;
  font-family:var(--sans); font-size:.72rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--teal); background:transparent;
  border:1px solid rgba(46,139,139,.3); border-radius:var(--radius);
  padding:.6rem 1.6rem; cursor:pointer; transition:all .3s;
}
.ct-success-reset:hover { background:var(--teal); border-color:var(--teal); color:#fff; }

/* ── INFO CARD ──────────────────────────────────────────────── */
.ct-info-card, .ct-hours-card, .ct-transport-card {
  background:#fff; border:1px solid rgba(0,0,0,.07);
  border-radius:var(--radius); padding:2rem;
  box-shadow:var(--shadow-soft); margin-bottom:1.5rem;
}
.ct-card-title {
  font-family:var(--sans); font-size:.68rem; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase; color:var(--teal);
  margin-bottom:1.5rem; padding-bottom:.75rem;
  border-bottom:1px solid rgba(0,0,0,.07);
}
.ct-info-item {
  display:flex; align-items:flex-start; gap:1rem;
  padding:.9rem 0; border-bottom:1px solid rgba(0,0,0,.05);
}
.ct-info-item:last-of-type { border-bottom:none; }
.ct-info-icon {
  width:40px; height:40px; border-radius:50%;
  background:rgba(46,139,139,.1); flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  color:var(--teal); font-size:1rem; margin-top:2px;
}
.ct-info-label {
  font-size:.62rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--text-light); margin:0 0 .2rem;
}
.ct-info-value { font-size:.95rem; color:var(--navy); font-weight:400; margin:0 0 .2rem; line-height:1.5; }
.ct-info-link { text-decoration:none; transition:color .3s; }
.ct-info-link:hover { color:var(--teal); }
.ct-info-sub { font-size:.76rem; color:var(--text-light); margin:0; line-height:1.4; }
.ct-link--arrow {
  font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:var(--teal); text-decoration:none; display:inline-flex; align-items:center; gap:.3rem;
  margin-top:.3rem; transition:gap .3s;
}
.ct-link--arrow:hover { gap:.6rem; color:var(--ocean); }

/* Sosyal butonlar */
.ct-social-row {
  display:flex; gap:.55rem; padding-top:1.2rem; margin-top:.5rem;
  border-top:1px solid rgba(0,0,0,.06);
}
.ct-social-btn {
  width:38px; height:38px; border-radius:var(--radius);
  border:1px solid rgba(0,0,0,.12);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; text-decoration:none;
  transition:all .3s;
}
.ct-s-ig { color:#E1306C; }
.ct-s-ig:hover { background:#E1306C; border-color:#E1306C; color:#fff; }
.ct-s-fb { color:#1877F2; }
.ct-s-fb:hover { background:#1877F2; border-color:#1877F2; color:#fff; }
.ct-s-x  { color:var(--text-dark); }
.ct-s-x:hover  { background:var(--text-dark); border-color:var(--text-dark); color:#fff; }
.ct-s-ta { color:#00AF87; }
.ct-s-ta:hover { background:#00AF87; border-color:#00AF87; color:#fff; }

/* ── HOURS CARD ─────────────────────────────────────────────── */
.ct-hours-list { display:flex; flex-direction:column; gap:.1rem; margin-bottom:1rem; }
.ct-hour-row {
  display:flex; align-items:center; gap:.5rem;
  padding:.7rem .8rem; border-radius:var(--radius);
  font-size:.9rem; position:relative;
}
.ct-hour-row.ct-open { color:var(--text-dark); }
.ct-hour-row.ct-today { background:rgba(46,139,139,.07); }
.ct-day { flex:1; font-weight:400; }
.ct-time { font-weight:500; color:var(--navy); }
.ct-today-badge {
  font-size:.58rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:#fff; background:var(--teal); padding:.18rem .65rem; border-radius:2px;
  margin-left:.5rem;
}
.ct-hours-note {
  font-size:.78rem; color:var(--text-light); line-height:1.5;
  padding:.6rem .8rem; background:rgba(0,0,0,.03);
  border-radius:var(--radius); margin-top:.5rem;
  display:flex; align-items:flex-start; gap:.3rem;
}
.ct-hours-note i { flex-shrink:0; margin-top:2px; }

/* Açık/kapalı durumu */
.ct-open-status {
  display:flex; align-items:center; gap:.6rem;
  padding:.75rem 1rem; border-radius:var(--radius);
  background:rgba(46,139,139,.08); border:1px solid rgba(46,139,139,.2);
  margin-top:.5rem;
}
.ct-open-status.closed {
  background:rgba(220,53,69,.06); border-color:rgba(220,53,69,.18);
}
.ct-status-dot {
  width:10px; height:10px; border-radius:50%; background:var(--teal); flex-shrink:0;
  box-shadow:0 0 0 3px rgba(46,139,139,.2);
  animation:pulse-dot 2s infinite;
}
.ct-open-status.closed .ct-status-dot {
  background:#dc3545; box-shadow:0 0 0 3px rgba(220,53,69,.18);
  animation:none;
}
@keyframes pulse-dot {
  0%,100% { box-shadow:0 0 0 3px rgba(46,139,139,.2); }
  50%      { box-shadow:0 0 0 6px rgba(46,139,139,.08); }
}
.ct-status-text { font-size:.82rem; font-weight:500; color:var(--teal); }
.ct-open-status.closed .ct-status-text { color:#dc3545; }

/* ── TRANSPORT CARD ─────────────────────────────────────────── */
.ct-transport-list { display:flex; flex-direction:column; gap:.8rem; }
.ct-transport-item { display:flex; align-items:flex-start; gap:.9rem; }
.ct-tr-icon {
  width:38px; height:38px; border-radius:50%; flex-shrink:0;
  background:rgba(30,95,116,.1);
  display:flex; align-items:center; justify-content:center;
  color:var(--ocean); font-size:.95rem; margin-top:2px;
}
.ct-tr-title { font-size:.8rem; font-weight:600; color:var(--navy); margin:0 0 .2rem; }
.ct-tr-desc  { font-size:.84rem; color:var(--text-mid); line-height:1.65; margin:0; }

/* ── MAP ────────────────────────────────────────────────────── */
.ct-map-section { background:var(--sand); }
.ct-map-header {
  padding:4rem 0 2.5rem;
}
.ct-map-wrap {
  position:relative; line-height:0; overflow:hidden;
}
.ct-map-wrap iframe {
  width:100%; height:480px; border:0; display:block; filter:grayscale(.15) contrast(1.05);
}
.ct-map-pin-card {
  position:absolute; top:1.5rem; left:2rem;
  display:flex; align-items:center; gap:.75rem;
  background:rgba(8,15,26,.92); backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--radius); padding:.9rem 1.2rem;
  z-index:2;
}
.ct-map-pin-icon { font-size:1.4rem; color:var(--gold); flex-shrink:0; }
.ct-map-pin-name { font-family:var(--serif); font-size:1rem; color:#fff; font-weight:400; margin:0; }
.ct-map-pin-addr { font-size:.74rem; color:rgba(255,255,255,.5); margin:0; }
@media(max-width:575px) { .ct-map-pin-card { top:auto; bottom:1.5rem; left:1rem; right:1rem; } }

/* ── FAQ ────────────────────────────────────────────────────── */
.ct-faq-section { background:var(--warm); padding:6rem 0; }
.ct-faq-list { display:flex; flex-direction:column; gap:0; }
.ct-faq-item {
  border-bottom:1px solid rgba(0,0,0,.08);
}
.ct-faq-item:first-child { border-top:1px solid rgba(0,0,0,.08); }
.ct-faq-q {
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.3rem 0; text-align:left;
  font-family:var(--sans); font-size:.97rem; font-weight:500; color:var(--navy);
  background:transparent; border:none; cursor:pointer;
  transition:color .3s;
}
.ct-faq-q:hover { color:var(--teal); }
.ct-faq-q[aria-expanded="true"] { color:var(--teal); }
.ct-faq-icon {
  font-size:1.2rem; flex-shrink:0; color:var(--teal);
  transition:transform .35s var(--ease);
}
.ct-faq-q[aria-expanded="true"] .ct-faq-icon { transform:rotate(45deg); }
.ct-faq-a {
  max-height:0; overflow:hidden;
  transition:max-height .4s var(--ease), padding .4s;
  padding:0;
}
.ct-faq-a.open {
  max-height:400px;
  padding-bottom:1.2rem;
}
.ct-faq-a p { font-size:.9rem; color:var(--text-mid); line-height:1.8; margin:0; }

/* ── Responsive ─────────────────────────────────────────────── */
@media(max-width:991px) {
  .ct-form-card { padding:2rem 1.5rem; }
}
@media(max-width:767px) {
  .ct-main { padding:3.5rem 0 4rem; }
  .ct-faq-section { padding:4rem 0; }
  .ct-map-header { padding:3rem 0 2rem; }
  .ct-map-wrap iframe { height:320px; }
}