/* =====================================================================
   KILIM (theme secondaire d'Ajaniste). La page est un kilim sur son metier :
   en haut la poutre du metier (selecteur de theme), d'ou tombent les chaines
   (sacak), puis les bandes de teinture.

   Module m = 8 px. Case de tissage C = 10 / 8 / 6 / 4 px selon la largeur.
   Lettre : Ajaniste Dokuma v2, dessinee pour cette marque (1 em = 64 demi-cases),
   reservee aux titres. Tout texte courant et tout libelle : Alegreya Sans.
   La trame (duites) n'existe que sur les motifs et les grands titres :
   aucun texte courant n'est pose sur une texture.

   KOK BOYA : kokboya #A82A1E, civit #1B2C5A, ceviz #2F1C12, ham yun #EDE1C8,
   cehri #DCA722, yesil #2B5B45, patlican #4A1A35.
   Sens : ham yun = toi, cehri = l'agent.
   ===================================================================== */
@font-face{font-family:"Alegreya Sans";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/AlegreyaSans-500-latin-ext.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Alegreya Sans";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/AlegreyaSans-500-latin.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:"Alegreya Sans";font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/AlegreyaSans-800-latin-ext.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Alegreya Sans";font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/AlegreyaSans-800-latin.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: "Ajaniste Dokuma"; src: url(../fonts/AjanisteDokuma.woff) format("woff"); font-display: block; }
:root {
  color-scheme: light;
  --C: 8px;
  --kenar-n: 3;
  --kenar: calc(var(--C) * var(--kenar-n));
  --pad: calc(var(--C) * 4);
  --bas-h: 56px;
  --bant-n: 60;
  --kiris-h: 44px;
  --sacak-h: 16px;
  --kok: #A82A1E; --civit: #1B2C5A; --ceviz: #2F1C12; --yun: #EDE1C8; --cehri: #DCA722; --yesil: #2B5B45; --patlican: #4A1A35;
  --zemin: #1F120B;
  --a: "Alegreya Sans", "Trebuchet MS", sans-serif;
  --metin: 500 22px/32px var(--a);
  --metin-b: 500 32px/40px var(--a);
  --metin-o: 500 26px/36px var(--a);
  --metin-k: 500 19px/28px var(--a);
  --gut: calc(2 * var(--kenar) + 2 * var(--pad));
}
@media (min-width: 1800px) { :root { --C: 10px; --metin: 500 26px/40px var(--a); --metin-b: 500 38px/48px var(--a); --metin-o: 500 32px/44px var(--a); --metin-k: 500 22px/32px var(--a); } }
@media (max-width: 1359px) { :root { --C: 6px; --metin-b: 500 28px/36px var(--a); --metin-o: 500 24px/32px var(--a); } }
@media (max-width: 949px)  { :root { --C: 4px; --metin-b: 500 26px/34px var(--a); --metin-o: 500 22px/30px var(--a); --pad: 16px; } }
@media (max-width: 639px)  { :root { --kenar-n: 2; --bant-n: 58; --sacak-h: 12px; --metin: 500 20px/29px var(--a); --metin-b: 500 23px/31px var(--a); --metin-o: 500 21px/29px var(--a); --metin-k: 500 18px/25px var(--a); } }

* { box-sizing: border-box; font-variant-numeric: lining-nums !important; }
html { background: var(--zemin); -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 16px; }
body { margin: 0; background: var(--zemin); color: var(--yun); font: var(--metin); overflow-x: clip; font-kerning: normal; }
h1, h2, h3, p, ul, ol, dl, dd, dt, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
a { color: inherit; }
canvas { display: block; image-rendering: pixelated; }
button, input, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 4px solid var(--yun); outline-offset: 4px; }
.z-s :focus-visible, .z-y :focus-visible, .hazir :focus-visible { outline-color: var(--civit); }

.gizli { position: absolute; left: -9999px; }
.gizli:focus { left: 16px; top: 8px; z-index: 30; background: var(--yun); color: var(--ceviz); padding: 8px 16px; min-height: 44px; }

/* Poutre du metier : le selecteur de theme */
.kiris { display: flex; align-items: stretch; justify-content: flex-end; gap: 4px; min-height: var(--kiris-h); padding-inline: calc(var(--kenar) + var(--pad)); background: var(--zemin); font: 500 17px/20px var(--a); }
.kiris-ad { display: flex; align-items: center; margin-right: 8px; color: #C9B99E; }
.kiris a { position: relative; display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding-inline: 8px; color: var(--yun); text-decoration: none; }
.kiris a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.kiris a:focus-visible { outline: 3px solid var(--yun); outline-offset: -3px; }
.kiris a[aria-current="page"] { font-weight: 800; color: var(--cehri); gap: 6px; }
.kiris a[aria-current="page"]::before { content: ""; width: 10px; height: 10px; background: currentColor; clip-path: polygon(40% 0, 60% 0, 60% 20%, 80% 20%, 80% 40%, 100% 40%, 100% 60%, 80% 60%, 80% 80%, 60% 80%, 60% 100%, 40% 100%, 40% 80%, 20% 80%, 20% 60%, 0 60%, 0 40%, 20% 40%, 20% 20%, 40% 20%); }
.kiris a[aria-current="page"]::after { content: ""; position: absolute; left: 4px; right: 4px; bottom: 4px; height: 3px; background: currentColor; }
@media (max-width: 639px) { .kiris { justify-content: flex-start; padding-inline: 12px; gap: 0; font-size: 16px; } .kiris-ad { margin-right: 4px; } .kiris a { padding-inline: 6px; } }

/* Dokuma */
.d-dev, .d-iki, .d-uc { font-family: "Ajaniste Dokuma", "Arial Black", Impact, sans-serif; font-weight: 400; font-synthesis: none; }
.d-dev { font-size: min(calc(var(--C) * 32), calc((100vw - var(--gut)) / 4.84)); line-height: .66em; }
.d-iki { font-size: min(calc(var(--C) * 13), calc((100vw - var(--gut)) / 4.9)); line-height: .84em; }
.d-uc  { font-size: calc(var(--C) * 7); line-height: .9em; }
@media (max-width: 949px) { .d-iki { font-size: 72px; } .d-uc { font-size: 44px; } }
@media (max-width: 639px) {
  .d-dev { font-size: min(calc((100vw - var(--gut)) / 2.9), 128px); line-height: .72em; }
  .d-iki { font-size: min(calc((100vw - var(--gut)) / 6), 60px); line-height: .92em; }
  .d-uc { font-size: min(calc((100vw - var(--gut)) / 7.2), 40px); line-height: 1em; }
}

/* Bandes : aplats mats, aucune trame sous le texte */
.z-k { background: var(--kok); }
.z-c { background: var(--civit); }
.z-w { background: var(--ceviz); }
.z-y { background: var(--yun); color: var(--ceviz); }
.z-s { background: var(--cehri); color: var(--ceviz); }
.z-g { background: var(--yesil); }
.z-p { background: var(--patlican); }
.yaz-y { color: var(--yun); } .yaz-s { color: var(--cehri); } .yaz-k { color: var(--kok); } .yaz-c { color: var(--civit); }

.kilim { position: relative; overflow: clip; }
.kenar { position: absolute; top: 0; bottom: 0; width: var(--kenar); background-color: var(--ceviz); background-repeat: repeat-y; z-index: 3; image-rendering: pixelated; pointer-events: none; }
.kenar.sol { left: 0; }
.kenar.sag { right: 0; }
.alan { position: relative; }
.ic { position: relative; z-index: 1; margin-inline: var(--kenar); padding-inline: var(--pad); }
.dis { position: absolute; left: 0; top: -1px; z-index: 0; pointer-events: none; }

.sacak { display: block; width: 100%; height: var(--sacak-h); background: var(--zemin); }
.sacak-alt { display: block; width: 100%; height: 32px; }

/* Bas */
.bas { position: relative; height: var(--bas-h); display: flex; align-items: center; justify-content: space-between; z-index: 4; background: var(--ceviz); padding-inline: calc(var(--kenar) + var(--pad)); }
.bas > a, .bas nav { position: relative; z-index: 1; }
.logo { display: block; width: 150px; height: 44px; padding-block: 2px; }
.logo svg { display: block; width: 100%; height: 100%; }
.bas nav { display: flex; gap: 32px; align-items: center; }
.bas nav a { display: flex; align-items: center; min-height: 48px; font: 800 22px/28px var(--a); color: var(--yun); text-decoration: none; }
.bas nav a:hover { color: var(--cehri); }
@media (max-width: 949px) { .bas nav a:not(:last-child) { display: none; } .bas .logo { width: 130px; } }

/* Cagri : l'etiquette tissee qui renvoie au formulaire */
.cagri { display: inline-flex; align-items: center; min-height: 52px; margin-top: 24px; padding: 8px 24px; background: var(--cehri); color: var(--ceviz); font: 800 22px/28px var(--a); text-decoration: none;
  clip-path: polygon(8px 0, calc(100% - 8px) 0, calc(100% - 8px) 8px, calc(100% - 4px) 8px, calc(100% - 4px) 16px, 100% 16px, 100% calc(100% - 16px), calc(100% - 4px) calc(100% - 16px), calc(100% - 4px) calc(100% - 8px), calc(100% - 8px) calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 8px calc(100% - 8px), 4px calc(100% - 8px), 4px calc(100% - 16px), 0 calc(100% - 16px), 0 16px, 4px 16px, 4px 8px, 8px 8px); }
.cagri:hover { background: var(--yun); }
.cagri:focus-visible { clip-path: none; }
.cagri-c { background: var(--civit); color: var(--yun); }
.cagri-c:hover { background: var(--ceviz); }

/* GIRIS */
.giris { position: relative; overflow: clip; }
.giris > canvas { position: absolute; left: 0; top: 0; z-index: 0; }
.giris .ic { padding-top: calc(var(--C) * 3); padding-bottom: calc(var(--C) * 4); }
.js .giris { padding-bottom: calc(var(--C) * var(--bant-n)); }
.giris h1 { position: relative; }
.giris h1 .s1, .giris h1 .s2 { display: block; }
.giris .s1 { color: var(--yun); }
.giris .s2 { color: var(--cehri); margin-top: .05em; }
.tezgah-hazir .giris .s1 { background-image: var(--t-y); }
.tezgah-hazir .giris .s2 { background-image: var(--t-s); }
.tezgah-hazir .giris .s1, .tezgah-hazir .giris .s2, .tezgah-hazir .d-son {
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  padding-block: .2em .24em; margin-block: -.2em -.24em;
}
.tezgah-hazir .giris .s2 { margin-top: -.15em; }
.giris-yazi { margin-top: calc(var(--C) * 7); max-width: 42em; font: var(--metin-b); }
.sira { display: block; margin-top: 24px; padding: 12px; background-color: var(--ceviz); background-image: repeating-linear-gradient(90deg, #8A7158 0 1px, transparent 1px var(--C)); text-decoration: none; color: var(--ceviz); }
.sira-yaka { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 12px 16px; background: var(--cehri); }
.sira-a { display: block; white-space: nowrap; }
.sira-b { display: block; font: 800 24px/32px var(--a); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 5px; }
.sira:hover .sira-yaka { background: var(--yun); }
.sira:focus-visible { outline-color: var(--yun); }
.js .sira { position: absolute; z-index: 2; margin: 0; padding: calc(var(--C) * 2); }
@media (max-width: 639px) {
  .giris .ic { padding-top: 8px; padding-bottom: 16px; }
  .giris h1 .k { display: block; }
  .giris-yazi { margin-top: 28px; }
  .js .sira { position: relative; margin-top: 16px; padding: 8px; }
  .sira-a { font-size: min(calc((100vw - 80px) / 4.6), 48px); }
  .sira-yaka { padding: 10px 14px; }
}

/* CASUS */
.casus .ic { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: calc(var(--C) * 6); padding-block: calc(var(--C) * 8) calc(var(--C) * 16); }
.casus h2 { grid-column: 1 / -1; color: var(--yun); }
.casus-yazi { grid-column: 1; grid-row: 2; margin-top: calc(var(--C) * 5); margin-left: calc(var(--C) * 14); max-width: 44em; }
.koc-yan { grid-column: 2; grid-row: 2; margin-top: calc(var(--C) * 5); width: calc(var(--C) * 35); }
.casus .tanim { font: var(--metin-b); color: var(--cehri); max-width: 24em; }
.casus .uzun { margin-top: 20px; }
.not { font: var(--metin-k); }
.not b { display: block; margin-bottom: 4px; font: 800 24px/28px var(--a); }
.koc-yan .not { margin-top: 16px; }
@media (max-width: 949px) {
  .casus .ic { display: block; padding-block: 32px 72px; }
  .casus-yazi { margin-left: 0; margin-top: 20px; }
  .koc-yan { display: flex; gap: 16px; align-items: center; width: auto; margin-top: 24px; }
  .koc-yan canvas { flex: none; }
  .koc-yan .not { margin-top: 0; }
}

/* NASIL */
.nasil { padding-block: calc(var(--C) * 14) calc(var(--C) * 8); overflow: clip; }
.nasil h2 { position: absolute; right: var(--pad); top: 0; text-align: right; color: var(--civit); }
.adim { --i: 0; position: relative; margin-left: calc(var(--i) * var(--C) * 14); padding: 0 0 calc(var(--C) * 7) calc(var(--C) * 6); }
.adim::before, .adim::after { content: ""; position: absolute; left: 0; background: var(--civit); }
.adim::before { top: 0; bottom: 0; width: calc(var(--C) * 2); }
.adim::after { bottom: 0; width: calc(var(--C) * 16); height: calc(var(--C) * 2); }
.adim:last-child { padding-bottom: 0; }
.adim:last-child::after { display: none; }
.adim h3 { color: var(--ceviz); }
.adim h3 .kim { color: var(--kok); }
.adim p { margin-top: 8px; max-width: 31em; }
.su-not { position: absolute; left: var(--pad); bottom: 0; width: calc(var(--C) * 36); }
@media (max-width: 1099px) { .nasil h2 { position: static; text-align: left; margin-bottom: 32px; } }
@media (max-width: 949px) {
  .nasil { padding-block: 72px 40px; }
  .adim { margin-left: calc(var(--i) * 8px); padding-left: 24px; padding-bottom: 24px; }
  .adim::before { width: 12px; }
  .adim::after { width: 20px; height: 12px; }
  .adim h3 .kim { display: inline; }
  .su-not { position: static; width: auto; margin-top: 28px; }
}

/* ORNEKLER */
.ornekler { padding-block: calc(var(--C) * 12) calc(var(--C) * 10); }
.ornekler .ic { position: static; }
.ornek-ic { margin-right: calc(var(--C) * 45); }
.ornekler h2 { color: var(--yun); }
.ornek-giris { max-width: 36em; margin-top: 20px; }
.tezgah { margin-top: calc(var(--C) * 6); display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); column-gap: calc(var(--C) * 6); }
.kartlar { display: flex; flex-direction: column; gap: 8px; }
.kart { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding: 8px 16px; background: var(--yun); color: var(--ceviz); font: 800 20px/24px var(--a); text-decoration: none; width: 100%; transition: transform .16s steps(2); }
.js .kart:hover { transform: translateX(8px); }
.kart[aria-current="true"] { background: var(--cehri); transform: translateX(24px); }
.js .kart[aria-current="true"]:hover { transform: translateX(24px); }
.kart canvas { flex: none; margin-left: 8px; width: auto; max-height: 36px; image-rendering: auto; }
.senaryolar { display: grid; min-width: 0; }
.ornek { min-width: 0; }
.ornek + .ornek { margin-top: 48px; }
.js .ornek { grid-area: 1 / 1; }
.js .ornek + .ornek { margin-top: 0; }
.js .ornek[data-gizli="1"] { visibility: hidden; }
html:not(.js) .onay, html:not(.js) .serit-not, html:not(.js) .seritci, html:not(.js) .cozgu, html:not(.js) .tezgah-son, html:not(.js) .bag, html:not(.js) .goz-yan, html:not(.js) .koc-yan canvas, html:not(.js) .desen canvas { display: none; }
html:not(.js) .ornek-ic { margin-right: 0; }
html:not(.js) .sonsoz .ic { display: block; }
.etiket { display: inline-block; padding: 2px 10px; background: var(--cehri); color: var(--ceviz); font: 800 18px/24px var(--a); }
.kim-yaz { display: block; margin-top: 16px; font: 800 22px/28px var(--a); }
.ornek .ist { font: var(--metin-o); color: var(--yun); margin-top: 4px; }
.ornek ol { margin-top: 4px; color: var(--cehri); }
.ornek ol li { position: relative; padding-left: 24px; }
.ornek ol li::before { content: ""; position: absolute; left: 0; top: 12px; width: 12px; height: 8px; background: var(--cehri); }
.ornek .sonuc { font: 800 26px/32px var(--a); color: var(--cehri); margin-top: 12px; }
.ornek .motif-ad { font: var(--metin-k); color: var(--yun); margin-top: 12px; }
.ornek .benzer { display: inline-flex; align-items: center; min-height: 48px; margin-top: 4px; font: 800 22px/32px var(--a); color: var(--yun); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; }
.ornek .benzer:hover { color: var(--cehri); }
.cozgu { position: absolute; top: calc(var(--C) * 8); bottom: 0; right: calc(var(--kenar) + var(--pad)); width: calc(var(--C) * 39); background-image: repeating-linear-gradient(90deg, var(--yun) 0 1px, transparent 1px var(--C)); z-index: 0; }
.cozgu::before, .tezgah-son::before, .seritci::before { content: ""; position: absolute; left: calc(var(--C) * -1); right: calc(var(--C) * -1); top: 0; height: calc(var(--C) * 2); background: var(--cehri); }
.cozgu canvas { position: absolute; left: 0; bottom: 0; }
.mekik { position: absolute; left: 0; top: 0; width: calc(var(--C) * 4); height: var(--C); background: var(--yun); z-index: 2; pointer-events: none; }
@media (max-width: 949px) {
  .ornekler { padding-block: 40px 40px; }
  .ornek-ic { margin-right: 0; }
  .tezgah { display: block; margin-top: 24px; }
  .kartlar { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .kart-gen { grid-column: 1 / -1; }
  .kart[aria-current="true"], .js .kart[aria-current="true"]:hover, .js .kart:hover { transform: none; }
  .kart[aria-current="true"] { outline: 3px solid var(--yun); outline-offset: 2px; }
  .kart { min-height: 52px; padding: 6px 10px; font-size: 19px; }
  .cozgu { position: relative; top: auto; right: auto; width: 100%; height: calc(var(--C) * 36); margin-top: 16px; }
  .cozgu::before { left: 0; right: 0; }
  .senaryolar { margin-top: 12px; }
}

/* HEYBE */
.heybe-alan { padding-top: calc(var(--C) * 8); padding-bottom: calc(var(--C) * 10); }
.heybe-alan h2 { color: var(--yun); }
.heybe-bas p { color: var(--yun); margin-top: 20px; margin-left: calc(var(--C) * 14); max-width: 40em; }
.heybe { display: grid; grid-template-columns: minmax(0, 1fr) calc(var(--C) * 17) minmax(0, 1fr); margin-top: calc(var(--C) * 5); align-items: stretch; }
.cep { position: relative; padding: calc(var(--C) * 5) calc(var(--C) * 5) calc(var(--C) * 13); min-width: 0; }
.cep canvas { position: absolute; left: 0; top: 0; z-index: 0; }
.cep > * { position: relative; z-index: 1; }
.cep h3 { color: var(--cehri); }
.cep ul { margin-top: 12px; font: var(--metin-o); color: var(--yun); }
.cep li + li { margin-top: 6px; }
.cep-git { display: inline-flex; align-items: center; min-height: 48px; margin-top: 8px; font: 800 22px/28px var(--a); color: var(--yun); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; }
.cep-git:hover { color: var(--cehri); }
.bag { position: relative; }
.bag canvas { margin-inline: auto; }
.heybe-alt { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 48px; margin-top: calc(var(--C) * 3); }
.bag-not { flex: 1 1 24em; max-width: 44em; color: var(--yun); }
.bag-not b { color: var(--cehri); }
.heybe-alt .cagri { margin-top: 0; }
@media (max-width: 949px) {
  .heybe-alan { padding-block: 40px 40px; }
  .heybe-bas p { margin-left: 0; margin-top: 16px; }
  .heybe { display: block; margin-top: 24px; }
  .bag { padding-block: 0; }
  .cep { padding: 20px 16px 44px; }
  .heybe-alt { margin-top: 20px; }
}

/* SON SOZ */
.sonsoz { padding-top: calc(var(--C) * 16); padding-bottom: calc(var(--C) * 8); }
.sonsoz .ic { display: grid; grid-template-columns: minmax(0, 1fr) calc(var(--C) * 41); column-gap: calc(var(--C) * 6); }
.d-son { font-size: min(calc(var(--C) * 24), calc((100vw - var(--gut)) / 3.2)); line-height: .8em; color: var(--kok); }
.tezgah-hazir .d-son { background-image: var(--t-k); }
.sonsoz .yazi { margin-top: calc(var(--C) * 6); margin-left: calc(var(--C) * 14); max-width: 30em; font: var(--metin-o); }
.onay { position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; margin-top: 20px; margin-left: calc(var(--C) * 14); }
.dugme { display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding: 8px 24px; border: 0; background: var(--ceviz); color: var(--yun); font: 800 24px/28px var(--a); cursor: pointer; text-decoration: none; }
.dugme:hover { background: var(--civit); }
.dugme[disabled] { background: none; color: var(--ceviz); padding-inline: 0; cursor: default; }
.durum { font: var(--metin-k); }
.tezgah-son { position: relative; align-self: stretch; min-height: calc(var(--C) * 62); background-image: repeating-linear-gradient(90deg, var(--ceviz) 0 1px, transparent 1px var(--C)); margin-top: calc(var(--C) * -4); margin-bottom: calc(var(--C) * -8); }
.tezgah-son canvas { position: absolute; left: 0; bottom: 0; }
.eli-not { margin-top: 20px; margin-left: calc(var(--C) * 14); max-width: 30em; }
@media (max-width: 949px) {
  .sonsoz { padding-block: 72px 32px; }
  .sonsoz .ic { display: block; }
  .d-son { font-size: min(calc((100vw - var(--gut)) / 3.3), 112px); }
  .sonsoz .yazi, .onay, .eli-not { margin-left: 0; }
  .sonsoz .yazi { margin-top: 20px; }
  .tezgah-son { width: calc(var(--C) * 41); max-width: 100%; margin: 24px auto 0; min-height: calc(var(--C) * 62); }
}

/* SSS */
.sss { padding-block: calc(var(--C) * 9) calc(var(--C) * 16); }
.sss h2 { color: var(--yun); margin-bottom: calc(var(--C) * 5); }
.goz-yan { float: right; width: calc(var(--C) * 39); margin-left: calc(var(--C) * 6); }
.sss .ic::after { content: ""; display: block; clear: both; }
.soru h3 { color: var(--cehri); }
.soru p { margin-top: 6px; font: var(--metin-o); max-width: 31em; }
.soru + .soru { margin-top: calc(var(--C) * 5); }
.goz-not { margin-top: 12px; }
.sss-cagri { margin-top: 16px; }
@media (max-width: 949px) {
  .sss { padding-block: 40px 72px; }
  .sss h2 { margin-bottom: 24px; }
  .soru + .soru { margin-top: 20px; }
}


/* FORM */
.istek { padding-block: calc(var(--C) * 12) calc(var(--C) * 12); }
.istek h2 { color: var(--yun); }
.istek-ic { display: grid; grid-template-columns: minmax(0, 1fr) calc(var(--C) * 33); column-gap: calc(var(--C) * 7); margin-top: calc(var(--C) * 5); }
.istek .alt { font: var(--metin-o); max-width: 36em; }
form { margin-top: 12px; }
.alanci { margin-top: 20px; }
.alanci label { display: block; font: 800 22px/28px var(--a); color: var(--yun); }
input, textarea { display: block; width: 100%; margin-top: 6px; padding: 10px 14px; border: 0; border-radius: 0; background: var(--yun); color: var(--ceviz); font: 500 22px/30px var(--a); }
input { min-height: 52px; }
textarea { min-height: 136px; resize: vertical; }
input::placeholder, textarea::placeholder { color: #6A5A49; opacity: 1; }
.alanci-iki { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); column-gap: 24px; }
.gonder { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 20px; }
.dugme-s { background: var(--cehri); color: var(--ceviz); }
.dugme-s:hover { background: var(--yun); }
.hata { margin-top: 16px; font: 800 22px/32px var(--a); background: var(--yun); color: var(--kok); display: inline-block; padding: 0 8px; }
.gizlilik { font: var(--metin-k); max-width: 26em; }
.hazir { margin-top: 24px; padding: 20px; background: var(--yun); color: var(--ceviz); }
.hazir strong { display: block; font: 800 24px/32px var(--a); color: var(--kok); }
.hazir pre { margin: 12px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font: 500 22px/30px var(--a); }
.hazir .wa { display: flex; width: 100%; margin-top: 16px; min-height: 60px; background: var(--kok); color: var(--yun); }
.hazir .wa:hover { background: var(--ceviz); }
.kopya { display: inline-flex; align-items: center; min-height: 48px; margin-top: 8px; padding: 0; border: 0; background: none; color: var(--ceviz); font: 800 22px/32px var(--a); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; cursor: pointer; }
.dogrudan { margin-top: 24px; font: var(--metin); }
.dogrudan a { display: inline-flex; align-items: center; min-height: 48px; font: 800 30px/36px var(--a); color: var(--yun); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; white-space: nowrap; }
.dogrudan a:hover { color: var(--cehri); }
.seritci { position: relative; min-height: calc(var(--C) * 72); width: calc(var(--C) * 32); background-image: repeating-linear-gradient(90deg, var(--yun) 0 1px, transparent 1px var(--C)); }
.seritci canvas { position: absolute; left: 0; bottom: 0; }
.serit-not { font: var(--metin-k); margin-top: 8px; }
@media (max-width: 949px) {
  .istek { padding-block: 72px 40px; }
  .istek-ic { display: block; margin-top: 20px; }
  .seritci { min-height: 0; width: 100%; height: 64px; background-image: repeating-linear-gradient(0deg, var(--yun) 0 1px, transparent 1px 4px); margin-top: 28px; }
  .seritci::before { display: none; }
  .alanci-iki { display: block; }
  .alanci { margin-top: 16px; }
}
@media (max-width: 379px) { .dogrudan a { font-size: 26px; } }

/* SOZLUK */
.sozluk { padding-top: calc(var(--C) * 10); padding-bottom: calc(var(--C) * 4); }
.sozluk h2 { color: var(--yun); }
.sozluk .giris-not { margin-top: 16px; max-width: 34em; }
.desenler { display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 32px 16px; margin-top: calc(var(--C) * 6); align-items: end; }
.desen { grid-column: span 4; min-width: 0; }
.desen.gen { grid-column: span 6; }
.desen.dar { grid-column: span 3; }
.desen.orta { grid-column: span 5; }
.desen canvas { margin-bottom: 12px; max-width: 100%; }
.desen b { display: block; font: 800 24px/28px var(--a); color: var(--cehri); }
.desen span { display: block; font: var(--metin-k); margin-top: 4px; }
.kusur { margin-top: calc(var(--C) * 7); font: var(--metin-o); max-width: 28em; color: var(--yun); }
.kolay { margin-top: calc(var(--C) * 6); }
.son { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 48px; margin-top: calc(var(--C) * 6); padding-bottom: calc(var(--C) * 2); font: var(--metin-k); }
.son a { color: inherit; }
.son-git { display: flex; flex-direction: column; }
.son-git a, .son-tel a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 800; }
.son-tel { line-height: 30px; }
.boya { max-width: 22em; }
@media (max-width: 949px) {
  .sozluk { padding-block: 40px 16px; }
  .desenler { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 12px; margin-top: 20px; align-items: start; }
  .desen, .desen.gen, .desen.dar, .desen.orta { grid-column: auto; }
  .desen canvas { margin-bottom: 8px; }
  .desen canvas { height: auto !important; width: auto !important; max-height: 96px; }
  .desen b { font-size: 18px; line-height: 22px; }
  .desen span { display: none; }
  .kusur { margin-top: 24px; }
  .kolay { margin-top: 24px; }
  .son { margin-top: 24px; flex-direction: column; align-items: flex-start; }
}

/* Telephone : un yolluk. Les notes de motifs vivent dans le glossaire du bas. */
@media (max-width: 639px) {
  body { font: 500 20px/28px var(--a); }
  .uzun-2, .su-not, .bag-not, .eli-not, .goz-yan, .motif-ad, .boya { display: none; }
  .heybe-alt { justify-content: flex-start; }
  .son-git { flex-direction: row; flex-wrap: wrap; gap: 0 20px; }
  .son { gap: 8px; }
  .sonsoz .tezgah-son { min-height: calc(var(--C) * 54); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .kart { transition: none; }
}
