/* Mikkel Spa — derlendi: araclar/derle.mjs (yön: gunduz-gece) */

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('../tasarim/fontlar/cormorant-garamond/cormorant-garamond-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url('../tasarim/fontlar/cormorant-garamond/cormorant-garamond-latin-wght-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../tasarim/fontlar/jost/jost-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Jost';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('../tasarim/fontlar/jost/jost-latin-wght-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Marcellus';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../tasarim/fontlar/marcellus/marcellus-latin-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../tasarim/fontlar/manrope/manrope-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../tasarim/fontlar/fraunces/fraunces-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('../tasarim/fontlar/fraunces/fraunces-latin-wght-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../tasarim/fontlar/dm-mono/dm-mono-latin-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../tasarim/fontlar/dm-mono/dm-mono-latin-500-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('../tasarim/fontlar/cormorant-garamond/cormorant-garamond-latin-ext-wght-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url('../tasarim/fontlar/cormorant-garamond/cormorant-garamond-latin-ext-wght-italic.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../tasarim/fontlar/jost/jost-latin-ext-wght-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Jost';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('../tasarim/fontlar/jost/jost-latin-ext-wght-italic.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Marcellus';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../tasarim/fontlar/marcellus/marcellus-latin-ext-400-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../tasarim/fontlar/manrope/manrope-latin-ext-wght-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../tasarim/fontlar/fraunces/fraunces-latin-ext-wght-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('../tasarim/fontlar/fraunces/fraunces-latin-ext-wght-italic.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../tasarim/fontlar/dm-mono/dm-mono-latin-ext-400-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../tasarim/fontlar/dm-mono/dm-mono-latin-ext-500-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}


:root {
  
  --ms-krem-mermer: #E8DED1;   
  --ms-fildisi: #E4DDCE;       
  --ms-tezgah: #D4C6AC;        
  --ms-kum-tas: #C7BBA7;       
  --ms-petrol: #224256;        
  --ms-ayna-mozaik: #325B6C;   
  --ms-mozaik-mavi: #386888;   
  --ms-pirinc: #725C38;        
  --ms-fume-mese: #6E5C4A;     
  --ms-fume-mese-oluk: #645342;
  --ms-mese-lambri: #C3A073;   
  
  --renk-kagit: #F6F1E9;       
  --renk-yuzey: #FBF8F3;       
  --renk-tas: #E6DDCD;         
  --renk-murekkep: #2B241D;    
  --renk-murekkep-2: #5E5246;  
  --renk-petrol: #224256;      
  --renk-petrol-koyu: #1D3A4C;
  --renk-petrol-gece: #0F2A38; 
  --renk-petrol-gece-2: #163746;
  --renk-pirinc: #B08D57;      
  --renk-pirinc-metin: #6F5429;
  --renk-pirinc-acik: #D4B477; 
  --renk-mese-koyu: #3B2E24;   
  --renk-krem-metin: #EFE6D6;  
  --renk-sis: #9FB0B8;         
  
  --font-cormorant: 'Cormorant Garamond', 'Cormorant', Garamond, 'Times New Roman', serif;
  --font-marcellus: 'Marcellus', 'Trajan Pro', Georgia, serif;
  --font-fraunces: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-jost: 'Jost', 'Futura', 'Avenir Next', system-ui, sans-serif;
  --font-manrope: 'Manrope', 'Avenir Next', system-ui, sans-serif;
  --font-mono: 'DM Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  
  --fs--2: clamp(0.75rem, 0.73rem + 0.08vw, 0.8125rem);
  --fs--1: clamp(0.8125rem, 0.79rem + 0.12vw, 0.9rem);
  --fs-0: clamp(1rem, 0.96rem + 0.18vw, 1.125rem);
  --fs-1: clamp(1.2rem, 1.11rem + 0.4vw, 1.45rem);
  --fs-2: clamp(1.45rem, 1.28rem + 0.8vw, 1.95rem);
  --fs-3: clamp(1.8rem, 1.45rem + 1.6vw, 2.9rem);
  --fs-4: clamp(2.3rem, 1.65rem + 2.9vw, 4.3rem);
  --fs-5: clamp(2.8rem, 1.75rem + 4.7vw, 6.2rem);
  --lh-siki: 1.05;
  --lh-baslik: 1.15;
  --lh-govde: 1.6;
  --iz-genis: 0.18em;          
  
  --sp-1: 0.25rem; --sp-2: 0.5rem; --sp-3: 0.75rem; --sp-4: 1rem; --sp-5: 1.5rem;
  --sp-6: 2rem; --sp-7: 3rem; --sp-8: 4rem; --sp-9: 6rem; --sp-10: 8rem;
  --sp-bolum: clamp(4rem, 2.6rem + 6vw, 9rem);
  --kenar-boslugu: clamp(1rem, 0.5rem + 2.5vw, 3rem);  
  --genislik-metin: 38rem;
  --genislik-icerik: 76rem;
  --yaricap-1: 2px; --yaricap-2: 6px; --yaricap-hap: 999px;
  --kemer: 100vmax 100vmax 0 0;                        
  --cizgi: 1px;
  --golge-1: 0 1px 2px rgb(43 36 29 / 0.06), 0 8px 24px rgb(43 36 29 / 0.08);
  --gecis-hizli: 160ms;
  --gecis: 320ms;
  --egri: cubic-bezier(0.2, 0.7, 0.2, 1);
  --odak-halka: 3px;
}
:root,
[data-yon="mermer"] {
  --zemin: var(--renk-kagit);
  --zemin-2: var(--renk-yuzey);
  --zemin-3: var(--renk-tas);
  --metin: var(--renk-murekkep);
  --metin-2: var(--renk-murekkep-2);
  --vurgu: var(--renk-petrol);
  --vurgu-uzeri: #FFFFFF;
  --sus: var(--renk-pirinc);
  --sus-metin: var(--renk-pirinc-metin);
  --cizgi-renk: rgb(43 36 29 / 0.14);
  --odak: var(--renk-petrol);
  --font-baslik: var(--font-cormorant);
  --font-govde: var(--font-jost);
  --baslik-agirlik: 400;
  --baslik-harf: -0.01em;
}
[data-yon="gece"] {
  --zemin: var(--renk-petrol-gece);
  --zemin-2: var(--renk-petrol-gece-2);
  --zemin-3: #0B202B;
  --metin: var(--renk-krem-metin);
  --metin-2: var(--renk-sis);
  --vurgu: var(--renk-pirinc-acik);
  --vurgu-uzeri: var(--renk-petrol-gece);
  --sus: #C9A464;
  --sus-metin: var(--renk-pirinc-acik);
  --cizgi-renk: rgb(239 230 214 / 0.16);
  --odak: var(--renk-pirinc-acik);
  --font-baslik: var(--font-marcellus);
  --font-govde: var(--font-jost);
  --baslik-agirlik: 400;
  --baslik-harf: 0.01em;
}
:root {
  --aksam-1: #E6DDCD;  
  --aksam-2: #D9C7A7;  
  --aksam-3: #9C8262;  
  --aksam-4: #3B4A50;  
  --aksam-5: #0F2A38;  
  --aksam-gecis: linear-gradient(180deg, var(--aksam-1) 0%, var(--aksam-2) 22%, var(--aksam-3) 46%, var(--aksam-4) 74%, var(--aksam-5) 100%);
}
[data-yon="kemer"] {
  --zemin: var(--renk-tas);
  --zemin-2: var(--renk-yuzey);
  --zemin-3: var(--renk-mese-koyu);
  --metin: var(--renk-murekkep);
  --metin-2: var(--renk-murekkep-2);
  --vurgu: var(--renk-petrol);
  --vurgu-uzeri: #FFFFFF;
  --sus: var(--renk-pirinc);
  --sus-metin: var(--renk-pirinc-metin);
  --cizgi-renk: rgb(43 36 29 / 0.18);
  --odak: var(--renk-petrol);
  --font-baslik: var(--font-fraunces);
  --font-govde: var(--font-manrope);
  --baslik-agirlik: 360;
  --baslik-harf: -0.015em;
}


*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 4.5rem; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
body {
  margin: 0;
  background: var(--zemin);
  color: var(--metin);
  font-family: var(--font-govde);
  font-size: var(--fs-0);
  line-height: var(--lh-govde);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, picture, svg { display: block; max-width: 100%; height: auto; }
picture img { width: 100%; }
a { color: inherit; text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
h1, h2, h3 {
  font-family: var(--font-baslik);
  font-weight: var(--baslik-agirlik);
  letter-spacing: var(--baslik-harf);
  line-height: var(--lh-baslik);
  margin: 0 0 var(--sp-4);
  text-wrap: balance;
}
h1 { font-size: var(--fs-5); line-height: var(--lh-siki); }
h2 { font-size: var(--fs-4); }
h3 { font-size: var(--fs-2); }
p { margin: 0 0 var(--sp-4); max-width: var(--genislik-metin); text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; list-style: none; }
figure { margin: 0; }
:focus-visible { outline: var(--odak-halka) solid var(--odak); outline-offset: 3px; border-radius: 2px; }
.atla {
  position: absolute; left: var(--sp-4); top: -100px; z-index: 100;
  background: var(--metin); color: var(--zemin); padding: var(--sp-2) var(--sp-4); border-radius: var(--yaricap-2);
}
.atla:focus { top: var(--sp-4); }
.maket-serit {
  margin: 0; max-width: none; text-align: center; font: 500 var(--fs--2)/1.8 var(--font-mono);
  background: #000; color: #fff; letter-spacing: 0.04em;
}
.kap { width: 100%; max-width: var(--genislik-icerik); margin-inline: auto; padding-inline: var(--kenar-boslugu); }
.kap--dar { max-width: calc(var(--genislik-metin) + 2 * var(--kenar-boslugu)); }
.bolum { padding-block: var(--sp-bolum); }
.bolum__bas { margin-bottom: var(--sp-7); }
.ust-baslik {
  font-family: var(--font-govde); font-size: var(--fs--1); font-weight: 500;
  letter-spacing: var(--iz-genis); text-transform: uppercase; color: var(--sus-metin); margin-bottom: var(--sp-3);
}
.giris { font-size: var(--fs-1); line-height: 1.5; color: var(--metin-2); }
.dipnot { font-size: var(--fs--1); color: var(--metin-2); margin-top: var(--sp-5); }
.ipucu { font-size: var(--fs--1); color: var(--metin-2); }
.no { font-family: var(--font-mono); font-size: 0.8em; letter-spacing: 0.02em; color: var(--sus-metin); }
.dalga {
  height: 12px; background: var(--sus);
  -webkit-mask: url(../tasarim/motif/dalga.svg) repeat-x left center / auto 100%;
  mask: url(../tasarim/motif/dalga.svg) repeat-x left center / auto 100%;
}
.kemer { border-radius: var(--kemer); overflow: hidden; isolation: isolate; }
.kemer picture, .kemer img { height: 100%; object-fit: cover; }
.eylemler { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: center; margin-top: var(--sp-6); }
.dugme {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
  min-height: 48px; padding: 0.7rem 1.4rem; border-radius: var(--yaricap-hap);
  font: 500 var(--fs--1)/1.2 var(--font-govde); letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none;
  border: 1px solid transparent; transition: background var(--gecis-hizli) var(--egri), color var(--gecis-hizli) var(--egri), border-color var(--gecis-hizli);
}
.dugme--ana { background: var(--vurgu); color: var(--vurgu-uzeri); }
.dugme--ana:hover { filter: brightness(1.08); }
.dugme--cizgi { border-color: currentColor; color: var(--metin); }
.dugme--cizgi:hover { background: var(--metin); color: var(--zemin); }
.dugme--kucuk { min-height: 40px; padding: 0.4rem 1rem; border-color: var(--vurgu); color: var(--vurgu); }
.bag { display: inline-flex; align-items: center; gap: 0.4em; font-weight: 500; text-decoration: none; color: var(--vurgu); min-height: 44px; }
.bag:hover { text-decoration: underline; }
.ok { width: 1em; height: 1em; transition: transform var(--gecis-hizli) var(--egri); }
.bag:hover .ok { transform: translateX(3px); }
.marka { font-family: var(--font-baslik); font-size: var(--fs-1); text-decoration: none; letter-spacing: 0.02em; }
.ust__ic { display: flex; align-items: center; gap: var(--sp-5); min-height: 4rem; }
.ust__menu { margin-left: auto; }
.menu { display: flex; gap: var(--sp-5); font-size: var(--fs--1); }
.menu a { text-decoration: none; padding-block: var(--sp-2); }
.menu a:hover { text-decoration: underline; }
.dil { font: 500 var(--fs--1)/1 var(--font-mono); text-decoration: none; border: 1px solid var(--cizgi-renk); border-radius: var(--yaricap-hap); padding: 0.55rem 0.8rem; min-width: 44px; text-align: center; }
@media (max-width: 859px) {
  .ust__menu { display: none; }
  .dil { margin-left: auto; }
}
.olgular { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6) var(--sp-5); margin: var(--sp-8) 0 0; }
@media (min-width: 860px) { .olgular { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.olgu { display: flex; flex-direction: column-reverse; gap: var(--sp-2); border-top: 1px solid var(--cizgi-renk); padding-top: var(--sp-4); }
.olgu dd { margin: 0; font-family: var(--font-baslik); font-size: var(--fs-3); line-height: 1; color: var(--metin); }
.olgu dt { font-size: var(--fs--1); color: var(--metin-2); }
.malzeme-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6) var(--sp-5); }
@media (min-width: 700px) { .malzeme-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .malzeme-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.malzeme__resim img { aspect-ratio: 1; object-fit: cover; }
.malzeme__ad { font-family: var(--font-baslik); font-size: var(--fs-1); line-height: 1.25; margin: var(--sp-3) 0 var(--sp-1); }
.malzeme__yer { font-size: var(--fs--1); color: var(--metin-2); margin: 0; }
.malzeme__kod { font: 400 var(--fs--2)/1.4 var(--font-mono); color: var(--metin-2); margin: var(--sp-3) 0 0; }
.plan { position: relative; }
.plan__cizim { width: 100%; }
.plan__oda {
  position: absolute; display: flex; align-items: center; justify-content: center; text-align: center;
  text-decoration: none; font-size: clamp(0.62rem, 0.5rem + 0.5vw, 0.85rem); line-height: 1.15; font-weight: 500;
  color: var(--metin); background: transparent; transition: background var(--gecis-hizli);
  padding: 2px;
}
.plan__oda span { background: var(--zemin-2); padding: 0.15em 0.45em; border-radius: var(--yaricap-1); box-shadow: 0 0 0 1px var(--cizgi-renk); }
.plan__oda:hover, .plan__oda:focus-visible { background: color-mix(in srgb, var(--vurgu) 16%, transparent); }
.plan__oda--camasir span, .plan__oda--yangin span { font-size: 0.85em; }
.plan__nokta {
  position: absolute; transform: translate(-50%, -50%); width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center; background: var(--renk-petrol); color: #fff; text-decoration: none;
  font: 500 0.64rem/1 var(--font-mono); box-shadow: 0 0 0 2px var(--zemin-2);
}
@media (max-width: 599px) { .plan__nokta, .ipucu__noktalar { display: none; } }
.sunum__liste { display: grid; gap: var(--sp-4); margin-top: var(--sp-6); }
@media (min-width: 700px) { .sunum__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sunum__kart { border: 1px solid var(--cizgi-renk); border-radius: var(--yaricap-2); padding: var(--sp-5); }
.sunum__ad { font-family: var(--font-baslik); font-size: var(--fs-2); margin: 0; }
.sunum__meta { font-size: var(--fs--1); color: var(--metin-2); margin: var(--sp-1) 0 var(--sp-4); }
.sunum__durum { font: 500 var(--fs--2)/1 var(--font-mono); text-transform: uppercase; letter-spacing: 0.1em; color: var(--sus-metin); margin: 0; }
.alt { padding-bottom: var(--sp-8); }
.alt .dalga { margin-bottom: var(--sp-7); }
.alt__ic p { font-size: var(--fs--1); color: var(--metin-2); }
.marka--alt { font-size: var(--fs-2) !important; color: var(--metin) !important; }
.alt__kredi { font-family: var(--font-mono); }
.alt__dil .dil { display: inline-block; }
.ozellikler { display: grid; gap: var(--sp-2); margin: var(--sp-5) 0; }
.ozellikler li { padding-left: 1.4em; position: relative; }
.ozellikler li::before { content: ""; position: absolute; left: 0; top: 0.72em; width: 0.8em; height: 1px; background: var(--sus); }
.gorunmez { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.cerceve { position: relative; }
.rozet3d {
  position: absolute; right: var(--sp-3); bottom: var(--sp-3); z-index: 2;
  display: inline-flex; align-items: center; gap: 0.35em; min-height: 32px; min-width: 44px; justify-content: center;
  padding: 0.3rem 0.6rem; border-radius: var(--yaricap-hap); text-decoration: none;
  background: rgb(251 248 243 / 0.92); color: var(--renk-petrol); box-shadow: 0 1px 6px rgb(0 0 0 / 0.18);
  font: 500 0.72rem/1 var(--font-mono); letter-spacing: 0.04em;
  transition: background var(--gecis-hizli), color var(--gecis-hizli);
}
.rozet3d::after { content: ""; position: absolute; inset: -6px; } 
.rozet3d:hover { background: var(--renk-petrol); color: #fff; }
.kup { width: 1.05em; height: 1.05em; }
.kemer-kare .rozet3d { bottom: auto; top: 46%; right: var(--sp-2); }
.plan__olcek { position: absolute; left: 2%; bottom: 2%; margin: 0; height: 6px; border: 1.5px solid var(--metin); border-top: 0; }
.plan__olcek span { position: absolute; left: 0; bottom: 8px; font: 500 0.66rem/1 var(--font-mono); color: var(--metin-2); white-space: nowrap; }
.sunum__bag { display: grid; grid-template-columns: 1fr auto; gap: var(--sp-1) var(--sp-4); align-items: center; text-decoration: none; min-height: 44px; }
.sunum__bag .sunum__ad { grid-column: 1; }
.sunum__bag .sunum__meta { grid-column: 1; margin: 0; }
.sunum__bag .ok { grid-column: 2; grid-row: 1 / span 2; width: 1.4em; height: 1.4em; }
.tur3d[hidden] { display: none; }


[data-yon="gece"] { background: var(--zemin); color: var(--metin); }
.ust { border-bottom: 1px solid var(--cizgi-renk); }
.marka { display: flex; align-items: baseline; gap: var(--sp-3); font-size: var(--fs-2); }
.marka__etiket { font: 500 var(--fs--2)/1 var(--font-govde); letter-spacing: var(--iz-genis); text-transform: uppercase; color: var(--metin-2); }
@media (max-width: 859px) {
  .ust__ic { flex-wrap: wrap; row-gap: 0; }
  .ust__menu { display: block; order: 3; width: 100%; margin: 0; overflow-x: auto; scrollbar-width: none; mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .ust__menu::-webkit-scrollbar { display: none; }
  .ust__menu .menu { gap: var(--sp-5); white-space: nowrap; padding: 0 var(--sp-6) var(--sp-2) 0; }
  .ust__menu .menu a { display: inline-flex; align-items: center; min-height: 44px; }
}
@media (max-width: 520px) { .marka__etiket { display: none; } }
h1, h2 { font-weight: 300; }
h2 { max-width: 18ch; }
h3 { font-size: var(--fs-3); font-weight: 400; }
[data-yon="gece"] h1, [data-yon="gece"] h2, [data-yon="gece"] h3 { font-weight: 400; }
.kapak { display: grid; gap: var(--sp-7); padding-block: var(--sp-7) var(--sp-8); align-items: center; }
.kapak__gorsel { order: -1; width: 100%; max-width: 28rem; margin-inline: auto; }
.kapak__gorsel .kemer { aspect-ratio: 4 / 5; box-shadow: var(--golge-1); }
.kapak__gorsel figcaption, .oda__ana figcaption { font-size: var(--fs--1); color: var(--metin-2); margin-top: var(--sp-3); }
@media (min-width: 960px) {
  .kapak { grid-template-columns: 1.1fr 0.9fr; gap: var(--sp-9); padding-block: var(--sp-9); min-height: calc(100svh - 4rem); }
  .kapak__gorsel { order: 0; max-width: none; }
}
.dalga--orta { max-width: 14rem; margin: 0 auto; opacity: 0.9; }
.kavram h2 { max-width: 20ch; }
.kavram .kap--dar p:not(.ust-baslik):not(.koken) { font-size: var(--fs-1); line-height: 1.6; color: var(--metin); }
.koken { font-family: var(--font-baslik); font-style: italic; font-size: var(--fs-2) !important; color: var(--sus-metin) !important; }
.mozaik-bant { position: relative; }
.mozaik img { width: 100%; height: clamp(9rem, 26vw, 24rem); object-fit: cover; }
.mozaik figcaption { font-size: var(--fs--1); color: var(--metin-2); padding-top: var(--sp-3); }
.mekanlar { background: var(--zemin-2); }
.oda { display: grid; gap: var(--sp-6); padding-block: var(--sp-8); border-top: 1px solid var(--cizgi-renk); }
.oda__ana img { border-radius: var(--yaricap-2); aspect-ratio: 3 / 2; object-fit: cover; }
.oda__metin p { color: var(--metin-2); }
.oda__kucuk { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin: var(--sp-5) 0 var(--sp-4); }
.oda__kucuk li { width: clamp(7rem, 20vw, 10rem); }
.oda__kucuk img { border-radius: var(--yaricap-1); aspect-ratio: 3 / 2; object-fit: cover; }
.oda__kucuk figcaption { font-size: var(--fs--2); line-height: 1.35; color: var(--metin-2); margin-top: var(--sp-2); }
.oda__kucuk .rozet3d { right: 4px; bottom: 4px; min-height: 28px; padding: 0.2rem 0.45rem; }
@media (min-width: 960px) {
  .oda { grid-template-columns: 1.45fr 1fr; gap: var(--sp-8); align-items: center; }
  .oda--ters .oda__ana { order: 2; }
}
.malzeme__resim { display: block; border-radius: var(--kemer); overflow: hidden; }
.malzeme__resim img { aspect-ratio: 3 / 4; }
.plan-bolum { background: var(--aksam-1); }
.plan-bolum__izgara { display: grid; gap: var(--sp-7); }
@media (min-width: 960px) { .plan-bolum__izgara { grid-template-columns: 0.7fr 1.3fr; align-items: center; } }
.levha { background: var(--renk-kagit); border: 1px solid var(--cizgi-renk); padding: clamp(0.5rem, 0.2rem + 1.4vw, 1.5rem); box-shadow: var(--golge-1); }
.plan__nokta::before { 
  content: ""; position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: -11px 0 0 -11px; z-index: -1;
  background: conic-gradient(from 60deg, transparent 0 0, color-mix(in srgb, var(--renk-petrol) 35%, transparent) 0 60deg, transparent 60deg);
  border-radius: 50%; transform-origin: 50% 50%; scale: 2.2;
}
.alacakaranlik { height: clamp(12rem, 34vh, 26rem); background: var(--aksam-gecis); }
.tur { position: relative; min-height: 92svh; display: grid; align-items: center; overflow: hidden; isolation: isolate; text-align: center; }
.tur__arka { position: absolute; inset: 0; z-index: -2; }
.tur__arka img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.75); }
.tur__perde { position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, var(--renk-petrol-gece) 0%, rgb(15 42 56 / 0.45) 22%, rgb(15 42 56 / 0.55) 60%, var(--renk-petrol-gece) 100%),
              radial-gradient(ellipse at center, rgb(15 42 56 / 0.2), rgb(15 42 56 / 0.85)); }
.tur__ic { display: grid; justify-items: center; padding-block: var(--sp-9); text-shadow: 0 1px 16px rgb(15 42 56 / 0.7); }
.tur__ic p { margin-inline: auto; }
.tur h2 { font-size: var(--fs-4); max-width: 16ch; }
.tur__daire { width: 11rem; height: 11rem; border-radius: 50%; display: grid; place-items: center; margin: var(--sp-6) 0;
  border: 1px solid var(--sus); color: var(--sus-metin); text-decoration: none; font-family: var(--font-marcellus);
  font-size: var(--fs-0); line-height: 1.3; letter-spacing: 0.06em; padding: var(--sp-4); text-shadow: none;
  background: rgb(15 42 56 / 0.45); backdrop-filter: blur(4px); box-shadow: 0 0 0 6px rgb(212 180 119 / 0.12), 0 0 60px rgb(212 180 119 / 0.18);
  transition: background var(--gecis), color var(--gecis), box-shadow var(--gecis); }
.tur__daire:hover { background: var(--sus); color: var(--renk-petrol-gece); box-shadow: 0 0 0 10px rgb(212 180 119 / 0.18), 0 0 80px rgb(212 180 119 / 0.3); }
.tur .ozellikler { justify-items: center; }
.tur .ozellikler li { padding-left: 0; }
.tur .ozellikler li::before { display: none; }
.tur .dipnot { color: var(--metin-2); }
.gece-alan .sunum__kart { border-color: rgb(201 164 100 / 0.35); }
.alt[data-yon="gece"] { padding-top: var(--sp-7); }
.sayfa-404 { min-height: 70vh; }


.plan__oda--koridor{left:7.128%;top:44.158%;width:69.149%;height:16.158%}
.plan__oda--soyunma_1{left:31.330%;top:5.382%;width:27.128%;height:36.829%}
.plan__oda--masaj{left:59.521%;top:5.382%;width:26.330%;height:36.816%}
.plan__oda--soyunma_2{left:6.883%;top:62.329%;width:26.021%;height:28.184%}
.plan__oda--sauna{left:34.500%;top:62.355%;width:27.670%;height:28.158%}
.plan__oda--camasir{left:77.606%;top:44.158%;width:14.309%;height:22.605%}
.plan__oda--yangin{left:63.766%;top:60.316%;width:12.234%;height:15.803%}
.plan__nokta--10{left:60.957%;top:83.434%}
.plan__nokta--11{left:78.426%;top:45.026%}
.plan__nokta--12{left:89.043%;top:47.316%}
.plan__nokta--01{left:8.457%;top:52.487%}
.plan__nokta--02{left:74.457%;top:53.118%}
.plan__nokta--03{left:47.436%;top:38.145%}
.plan__nokta--04{left:39.234%;top:26.211%}
.plan__nokta--05{left:16.926%;top:64.684%}
.plan__nokta--06{left:10.032%;top:82.750%}
.plan__nokta--07{left:84.287%;top:39.763%}
.plan__nokta--08{left:84.266%;top:7.224%}
.plan__nokta--09{left:59.862%;top:65.605%}
.plan__olcek{width:10.638%}
.plan__nokta--10::before{transform:rotate(-135deg)}
.plan__nokta--11::before{transform:rotate(40deg)}
.plan__nokta--12::before{transform:rotate(134deg)}
.plan__nokta--01::before{transform:rotate(0deg)}
.plan__nokta--02::before{transform:rotate(180deg)}
.plan__nokta--03::before{transform:rotate(-121deg)}
.plan__nokta--04::before{transform:rotate(42deg)}
.plan__nokta--05::before{transform:rotate(107deg)}
.plan__nokta--06::before{transform:rotate(-46deg)}
.plan__nokta--07::before{transform:rotate(-135deg)}
.plan__nokta--08::before{transform:rotate(119deg)}
.plan__nokta--09::before{transform:rotate(154deg)}

html.tur3d-acik, html.tur3d-acik body { overflow: hidden; }
.tur3d { position: fixed; inset: 0; z-index: 1000; height: 100vh; height: 100dvh; background: var(--zemin); color: var(--metin); }
.tur3d__sahne {
  position: absolute; inset: 0;
  --ae-accent: var(--vurgu);
  --ae-accent-text: var(--vurgu);
  --ae-on-accent: var(--vurgu-uzeri);
  --ae-bg: var(--zemin);
  --ae-bg-gradient: radial-gradient(ellipse at 50% 42%, var(--zemin-2) 0%, var(--zemin) 62%, var(--zemin-3) 100%);
  --ae-fg: var(--metin);
  --ae-muted: var(--metin-2);
  --ae-line: var(--cizgi-renk);
  --ae-ring: var(--odak);
  --ae-poche: var(--metin);
  --ae-font: var(--font-govde);
}
.tur3d__durum {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: var(--sp-4); text-align: center;
  font-size: var(--fs-0); color: var(--metin-2); max-width: min(30rem, 86vw);
}
.tur3d__durum:empty { display: none; }
.tur3d__kapat {
  position: absolute; z-index: 3; top: max(env(safe-area-inset-top), 12px); right: max(env(safe-area-inset-right), 12px);
  min-height: 44px; padding: 0.55rem 1rem; border-radius: var(--yaricap-hap); border: 1px solid var(--cizgi-renk);
  background: var(--zemin-2); color: var(--metin); font: 500 var(--fs--1)/1 var(--font-govde); cursor: pointer;
}
.tur3d[data-durum="hazir"] .tur3d__kapat { display: none; } 
.tur-hazirlik { padding: var(--sp-2) var(--sp-3); border-left: 2px solid var(--sus); }
.vurgula { animation: vurgula 1.8s var(--egri) 1; }
@keyframes vurgula {
  0%, 100% { background: transparent; }
  25% { background: color-mix(in srgb, var(--sus) 28%, transparent); }
}