@font-face{
  font-family:"Helvetica_Reg";
  src:url("https://sartoriatramarossa.com/assets/fonts/Helvetica_Regular.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Helvetica_Reg";
  src:url("https://sartoriatramarossa.com/assets/fonts/Helvetica_Regular.woff2") format("woff2");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Helvetica_Reg";
  src:url("https://sartoriatramarossa.com/assets/fonts/Helvetica_Regular.woff2") format("woff2");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Helvetica_Reg";
  src:url("https://sartoriatramarossa.com/assets/fonts/Helvetica_Bold.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Helvetica_Reg";
  src:url("https://sartoriatramarossa.com/assets/fonts/Helvetica_Bold.woff2") format("woff2");
  font-weight:800;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Helvetica_Reg";
  src:url("https://sartoriatramarossa.com/assets/fonts/Helvetica_Bold.woff2") format("woff2");
  font-weight:900;
  font-style:normal;
  font-display:swap;
}


:root{
  --headH:64px;
  --pad: clamp(14px, 3vw, 42px);
  --max: 1240px;

  --bg:#0b0b0b;
  --fg:#fff;

  --menuBg: rgba(245,245,245,.98);
  --menuText:#111;
  --line: rgba(0,0,0,.10);
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
html, body, button, input, select, textarea{
  font-family: "Helvetica_Reg", Helvetica, Arial, sans-serif !important;
}

body{
  margin:0;
  font-family: "Helvetica_Reg", Helvetica, Arial, sans-serif !important;
  background: var(--bg);
  color: var(--fg);
  overflow:hidden; /* FULLPAGE: body scroll kapalı */
  overscroll-behavior:none;
}
/* ✅ White UI panels: body'nin beyaz yazı rengini ez */
#OZ_HDR.oz-solid,
#OZ_HDR.oz-solid *{
  color:#111 !important;
}

#OZ_HDR .oz-mega,
#OZ_HDR .oz-mega *{
  color:#111 !important;
}

#OZ_CART,
#OZ_CART *{
  color:#111 !important;
}

#OZ_SEARCH,
#OZ_SEARCH *{
 background-color: white!important;
}


/* ========= HEADER (3 kolon: sol, logo, sağ) ========= */
.header{
  position:fixed;
  inset:0 0 auto 0;
  height:var(--headH);
  z-index:1000;
  padding: 0 var(--pad);
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  mix-blend-mode:difference;
  pointer-events:none;
}
.header *{ pointer-events:auto; }

.brand{
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:14px;
  user-select:none;
  white-space:nowrap;
}

/* SOL SLOT: (Desktop: nav-left) + (Mobile: burger) aynı kolonda */
.leftslot{
  display:flex;
  align-items:center;
  gap:18px;
  min-width:0;
}

.nav-left, .nav-right{
  display:flex;
  align-items:center;
  gap:18px;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.nav-left{ justify-content:flex-start; min-width:0; }
.nav-right{ justify-content:flex-end; gap:10px; }

.nav-left > li{ list-style:none; position:relative; }
.nav-left > li > a{
  color:var(--fg);
  text-decoration:none;
  opacity:.9;
  display:inline-flex;
  padding:8px 0;
}
.nav-left > li > a:hover{ opacity:1; }

.iconbtn{
  width:36px; height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  background:transparent;
  color:var(--fg);
  cursor:pointer;
  opacity:.92;
  font-size:16px;
  line-height:1;
}

/* ========= DESKTOP MEGA MENU (FIX: JS class open) ========= */

.mega{
  position: fixed;
  left: 0; right: 0;
  top: var(--headH);
  padding: 40px var(--pad) 46px;
  background: rgba(255,255,255,.96);
  color:#111;
  z-index: 1200;
  border-bottom: 1px solid rgba(0,0,0,.08);
  display:none;

  max-height: calc(100vh - var(--headH));
  overflow:auto;
  -webkit-overflow-scrolling: touch;
}

.mega-dim{
  position: fixed;
  inset: var(--headH) 0 0 0;
  background: rgba(0,0,0,.08);
  z-index: 1100;
  display:none;
  pointer-events:auto; /* ✅ tıklayınca kapatacağız */
}

.nav-left > li.open .mega{ display:block; }
.nav-left > li.open ~ .mega-dim{ display:block; }

.mega-inner{
  max-width:var(--max);
  margin:0 auto;
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr 1fr;
  gap: 34px;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.mega h3{
  margin:0 0 14px;
  font-size:11px;
  letter-spacing:.14em;
}
.mega a{
  display:block;
  margin: 8px 0;
  color:#111;
  text-decoration:none;
  opacity:.85;
}
.mega a:hover{ opacity:1; }

/* ========= FULLPAGE WRAPPER ========= */


/* track artık “normal akış” */
.track{
  width:100%;
  height:auto;
  transform:none !important;
  transition:none !important;
  will-change:auto;
}

/* viewport kesin görünür yükseklik */
.viewport{
  position: fixed;
  inset: 0;
  height: 100vh;              /* ✅ ek */
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: none;

  /* snap KAPALI (JS fullpage yapacak) */
  scroll-snap-type: none !important;
}
.section{
  height: 100vh;              /* şimdilik 100vh (dvh bug varsa sonra deneriz) */
  position: sticky;
  top: 0;
  overflow:hidden;
}

body.reduced .track{ transition:none; }


.media{
  position:absolute;
  inset:0;
  z-index:0;
  background:#000;
}
.media video, .media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform: scale(1.01);
}
.overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background: radial-gradient(80% 60% at 50% 50%, rgba(0,0,0,0), rgba(0,0,0,.45));
  pointer-events:none;
}

.cta-bottom{
  position:absolute;
  left:50%;
  bottom:26px;
  transform:translateX(-50%);
  z-index:2;
  text-align:center;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.95;
  user-select:none;
}
.cta-bottom .sub{ display:block; margin-top:2px; opacity:.8; }
.chev{ display:inline-flex; margin-top:6px; opacity:.75; animation:bounce 1.4s infinite; }
@keyframes bounce{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(4px)} }

.white{ background:#fff; color:#111; }

/* White section geldiğinde header rengi normalleşsin */
body.lightHeader .header{ mix-blend-mode: normal; }
body.lightHeader .nav-left > li > a,
body.lightHeader .iconbtn{ color:#111; }
body.lightHeader .brand{ color:#111; }
body.lightHeader .nav-left > li > a{ opacity:.85; }
body.lightHeader .nav-left > li > a:hover{ opacity:1; }

/* ========= CARD SECTION ========= */
.container{
  position:relative;
  z-index:2;
  max-width: var(--max);
  margin:0 auto;
  padding: calc(var(--headH) + 56px) var(--pad) 40px;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.cards{
  width:100%;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(22px, 4vw, 60px);
  justify-items:center;
}
.card{
  width:min(460px, 100%);
  text-align:center;
  text-decoration:none;
  color:inherit;
}
.imgwrap{
  width:100%;
  aspect-ratio: 3 / 4;
  background:#eee;
  overflow:hidden;
}
.imgwrap img{ width:100%; height:100%; object-fit:cover; display:block; }
.label{
  margin-top:14px;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:600;
}
.label span{ display:block; margin-top:2px; font-size:10px; opacity:.75; font-weight:500; }

/* ========= MOBILE: Kartlar ayrı section ========= */
.desktop-only{ display:block; }
.mobile-only{ display:none; }

/* ========= FOOTER fullscreen ========= */
.footer-wrap{
  max-width: var(--max);
  margin:0 auto;
  padding: calc(var(--headH) + 64px) var(--pad) 48px;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:24px;
}
.footer-top{
  display:grid;
  grid-template-columns: 1.1fr 1fr 1fr 1fr;
  gap:24px;
  font-size:12px;
  letter-spacing:.04em;
  color:#111;
}
.footer-top h4{
  margin:0 0 10px;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.footer-top a{
  color:#111;
  text-decoration:none;
  opacity:.85;
  display:block;
  margin:6px 0;
  font-size: 0.75rem;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 1rem;
}
.footer-top a:hover{ opacity:1; }
/* Footer social kesin ortalama */
.social{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:18px;
  padding: 18px 0 10px;
  opacity:1; /* istersen .85 kalsın */
}

.social .sbtn{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color:#111;
  opacity:.85;
}

.social .sbtn:hover{ opacity:1; }
.social .sbtn i{ font-size:18px; line-height:1; }



/* ========= DOTS ========= */
.dots{
  position:fixed;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  z-index:700;
  display:flex;
  flex-direction:column;
  gap:10px;
  pointer-events:none;
}
.dot{
  width:8px; height:8px;
  border-radius:50%;
  background: rgba(255,255,255,.35);
  border:1px solid rgba(255,255,255,.35);
}
body.lightDots .dot{
  background: rgba(0,0,0,.22);
  border-color: rgba(0,0,0,.22);
}
.dot.active{
  background: rgba(255,255,255,.95);
  border-color: rgba(255,255,255,.95);
}
body.lightDots .dot.active{
  background: rgba(0,0,0,.85);
  border-color: rgba(0,0,0,.85);
}

/* ========= MOBILE MENU ========= */
.burger{ display:none; }

.mnav{
  position:fixed;
  inset:0;
  z-index:1500;
  background: var(--menuBg);
  color: var(--menuText);
  display:none;
}
.mnav.open{ display:block; }

.mnav-top{
  height: var(--headH);
  padding: 0 var(--pad);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.mnav-top .left,
.mnav-top .right{
  display:flex;
  align-items:center;
  gap:10px;
}
.mnav-icon{
  width:44px; height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  background:transparent;
  font-size:20px;
  cursor:pointer;
  color: var(--menuText);
  opacity:.9;
  line-height:1;
}

.mnav-panels{
  position:absolute;
  inset: var(--headH) 0 0 0;
  overflow:hidden;
}
.mnav-panel{
  position:absolute;
  inset:0;
  overflow:auto;
  padding: 18px var(--pad) 28px;
  transition: transform 260ms ease;
  will-change: transform;
}

.mnav-panel.main{ transform: translateX(0); }
.mnav-panel.sub { transform: translateX(100%); }

.mnav.sub-open .mnav-panel.main{ transform: translateX(-100%); }
.mnav.sub-open .mnav-panel.sub { transform: translateX(0); }

.mnav-mainlist{
  min-height: calc(100vh - var(--headH) - 40px);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:32px;
  padding: 26px 0 12px;
}
.mnav-main{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:18px;
  margin-top: 10px;
}
.mnav-main button{
  border:0;
  background:transparent;
  cursor:pointer;
  font-size:18px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--menuText);
  padding: 6px 10px;
}
.mnav-main button .sq{ font-weight:900; margin-right:6px; }

.mnav-bottom{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  padding-bottom: 10px;
}
.mnav-bottom a{
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--menuText);
  text-decoration:none;
  opacity:.9;
}

.mnav-subhead{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-size:18px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding: 12px 0 18px;
}
.mnav-back{
  position:absolute;
  left: var(--pad);
  top: 12px;
  border:0;
  background:transparent;
  cursor:pointer;
  font-size:22px;
  color:var(--menuText);
  opacity:.9;
  line-height:1;
}

.acc{ border-top: 1px solid var(--line); }
.acc-item{ border-bottom: 1px solid var(--line); }
.acc-btn{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 16px 0;
  border:0;
  background:transparent;
  cursor:pointer;
  color:var(--menuText);
  font-size:14px;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-weight:700;
}
.acc-btn .v{
  opacity:.8;
  font-size:18px;
  transform: rotate(0deg);
  transition:.2s;
}
.acc-item.open .acc-btn .v{ transform: rotate(180deg); }

.acc-panel{ display:none; padding: 6px 0 18px; }
.acc-item.open .acc-panel{ display:block; }

.acc-panel a{
  display:block;
  padding: 10px 0;
  color:var(--menuText);
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:13px;
  opacity:.85;
}
.acc-panel a:hover{ opacity:1; }

/* ✅ Mega açıkken invert (difference) KAPAT → hover’da renk ters dönmez */
body.menuOpen .header{ mix-blend-mode: normal !important; }
body.menuOpen .nav-left > li > a,
body.menuOpen .iconbtn,
body.menuOpen .brand{ color:#111 !important; }

/* ========= Responsive =========
   ✅ Mobilde YSL yerleşke:
   SOL burger  | ORTA logo | SAĞ search+bag
   + renkler dark'ta beyaz, light'ta siyah
*/
@media (max-width: 900px){
  .header{ mix-blend-mode: difference; } /* dark default */
  body.lightHeader .header{ mix-blend-mode: normal !important; }

  /* Desktop mega nav mobilde kapalı */
  .nav-left{ display:none; }
  .burger{ display:inline-flex; }

  .iconbtn{ color: var(--fg); }
  .brand{ color: var(--fg); }

  .desktop-only{ display:none; }
  .mobile-only{ display:block; }

  .footer-top{ grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce){
  .chev{ animation:none; }
}













/* ============================
   LOGIN PAGE — reference style
   (body.inner ile aktif)
============================ */
body.inner{
  background:#fff;
  color:#111;
  overflow:auto;
}

/* İç sayfada fullpage elemanları varsa etkisiz */
body.inner .viewport{ position:static; inset:auto; overflow:visible; }
body.inner .track{ height:auto; width:auto; transform:none !important; transition:none !important; }
body.inner .section{ height:auto; background:transparent; }

/* Login layout */
.login-page{
  min-height: calc(100vh - var(--headH));
  padding-top: var(--headH);
}

.login-wrap{
  width: min(900px, 92%);
  margin: 0 auto;
  padding: 56px 0 80px;
  text-align:center;
}

.login-head{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  position:relative;
  margin-bottom: 34px;
}

.login-head h1{
  margin:0;
  font-size: 12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-weight:700;
}

.login-head .req{
  position:absolute;
  right:0;
  top:0;
  font-size: 11px;
  opacity:.85;
}

.login-form{
  width: min(640px, 100%);
  margin: 0 auto;
  text-align:left;
}

.lg-field{
  margin: 0 0 26px;
}

.lg-field label{
  display:block;
  font-size: 11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-weight:700;
  margin-bottom: 14px;
}

.lg-field input{
  width:100%;
  border:0;
  border-bottom: 1px solid rgba(0,0,0,.55);
  padding: 12px 0 14px;
  background:transparent;
  outline:none;
  font-size: 14px;
  color:#111;
}

.passline{
  display:flex;
  align-items:center;
  gap:10px;
  border-bottom: 1px solid rgba(0,0,0,.55);
}

.passline input{
  border-bottom:0;
  flex:1;
  padding: 12px 0 14px;
}

.eye{
  border:0;
  background:transparent;
  cursor:pointer;
  opacity:.7;
  font-size:14px;
  flex:0 0 auto;
}

.eye:hover{ opacity:1; }

.lg-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin: 8px 0 28px;
  font-size: 10px;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.remember{
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
}

.remember input{ transform: translateY(1px); }

.forgot{
  color:#111;
  text-decoration:none;
  opacity:.65;
  white-space:nowrap;
}

.forgot:hover{
  opacity:1;
  text-decoration:underline;
}

/* form içindeki buton inputlarla aynı genişlikte */
.login-form .lg-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:44px;
  margin:0;
  border:0;
  background:#000;
  color:#fff;
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
}

.login-form .lg-btn:hover{ filter: brightness(1.12); }

.create{
  width: min(640px, 100%);
  margin: 64px auto 0;
  text-align:center;
}

.create h2{
  margin:0 0 18px;
  font-size: 11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-weight:700;
}

.create p{
  margin:0 0 24px;
  font-size: 10px;
  line-height: 1.7;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.8;
}

/* alttaki buton da aynı hizaya gelsin */
.create .lg-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:44px;
  margin:0;
  border:0;
  background:#000;
  color:#fff;
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
}

.create .lg-btn:hover{ filter: brightness(1.12); }

/* mobilde req sağda taşmasın */
@media (max-width: 560px){
  .login-head .req{
    position:static;
    margin-left:auto;
    font-size:10px;
  }

  .login-head{
    justify-content:space-between;
    text-align:left;
    gap:12px;
  }

  .login-form,
  .create{
    width:100%;
  }

  .lg-row{
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
  }

  .forgot{
    white-space:normal;
  }
}



/* İç sayfa footer'da fullscreen davranışı kapat */
body.inner .footer-wrap{
  height:auto;
  padding: 60px var(--pad) 48px;
}
body.inner .footer-top{ color:#111; }
body.inner .social a{ color:#111; }
.fmenu{ list-style:none; padding:0; margin:0; }
.fmenu li{ margin:6px 0; }
.fmenu a{ color:#111; text-decoration:none; opacity:.85; }
.fmenu a:hover{ opacity:1; }


/* ============================
   REGISTER FIX (site.css)
   select + checkbox layout
============================ */

/* Select'i input gibi yap */
.selectline{
  position:relative;
  width:100%;
  border-bottom: 1px solid rgba(0,0,0,.55);
}
.selectline select{
  width:100%;
  border:0;
  background:transparent;
  outline:none;
  padding: 10px 26px 12px 0;  /* sağda ok için boşluk */
  font-size: 14px;
  color:#111;

  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
}
.selectline .sarr{
  position:absolute;
  right:0;
  bottom:12px;
  opacity:.7;
  pointer-events:none;
  font-size: 12px;
}

/* Checkboxlar alt alta + düzgün hizalı */
.lg-checks{
  margin: 6px 0 26px;
  display:flex;
  flex-direction:column;
  gap:12px;
  font-size: 10px;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.lg-check{
  display:flex;
  align-items:flex-start;
  gap:10px;
  cursor:pointer;
}

.lg-check input{
  transform: translateY(2px);
}

.lg-check span{
  opacity:.9;
  line-height: 1.6;
  letter-spacing:.08em;
}

/* eye button icon daha net olsun */
.eye i{ font-size:14px; }


/* ============================
   PRODUCTS PAGE (static html)
============================ */
.products-page{
  background:#fff;
  color:#111;
}

/* üst gri boş alan */
.products-hero{
  height: 340px;
  background:#d9d9d9;
}

/* ürün alanı */
.products-section{
  background:#fff;
}

.products-wrap{
  max-width: var(--max);
  margin:0 auto;
  padding: 34px var(--pad) 80px;
}

/* üst bar (FALL_SEASON / FILTER) */
.products-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom: 26px;
}

.products-bar a{
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  text-decoration:none;
  color:#111;
  opacity:.85;
  padding: 6px 0;
}
.products-bar a:hover{ opacity:1; }
.products-bar .v{ margin-left:6px; opacity:.65; }

/* grid: 3 kolon */
.pgrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 34px 56px;
  justify-items:center;
}

/* kart */
.pcard{
  width: min(260px, 100%);
  text-align:left;
}

.pimg{
  display:block;
  width:100%;
  background:#efefef;
}
.pimg img{
  width:100%;
  height:auto;
  display:block;
}

/* meta */
.pmeta{
  padding-top: 14px;
}

.pcol{
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#ff2b2b; /* kırmızı */
  margin-bottom: 6px;
}

.pname{
  font-size:12px;
  letter-spacing:.06em;
  text-transform:none;
  color:#111;
  margin-bottom: 12px;
}

/* siyah pill buton */
.pbtn{
  display:flex;
  align-items:center;
  justify-content:center;
  height: 34px;
  width: 100%;
  border-radius: 999px;
  background:#000;
  color:#fff;
  text-decoration:none;
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.pbtn:hover{ filter: brightness(1.12); }

/* responsive */
@media (max-width: 900px){
  .pgrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 28px;
  }
}
@media (max-width: 560px){
  .products-hero{ height: 220px; }
  .pgrid{
    grid-template-columns: 1fr;
  }
  .pcard{ width: min(340px, 100%); }
}


/* ============================
   CONTACT PAGE (static html)
============================ */
.contact-page{
  min-height: calc(100vh - var(--headH));
  padding-top: var(--headH);
  background:#fff;
  color:#111;
}

.contact-wrap{
  width: min(820px, 92%);
  margin: 0 auto;
  padding: 56px 0 80px;
  text-align:center;
}

/* başlık ortada */
.contact-head h1{
  margin:0 0 36px;
  font-size: 12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-weight:700;
}

/* form */
.contact-form{
  width: min(680px, 100%);
  margin: 0 auto;
  text-align:left;
}

.cgrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px 54px;
}

/* login’deki underline mantığıyla aynı */
.cfield label{
  display:block;
  font-size: 11px;
  letter-spacing:.06em;
  margin-bottom: 14px;
}

.cfield input,
.cfield textarea{
  width:100%;
  border:0;
  border-bottom: 1px solid rgba(0,0,0,.55);
  padding: 10px 0 12px;
  background:transparent;
  outline:none;
  font-size: 14px;
  color:#111;
  resize:none;
}

/* message tam geniş */
.cfull{ grid-column: 1 / -1; }

/* SEND butonu (siyah bar) */
.cbtn{
  display:flex;
  align-items:center;
  justify-content:center;
  width: min(520px, 100%);
  height: 42px;
  margin: 46px auto 0;
  border:0;
  background:#000;
  color:#fff;
  font-size: 11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  cursor:pointer;
}
.cbtn:hover{ filter: brightness(1.12); }

/* officials alanı */
.contact-officials{
  width: min(520px, 100%);
  margin: 44px auto 0;
  text-align:center;
}

.contact-officials h2{
  margin: 0 0 18px;
  font-size: 13px;
  font-weight:600;
}

.official-item{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:10px;
  margin: 12px 0;
  font-size: 12px;
}

.oi-ico{
  width:18px;
  text-align:center;
  opacity:.9;
}

.oi-txt{
  text-align:left;
}

.oi-title{
  font-size: 11px;
  font-weight:600;
  opacity:.9;
  margin-bottom: 2px;
}

.oi-val{
  font-size: 12px;
  opacity:.85;
}

/* alttaki siyah pill */
.contact-pill{
  display:flex;
  align-items:center;
  justify-content:center;
  width: 220px;
  height: 30px;
  margin: 22px auto 0;
  border-radius: 999px;
  background:#000;
  color:#fff;
  text-decoration:none;
  font-size: 11px;
  letter-spacing:.08em;
}
.contact-pill:hover{ filter: brightness(1.12); }

/* responsive */
@media (max-width: 680px){
  .cgrid{
    grid-template-columns: 1fr;
    gap: 22px;
  }
}



/* ============================
   GENERIC PAGE (sayfa.php)
============================ */
.page-page{
  min-height: calc(100vh - var(--headH));
  padding-top: var(--headH);
  background:#fff;
  color:#111;
}

.page-wrap{
  width: min(820px, 92%);
  margin: 0 auto;
  padding: 48px 0 90px;
}

/* bloklar arası boşluk */
.pblock{
  text-align:center;
  margin: 0 0 64px;
}

/* görsel ortak */
.pimg{
  background:#d9d9d9;
  overflow:hidden;
  margin: 0 auto;
}

.pimg img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* hero büyük yatay */
.pimg-hero{
  width: min(640px, 100%);
  aspect-ratio: 16 / 7;
}

/* kare görsel (ortada) */
.pimg-square{
  width: min(360px, 100%);
  aspect-ratio: 1 / 1;
}

/* metin alanı */
.ptext{
  width: min(520px, 92%);
  margin: 22px auto 0;
  text-align:left;
  font-size: 11px;
  line-height: 1.8;
  opacity:.85;
  letter-spacing:.02em;
}

/* responsive */
@media (max-width: 560px){
  .page-wrap{ padding: 36px 0 70px; }
  .pblock{ margin-bottom: 52px; }
  .ptext{ font-size: 12px; }
}


/* ============================
   COLLECTIONS HERO — FULL BLEED + BITIŞIK
============================ */
.collections-hero{
  background:#fff;
  padding-top: var(--headH);
}

/* max-width KULLANMIYORUZ -> full width */
.collections-hero .cstack{
  width:100%;
  margin:0;
  padding:0;
}

/* bloklar bitişik */
.collections-hero .cblock{
  margin:0;              /* ✅ boşluk yok */
  padding:0;
}

/* full width banner */
.collections-hero .cimg{
  width:100%;
  height: 260px;         /* istediğin gibi ayarla */
  background:#d9d9d9;
  overflow:hidden;

  /* çizgiler (screenshot gibi) */
  border-top: 1px solid rgba(0,0,0,.35);
  border-bottom: 1px solid rgba(0,0,0,.35);
}

.collections-hero .cimg img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* üstte ilk banner'ın üst border'ını istemiyorsan */
.collections-hero .cblock:first-child .cimg{
  border-top: 0;
}

/* responsive */
@media (max-width: 560px){
  .collections-hero .cimg{ height: 200px; }
}

/* ✅ SADECE BU SAYFA: header ile yapışmayı kes */
.oz-account-page{
  padding-top: 120px;
  padding-bottom: 60px;
}
@media (max-width: 991px){
  .oz-account-page{ padding-top: 96px; }
}

/* Layout */
.oz-acc-wrap{ max-width:1180px; margin:0 auto; padding:0 22px; }
.oz-acc-grid{ display:grid; grid-template-columns:260px 1fr; gap:34px; align-items:start; }
@media (max-width: 991px){ .oz-acc-grid{ grid-template-columns:1fr; } }

/* Sidebar (partial da bunu kullanıyor) */
.oz-acc-side{ border-right:1px solid rgba(0,0,0,.12); padding-right:26px; }
@media (max-width: 991px){
  .oz-acc-side{ border-right:0; border-bottom:1px solid rgba(0,0,0,.12); padding-right:0; padding-bottom:18px; }
}
.oz-acc-side h4{ margin:0 0 14px; font-size:13px; letter-spacing:.10em; font-weight:700; }
.oz-acc-nav{ list-style:none; margin:0; padding:0; }
.oz-acc-nav li a{
  display:block; padding:7px 0; font-size:12px; letter-spacing:.08em;
  text-transform:uppercase; color:rgba(0,0,0,.78); text-decoration:none;
}
.oz-acc-nav li a:hover{ color:#000; }
.oz-acc-nav li a.is-active{ font-weight:700; color:#000; }

/* Main head */
.oz-acc-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:22px; }
.oz-acc-title{ font-size:22px; font-weight:700; margin:0; }
.oz-acc-user{ display:flex; align-items:center; gap:10px; color:rgba(0,0,0,.72); font-size:13px; }
.oz-acc-user i{ font-size:16px; }

/* Avatar */
.oz-acc-avatar{
  width:56px; height:56px; border-radius:999px; border:1px solid rgba(0,0,0,.10);
  display:flex; align-items:center; justify-content:center;
  font-weight:700; color:rgba(0,0,0,.70); background:#fff;
  box-shadow:0 6px 22px rgba(0,0,0,.08);
  margin:10px 0 18px;
}

/* Field rows */
.oz-field{ display:grid; grid-template-columns:1fr 170px; gap:18px; align-items:end; padding:14px 0; }
@media (max-width: 680px){ .oz-field{ grid-template-columns:1fr; } }
.oz-field label{ display:block; font-size:13px; color:rgba(0,0,0,.75); margin-bottom:8px; }

.oz-input{
  width:100%; border:0; border-bottom:1px solid rgba(0,0,0,.28);
  padding:10px 0; font-size:13px; outline:none; background:transparent; color:#000;
}
.oz-input:disabled{ color:rgba(0,0,0,.55); }

.oz-actions{ display:flex; align-items:center; justify-content:flex-end; gap:10px; }
.oz-linkbtn{
  border:0; background:transparent; padding:0;
  font-size:12px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:rgba(0,0,0,.70); cursor:pointer;
}
.oz-linkbtn:hover{ color:#000; }
.oz-save{
  display:none; border:1px solid rgba(0,0,0,.28); background:#fff;
  padding:8px 14px; border-radius:999px; font-size:12px; cursor:pointer;
}
.oz-save:hover{ border-color:rgba(0,0,0,.6); }

.oz-note{ margin-top:10px; font-size:12px; color:rgba(0,0,0,.62); }

/* Bottom CTA */
.oz-cta{ margin-top:28px; display:flex; justify-content:center; }
.oz-cta a{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:260px; height:44px; border-radius:999px;
  background:#111; color:#fff; text-decoration:none; font-size:13px;
}
.oz-cta a:hover{ filter:brightness(.95); }

/* Toast */
.oz-toast{
  position:fixed; right:18px; bottom:18px;
  background:#111; color:#fff; padding:12px 14px; border-radius:10px;
  font-size:13px; opacity:0; transform:translateY(10px);
  transition:.22s ease; z-index:9999;
}
.oz-toast.show{ opacity:1; transform:translateY(0); }
/* ✅ 2. section ve sonrası: alttan açılan sheet */
.track .section:not(:first-child){
  z-index: 2;

}

/* ✅ üst kenar gölgesi (leaf hissi) */
.track .section:not(:first-child)::before{
  content:"";
  position:absolute;
  left:0; right:0;
  top:-1px;
  height:34px;
  pointer-events:none;
  z-index:3;
  opacity: calc(var(--reveal) * .9);
  background: radial-gradient(110% 120% at 50% 0%,
  rgba(0,0,0,.36),
  rgba(0,0,0,0) 70%);
}

/* ✅ white section’da gölge daha soft */
.track .section.white:not(:first-child)::before{
  background: radial-gradient(110% 120% at 50% 0%,
  rgba(0,0,0,.18),
  rgba(0,0,0,0) 70%);
}

@media (prefers-reduced-motion: reduce){
  .track .section:not(:first-child){ clip-path:none; }
  .track .section:not(:first-child)::before{ display:none; }
}
/* ✅ FIX: White section'da köşe sızıntısı (kahverengi) olmasın */
.track .section.white:not(:first-child){
  --sheetR: 0px !important; /* round kapat */
  clip-path: inset(0 0 calc((1 - var(--reveal)) * 100%) 0) !important; /* roundsuz */
}

/* ✅ ekstra garanti: sheet dışındaki alan beyaz dursun */
.viewport{ background:#fff; }
/* ✅ FIX: köşelerdeki radial/gradient parlamayı kes */
.track .section:not(:first-child)::before{
  left: 10vw !important;
  right: 10vw !important;     /* köşelere değmesin */
  height: 28px !important;
  opacity: calc(var(--reveal) * .65) !important;
  background: radial-gradient(120% 140% at 50% 0%,
  rgba(0,0,0,.22),
  rgba(0,0,0,0) 70%) !important;
  border-radius: 999px !important; /* şerit gibi yumuşasın */
}

/* white section zaten soft kalsın ama köşe yok */
.track .section.white:not(:first-child)::before{
  left: 12vw !important;
  right: 12vw !important;
  opacity: calc(var(--reveal) * .55) !important;
  background: radial-gradient(120% 140% at 50% 0%,
  rgba(0,0,0,.12),
  rgba(0,0,0,0) 72%) !important;
}
/* ✅ JS geç çalışırsa / hata alırsa sayfa yarım kalmasın */
html:not(.oz-js) .track .section:not(:first-child){
  clip-path: none !important;
}
html:not(.oz-js) .track .section:not(:first-child)::before{
  display:none !important;
}
/* ===========================
   ✅ KÖŞE ALANLARINI YOK ET (TEK NOKTA FIX)
   =========================== */

/* 1) HERO üzerindeki vignette (köşe kararması) KAPAT */
.section > .overlay{
  background: none !important;
}

/* 2) Section geçişindeki üst radial gölge KAPAT (köşe parlaması) */
.track .section:not(:first-child)::before{
  content: none !important;
  display: none !important;
}