/* =========================================================
   flamor Yeniköy — mekân açık / site yapım aşamasında
   Palette: paper white · wine · tan
   ========================================================= */

:root{
  --paper:#ffffff;
  --wine:#7c1d24;
  --wine-2:#5d1219;
  --tan:#e0b492;
  --ink:#1b1416;
  --body:#544245;
  --muted:#9c8b88;
  --line:rgba(124,29,36,.14);

  --serif:"Playfair Display", "Times New Roman", serif;
  --sans:"Jost", "Helvetica Neue", Arial, sans-serif;

  --ease:cubic-bezier(.22,1,.36,1);
  --gutter:clamp(20px, 4.5vw, 64px);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

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

/* tek ekran — sayfa kaymaz */
body{
  height:100svh;
  display:flex;
  flex-direction:column;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  overflow:hidden;
  overscroll-behavior:none;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{ max-width:100%; height:auto; display:block; }

::selection{ background:var(--wine); color:#fff; }

/* ---------------------------------------------------------
   AMBIENT LAYERS
   --------------------------------------------------------- */
.grain{
  position:fixed; inset:-50%;
  z-index:60; pointer-events:none;
  opacity:.16; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");
  animation:grain 6s steps(6) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)} 20%{transform:translate(-3%,2%)}
  40%{transform:translate(2%,-3%)} 60%{transform:translate(-2%,-2%)}
  80%{transform:translate(3%,1%)} 100%{transform:translate(0,0)}
}

.aura{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.aura span{ position:absolute; border-radius:50%; filter:blur(90px); }
.aura__a{
  width:58vw; height:58vw; left:-16vw; top:-18vw;
  background:radial-gradient(circle at 30% 30%, rgba(124,29,36,.06), transparent 68%);
  animation:float 18s var(--ease) infinite alternate;
}
.aura__b{
  width:52vw; height:52vw; right:-14vw; bottom:-22vw;
  background:radial-gradient(circle at 60% 60%, rgba(224,180,146,.16), transparent 68%);
  animation:float 22s var(--ease) infinite alternate-reverse;
}
@keyframes float{
  from{ transform:translate3d(0,0,0) scale(1); }
  to{ transform:translate3d(4vw,3vw,0) scale(1.12); }
}

.frame span{
  position:fixed; top:0; bottom:0; width:1px; z-index:1;
  background:linear-gradient(180deg, transparent, var(--line) 18%, var(--line) 82%, transparent);
}
.frame__l{ left:calc(var(--gutter) - 12px); }
.frame__r{ right:calc(var(--gutter) - 12px); }
@media (max-width:720px){ .frame{ display:none; } }

/* cursor */
.cursor{
  position:fixed; top:0; left:0; z-index:70; pointer-events:none;
  width:34px; height:34px; margin:-17px 0 0 -17px;
  border:1px solid var(--wine); border-radius:50%;
  opacity:0;
  transition:width .35s var(--ease), height .35s var(--ease),
             margin .35s var(--ease), background-color .35s var(--ease), opacity .3s;
}
.cursor span{
  position:absolute; inset:0; margin:auto;
  width:4px; height:4px; border-radius:50%; background:var(--wine);
  transition:opacity .3s var(--ease);
}
.cursor.is-on{ opacity:1; }
.cursor.is-hover{ width:64px; height:64px; margin:-32px 0 0 -32px; background:rgba(124,29,36,.06); }
.cursor.is-hover span{ opacity:0; }
@media (hover:none){ .cursor{ display:none; } }

/* ---------------------------------------------------------
   PRELOADER
   --------------------------------------------------------- */
.loader{
  position:fixed; inset:0; z-index:100;
  background:var(--paper);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  transition:opacity .8s var(--ease), visibility .8s;
}
.loader.is-done{ opacity:0; visibility:hidden; }
.loader__logo{
  width:min(240px,44vw);
  opacity:0;
  animation:loaderIn 1.1s var(--ease) .15s forwards;
}
@keyframes loaderIn{ to{ opacity:1; } }
.loader__bar{
  margin-top:30px; width:min(180px,40vw); height:1px;
  background:var(--line); overflow:hidden;
}
.loader__bar i{
  display:block; height:100%; width:0%;
  background:var(--wine);
  transition:width .25s linear;
}

/* ---------------------------------------------------------
   REVEAL
   --------------------------------------------------------- */
.reveal{
  opacity:0; transform:translateY(22px);
  transition:opacity 1s var(--ease), transform 1.15s var(--ease);
  transition-delay:calc(var(--d,0) * 95ms);
}
body.is-ready .reveal{ opacity:1; transform:none; }

/* ---------------------------------------------------------
   SHARED
   --------------------------------------------------------- */
.label{
  font-size:clamp(9.5px,1.05vw,11.5px);
  letter-spacing:.26em; text-transform:uppercase;
  font-weight:400; color:var(--wine);
  white-space:nowrap;
}
.label--muted{ color:var(--muted); }

.link{ position:relative; text-decoration:none; color:inherit; }
.link::after{
  content:""; position:absolute; left:0; bottom:-4px; height:1px; width:100%;
  background:currentColor; transform:scaleX(0); transform-origin:right;
  transition:transform .5s var(--ease);
}
.link:hover::after{ transform:scaleX(1); transform-origin:left; }
.arrow{ display:inline-block; transition:transform .4s var(--ease); }
.link:hover .arrow{ transform:translate(2px,-2px); }

/* ---------------------------------------------------------
   HEADER
   --------------------------------------------------------- */
.nav{
  position:relative; z-index:5;
  display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; gap:16px;
  padding:clamp(20px,3.2vw,34px) var(--gutter);
}
.nav__col{ display:flex; align-items:center; gap:10px; }
.nav__col--r{ justify-content:flex-end; }

.dot{
  width:7px; height:7px; border-radius:50%; background:var(--wine);
  box-shadow:0 0 0 0 rgba(124,29,36,.45);
  animation:pulse 2.6s infinite;
}
@keyframes pulse{
  70%{ box-shadow:0 0 0 11px rgba(124,29,36,0); }
  100%{ box-shadow:0 0 0 0 rgba(124,29,36,0); }
}

/* ---------------------------------------------------------
   STAGE
   --------------------------------------------------------- */
.stage{
  position:relative; z-index:5;
  flex:1; min-height:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
  padding:clamp(12px,3vw,40px) var(--gutter) clamp(16px,4vw,52px);
}

.eyebrow{ margin-bottom:clamp(26px,4.5vw,48px); }
.pill{
  display:inline-block;
  font-size:clamp(9px,1vw,10.5px); letter-spacing:.24em; text-transform:uppercase;
  color:var(--wine); padding:8px 16px 7px; border:1px solid var(--line);
  border-radius:100px; background:rgba(255,255,255,.65); backdrop-filter:blur(6px);
}

/* --- brand logo (orijinal dosya, hiçbir filtre/renk müdahalesi yok) --- */
.brand{
  width:min(620px, 78vw);
  line-height:0;
}
.brand img{
  width:100%;
  clip-path:inset(0 0 100% 0);
  transition:clip-path 1.5s var(--ease), transform 1.6s var(--ease);
  transform:scale(1.04);
  transition-delay:.25s;
}
body.is-ready .brand img{
  clip-path:inset(0 0 0 0);
  transform:none;
}

.lede{
  margin-top:clamp(30px,4.5vw,50px);
  max-width:min(48ch, 86vw);
  font-size:clamp(14.5px,1.4vw,18px);
  line-height:1.8; font-weight:300;
  color:var(--body);
}
.lede em{ font-family:var(--serif); font-style:italic; color:var(--wine); }

/* --- info row --- */
.info{
  margin-top:clamp(38px,5.5vw,62px);
  display:flex; align-items:stretch; justify-content:center;
  gap:clamp(22px,4.5vw,56px);
  flex-wrap:wrap;
}
.info__item{ display:flex; flex-direction:column; align-items:center; gap:12px; }
.info__k{
  font-size:clamp(8.5px,.92vw,10px); letter-spacing:.26em;
  text-transform:uppercase; color:var(--muted);
}
.info__v{
  font-size:clamp(12.5px,1.15vw,14px); line-height:1.7;
  letter-spacing:.04em; color:var(--ink); font-weight:300;
}
.info__v a{ color:var(--wine); }
.info__sep{ width:1px; background:var(--line); align-self:center; height:44px; }

/* --- buttons --- */
.cta{
  margin-top:clamp(38px,5.5vw,60px);
  display:flex; gap:14px; flex-wrap:wrap; justify-content:center;
}
.btn{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; gap:12px;
  padding:16px 28px 15px; border-radius:100px;
  text-decoration:none;
  font-size:clamp(9.5px,1.05vw,11px); letter-spacing:.22em; text-transform:uppercase;
  transition:color .5s var(--ease), border-color .5s var(--ease);
}
.btn span, .btn svg{ position:relative; z-index:2; }
.btn svg{ width:20px; height:12px; fill:none; stroke:currentColor; stroke-width:1.2; }
.btn svg path{ transition:transform .45s var(--ease); }
.btn:hover svg path{ transform:translateX(3px); }
.btn::before{
  content:""; position:absolute; inset:0; z-index:1;
  transform:translateY(101%);
  transition:transform .6s var(--ease);
}
.btn:hover::before{ transform:translateY(0); }

.btn--solid{ background:var(--wine); color:#fff; }
.btn--solid::before{ background:var(--wine-2); }

.btn--ghost{ border:1px solid var(--line); color:var(--wine); }
.btn--ghost::before{ background:var(--wine); }
.btn--ghost:hover{ color:#fff; border-color:var(--wine); }

/* ---------------------------------------------------------
   FOOTER
   --------------------------------------------------------- */
.foot{
  position:relative; z-index:5;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px;
  padding:clamp(16px,2.6vw,26px) var(--gutter);
}
.foot > :nth-child(2){ text-align:center; }
.foot > :last-child{ justify-self:end; color:var(--wine); }

/* ---------------------------------------------------------
   RESPONSIVE — her şey tek ekrana sığmalı
   --------------------------------------------------------- */
@media (max-width:860px){
  .nav{ grid-template-columns:1fr auto; }
  .nav__col--c{ display:none; }
}

@media (max-width:680px){
  .brand{ width:80vw; }
  .info{ gap:22px 0; }
  .info__item{ flex:1 1 46%; }
  .info__sep{ display:none; }
  .cta{ width:100%; max-width:320px; }
  .btn{ flex:1; justify-content:center; }
  .foot{ grid-template-columns:1fr auto; gap:10px; }
  .foot > :first-child{ display:none; }
  .foot > :nth-child(2){ text-align:left; }
}

/* alçak ekranlar: dikey ritmi kıs, taşmayı önle */
@media (max-height:840px){
  .eyebrow{ margin-bottom:clamp(18px,3vw,30px); }
  .brand{ width:min(520px,74vw); }
  .lede{ margin-top:clamp(20px,3vw,32px); }
  .info{ margin-top:clamp(24px,3.5vw,38px); }
  .cta{ margin-top:clamp(24px,3.5vw,38px); }
}
@media (max-height:700px){
  .brand{ width:min(420px,66vw); }
  .lede{ font-size:13.5px; line-height:1.7; margin-top:18px; }
  .info{ margin-top:22px; gap:18px 0; }
  .info__v{ font-size:12px; }
  .cta{ margin-top:22px; }
  .btn{ padding:13px 24px 12px; }
  .pill{ padding:6px 13px 5px; }
}
@media (max-height:600px){
  .brand{ width:min(340px,58vw); }
  .lede{ display:none; }
  .info__sep{ height:36px; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .brand img{ clip-path:none; transform:none; }
}