/* =========================================================================
   PREMIUM PLUS — dünya standardında sanat yönetimi katmanı
   style.css / enhancements.css / ocean-luxe.css üzerine eklenir, hiçbirini
   bozmaz. Amaç: ilk 3 saniyede "bu gerçek bir lüks marka" hissi.
   ========================================================================= */

:root{
  --pp-gold:#e3c375;
  --pp-gold-soft:rgba(227,195,117,0.5);
  --pp-glass:rgba(244,240,229,0.055);
  --pp-glass-strong:rgba(244,240,229,0.09);
  --pp-glass-border:rgba(227,195,117,0.22);
  --pp-ease:cubic-bezier(.16,.84,.28,1);

  /* Yeni, tekrarsız el-çizimi motifler: inci ve midye */
  --motif-pearl: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20200%20200%22%20fill%3D%22none%22%20stroke%3D%22%23f4efe2%22%20stroke-width%3D%221.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%3Ccircle%20cx%3D%22100%22%20cy%3D%22106%22%20r%3D%2246%22/%3E%0A%3Cpath%20d%3D%22M70%2082c10-8%2020-10%2030-10s20%202%2030%2010%22%20stroke-width%3D%221%22/%3E%0A%3Cpath%20d%3D%22M64%20112c12%206%2024%208%2036%208s24-2%2036-8%22%20stroke-width%3D%221%22/%3E%0A%3Ccircle%20cx%3D%2284%22%20cy%3D%2296%22%20r%3D%223%22%20fill%3D%22%23f4efe2%22%20stroke%3D%22none%22%20opacity%3D%220.8%22/%3E%0A%3Cpath%20d%3D%22M100%2020c-6%2018-4%2032%206%2040M40%2060c14-10%2026-8%2034%202M160%2060c-14-10-26-8-34%202%22/%3E%0A%3C/svg%3E");
  --motif-mussel: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20200%20220%22%20fill%3D%22none%22%20stroke%3D%22%23f4efe2%22%20stroke-width%3D%221.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%3Cpath%20d%3D%22M100%2016C64%2028%2044%2072%2046%20120c2%2044%2022%2074%2054%2084%2032-10%2052-40%2054-84%202-48-18-92-54-104z%22/%3E%0A%3Cpath%20d%3D%22M100%2016c-14%2040-14%20128%200%20188%22%20stroke-width%3D%221%22/%3E%0A%3Cpath%20d%3D%22M62%2074c14-6%2024-6%2038-2M60%20104c16%206%2028%206%2044%200M64%20140c14%208%2026%208%2040%202%22%20stroke-width%3D%221%22/%3E%0A%3C/svg%3E");
  --motif-fishline: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20240%20140%22%20fill%3D%22none%22%20stroke%3D%22%23f4efe2%22%20stroke-width%3D%221.3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%3Cpath%20d%3D%22M20%2070c30-40%2070-58%20110-58s70%2018%2090%2058c-20%2040-50%2058-90%2058s-80-18-110-58z%22/%3E%0A%3Cpath%20d%3D%22M210%2050l20-18-8%2038%208%2038-20-18%22/%3E%0A%3Ccircle%20cx%3D%2280%22%20cy%3D%2262%22%20r%3D%223%22%20fill%3D%22%23f4efe2%22%20stroke%3D%22none%22/%3E%0A%3C/svg%3E");
}

/* -------------------------------------------------------------------------
   0. GENEL ZEMİN — hafif ışık huzmeleri her sayfada, çok düşük opaklık
   ------------------------------------------------------------------------- */
body{ position:relative; }
html{ scroll-behavior:auto; } /* Lenis devralır */

/* -------------------------------------------------------------------------
   1. HERO — sinematik su altı sahnesi
   ------------------------------------------------------------------------- */
.hero{ isolation:isolate; }
.hero-godrays{
  position:absolute; inset:0; z-index:1; pointer-events:none; mix-blend-mode:screen; opacity:0.5;
  background:
    conic-gradient(from 200deg at 18% -10%, transparent 0deg, rgba(244,240,229,0.10) 8deg, transparent 20deg, transparent 360deg),
    conic-gradient(from 230deg at 55% -15%, transparent 0deg, rgba(227,195,117,0.08) 6deg, transparent 16deg, transparent 360deg),
    conic-gradient(from 260deg at 85% -8%, transparent 0deg, rgba(62,207,214,0.09) 10deg, transparent 22deg, transparent 360deg);
  animation: ppRayDrift 16s ease-in-out infinite alternate;
}
@keyframes ppRayDrift{
  0%{ transform:translateX(-2%) rotate(0deg); opacity:0.4; }
  100%{ transform:translateX(2%) rotate(1.2deg); opacity:0.58; }
}
.hero-caustics{
  position:absolute; inset:0; z-index:1; pointer-events:none; opacity:0.16; mix-blend-mode:overlay;
  background-image:repeating-radial-gradient(circle at 30% 20%, rgba(244,240,229,0.5) 0px, transparent 3px, transparent 60px),
    repeating-radial-gradient(circle at 70% 60%, rgba(244,240,229,0.4) 0px, transparent 2px, transparent 70px);
  background-size:340px 340px, 420px 420px;
  animation: ppCaustics 22s linear infinite;
}
@keyframes ppCaustics{
  0%{ background-position:0 0, 0 0; }
  100%{ background-position:340px 220px, -420px 260px; }
}
.hero-glassglint{
  position:absolute; top:0; left:-40%; width:36%; height:100%; z-index:2; pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,0.09) 45%, transparent 60%);
  transform:skewX(-12deg); animation:ppGlint 9s ease-in-out infinite;
}
@keyframes ppGlint{
  0%,60%{ left:-40%; }
  100%{ left:120%; }
}
.hero-fishdrift{ position:absolute; z-index:1; pointer-events:none; opacity:0.5; filter:drop-shadow(0 6px 14px rgba(0,0,0,0.35)); }
.hero-fishdrift svg{ width:100%; height:100%; }
.hero-fishdrift.f1{ top:22%; left:8%; width:64px; height:44px; animation:ppFishSwim 13s ease-in-out infinite; }
.hero-fishdrift.f2{ top:60%; left:78%; width:44px; height:30px; animation:ppFishSwim 17s ease-in-out infinite -4s; opacity:0.34; transform:scaleX(-1); }
.hero-fishdrift.f3{ top:14%; left:62%; width:30px; height:22px; animation:ppFishSwim 10s ease-in-out infinite -2s; opacity:0.3; }
@keyframes ppFishSwim{
  0%{ transform:translate(0,0) scaleX(1); }
  50%{ transform:translate(26px,-14px) scaleX(1); }
  100%{ transform:translate(0,0) scaleX(1); }
}
.hero-fishdrift.f2{ animation-name:ppFishSwimL; }
@keyframes ppFishSwimL{
  0%{ transform:translate(0,0) scaleX(-1); }
  50%{ transform:translate(-26px,12px) scaleX(-1); }
  100%{ transform:translate(0,0) scaleX(-1); }
}
@media (prefers-reduced-motion:reduce), (max-width:700px){
  .hero-godrays, .hero-caustics, .hero-glassglint, .hero-fishdrift{ animation:none; }
}
@media (max-width:700px){
  .hero-fishdrift{ display:none; }
}

/* -------------------------------------------------------------------------
   2. YENİ MOTİF ATAMALARI — sayfa geneline yayılmış, tekrarsız
   ------------------------------------------------------------------------- */
.hero > .wrap::after{
  content:""; position:absolute; z-index:0; top:60%; right:6%; width:min(12vw,150px); height:min(12vw,150px);
  background-image:var(--motif-pearl); background-repeat:no-repeat; background-size:contain; opacity:0.05; pointer-events:none;
}
.menu-intro::before{
  content:""; position:absolute; z-index:0; top:8%; left:4%; width:min(16vw,190px); height:min(18vw,210px);
  background-image:var(--motif-mussel); background-repeat:no-repeat; background-size:contain; opacity:0.05; pointer-events:none;
}
.contact::before{ background-image:var(--motif-mussel); }
#dukkan::after{ background-image:var(--motif-pearl); }
.story::after{
  content:""; position:absolute; z-index:0; bottom:-4%; left:-2%; width:min(16vw,190px); height:min(11vw,130px);
  background-image:var(--motif-fishline); background-repeat:no-repeat; background-size:contain; opacity:0.05; pointer-events:none; transform:translateY(var(--parallax-b,0px));
}

/* -------------------------------------------------------------------------
   3. GLASSMORPHISM KARTLAR — menü, keşfet, kategori, iletişim
   ------------------------------------------------------------------------- */
html:not([data-theme="light"]) .dish,
html:not([data-theme="light"]) .explore-card,
html:not([data-theme="light"]) .highlight-card,
html:not([data-theme="light"]) .contact-card,
html:not([data-theme="light"]) .form-card,
html:not([data-theme="light"]) .photo-slot.filled{
  background:linear-gradient(160deg, var(--pp-glass-strong), var(--pp-glass)) !important;
  border:1px solid rgba(244,240,229,0.08) !important;
}
.dish, .explore-card, .highlight-card, .contact-card, .form-card, .photo-slot.filled{
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  transition:transform .55s var(--pp-ease), box-shadow .55s var(--pp-ease), border-color .4s ease, background .4s ease;
}
/* Aydınlık temada kartlar tamamen beyaz kalır, sadece altın hover vurgusu eklenir */
html[data-theme="light"] .dish:hover,
html[data-theme="light"] .explore-card:hover,
html[data-theme="light"] .highlight-card:hover,
html[data-theme="light"] .contact-card:hover,
html[data-theme="light"] .form-card:hover,
html[data-theme="light"] .photo-slot.filled:hover{
  border-color:rgba(205,164,74,0.4) !important;
  box-shadow:0 22px 46px -18px rgba(13,54,84,0.18), 0 0 0 1px rgba(205,164,74,0.16) inset;
}
html:not([data-theme="light"]) .dish:hover,
html:not([data-theme="light"]) .explore-card:hover,
html:not([data-theme="light"]) .highlight-card:hover,
html:not([data-theme="light"]) .contact-card:hover,
html:not([data-theme="light"]) .form-card:hover{
  border-color:var(--pp-glass-border) !important;
  box-shadow:0 26px 60px -20px rgba(0,0,0,0.55), 0 0 0 1px rgba(227,195,117,0.12) inset;
}
.dish:hover, .explore-card:hover, .highlight-card:hover, .contact-card:hover, .form-card:hover{
  transform:translateY(-6px) scale(1.012);
}
html:not([data-theme="light"]) .photo-slot.filled:hover{
  border-color:var(--pp-glass-border) !important;
  box-shadow:0 24px 50px -16px rgba(0,0,0,0.55), 0 0 0 1px rgba(227,195,117,0.14) inset;
}
.dish::after, .explore-card::before, .highlight-card::before, .contact-card::before, .form-card::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none; opacity:0; z-index:2;
  background:linear-gradient(135deg, var(--pp-gold-soft), transparent 40%, transparent 60%, var(--pp-gold-soft));
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  transition:opacity .5s ease;
}
.dish:hover::after, .explore-card:hover::before, .highlight-card:hover::before, .contact-card:hover::before, .form-card:hover::before{ opacity:1; }

/* Menü resim çerçevesine altın parıltı */
.dish-thumb.filled{ position:relative; }
.dish-thumb.filled::after{
  content:""; position:absolute; inset:0; box-shadow:0 0 0 1px rgba(227,195,117,0.16) inset; pointer-events:none; transition:box-shadow .4s ease;
}
.dish:hover .dish-thumb.filled::after{ box-shadow:0 0 0 1.5px rgba(227,195,117,0.5) inset; }

/* 3D tilt (JS ile --rx/--ry set edilir) */
.dish, .explore-card, .highlight-card, .contact-card, .form-card{
  transform-style:preserve-3d;
  transform:perspective(900px) rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg)) translateY(var(--ty,0px));
}
@media (max-width:900px), (pointer:coarse){
  .dish, .explore-card, .highlight-card, .contact-card, .form-card{ transform:none !important; }
}

/* -------------------------------------------------------------------------
   4. İNCİ YORUM KARTLARI — parlaklık taraması
   ------------------------------------------------------------------------- */
.ts-card{ position:relative; overflow:hidden; }
.ts-card::before{
  content:""; position:absolute; top:0; left:-60%; width:40%; height:100%; z-index:3; pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,0.14) 45%, transparent 70%);
  transform:skewX(-14deg); animation:ppPearlSheen 7s ease-in-out infinite;
}
@keyframes ppPearlSheen{
  0%, 55%{ left:-60%; }
  100%{ left:130%; }
}
@media (prefers-reduced-motion:reduce){ .ts-card::before{ animation:none; display:none; } }

/* -------------------------------------------------------------------------
   5. GALERİ — masonry düzeni + zoom
   ------------------------------------------------------------------------- */
@media (min-width:701px){
  .gallery-grid{
    display:block !important; columns:3 240px; column-gap:14px;
  }
  .gallery-grid .photo-slot{
    display:block; width:100%; break-inside:avoid; margin:0 0 14px; aspect-ratio:auto !important;
  }
  .gallery-grid .photo-slot.wide{ grid-column:auto; }
  .gallery-grid .photo-slot:nth-of-type(4n+1){ aspect-ratio:3/4 !important; }
  .gallery-grid .photo-slot:nth-of-type(4n+2){ aspect-ratio:1/1 !important; }
  .gallery-grid .photo-slot:nth-of-type(4n+3){ aspect-ratio:4/5 !important; }
  .gallery-grid .photo-slot:nth-of-type(4n+4){ aspect-ratio:1/1.2 !important; }
}
.photo-slot.filled img{ transition:transform .7s var(--pp-ease), filter .5s ease; }
.photo-slot.filled:hover img{ transform:scale(1.08); filter:saturate(1.12) brightness(1.03); }

/* -------------------------------------------------------------------------
   6. REZERVASYON — lüks otel rezervasyon paneli hissi
   ------------------------------------------------------------------------- */
.form-card, .contact-card{ position:relative; }
.form-card input, .form-card select, .form-card textarea{
  background:rgba(244,240,229,0.045) !important;
  border:1px solid rgba(244,240,229,0.14) !important;
  transition:border-color .35s ease, box-shadow .35s ease, background .35s ease;
}
.form-card input:focus, .form-card select:focus, .form-card textarea:focus{
  border-color:var(--pp-gold) !important;
  box-shadow:0 0 0 3px rgba(227,195,117,0.14);
  background:rgba(244,240,229,0.07) !important;
}

/* -------------------------------------------------------------------------
   7. WAVE DIVIDER — köpük parıltısı
   ------------------------------------------------------------------------- */
.wave-divider{ filter:drop-shadow(0 -6px 14px rgba(0,0,0,0.18)); }

/* -------------------------------------------------------------------------
   8. FOOTER — deniz tabanı
   ------------------------------------------------------------------------- */
footer{
  background:
    linear-gradient(180deg, transparent 0%, rgba(9,26,20,0.5) 40%, rgba(12,32,22,0.72) 100%),
    linear-gradient(160deg, rgba(31,92,66,0.14), rgba(20,54,44,0.1));
  padding-top:56px !important;
}
footer::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0.5;
  background-image:radial-gradient(rgba(244,240,229,0.05) 1px, transparent 1.4px);
  background-size:16px 16px;
}
.footer-seabed-wave{
  position:absolute; top:-1px; left:0; width:100%; height:34px; z-index:2; pointer-events:none;
  fill:none; stroke:rgba(227,195,117,0.16); stroke-width:1;
}
.footer-critters{
  position:absolute; z-index:0; pointer-events:none; opacity:0.07; background-repeat:no-repeat; background-size:contain;
}
.footer-critters.c1{ left:6%; bottom:10px; width:70px; height:80px; background-image:var(--motif-mussel); }
.footer-critters.c2{ right:9%; bottom:14px; width:64px; height:64px; background-image:var(--motif-coral); }
.footer-critters.c3{ left:44%; bottom:6px; width:40px; height:40px; background-image:var(--motif-pearl); }
footer .wrap{ position:relative; z-index:1; }

/* -------------------------------------------------------------------------
   9. SCROLL REVEAL — GSAP tarafından tetiklenen sınıflar
   ------------------------------------------------------------------------- */
.pp-reveal{ opacity:0; transform:translateY(38px); filter:blur(6px); will-change:transform, opacity, filter; }
.pp-reveal.pp-in{ opacity:1; transform:translateY(0); filter:blur(0); transition:opacity 1s var(--pp-ease), transform 1s var(--pp-ease), filter 1s var(--pp-ease); }
@media (prefers-reduced-motion:reduce){
  .pp-reveal, .pp-reveal.pp-in{ opacity:1 !important; transform:none !important; filter:none !important; transition:none !important; }
}

/* -------------------------------------------------------------------------
   10. MIKNATIS BUTONLAR
   ------------------------------------------------------------------------- */
.btn-primary, .btn-ghost{ transform:translate(var(--mx,0), var(--my,0)); transition:transform .25s var(--pp-ease), box-shadow .3s ease, background .3s ease, color .3s ease; }
@media (max-width:900px), (pointer:coarse){ .btn-primary, .btn-ghost{ transform:none !important; } }

/* -------------------------------------------------------------------------
   11. LENIS uyumu
   ------------------------------------------------------------------------- */
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; }