/* yesilyurtgrup.com — katalog/002 (bölünmüş ekran) iskeleti; AÇIK zemin, palet logodan (orman yeşili + altın/kahve + krem kâğıt).
   🔴 Fotoğraf kolonu sınırlı (1fr büyütmez), kutu içinde ortalı; son satır boşluğu yok (flex + ortala); başlık yapışkan DEĞİL (Ö-14). */
@font-face{font-family:Fraunces;font-weight:700;font-style:normal;font-display:swap;src:url(/assets/fonts/fraunces-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,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-weight:700;font-style:normal;font-display:swap;src:url(/assets/fonts/fraunces-700-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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Figtree;font-weight:300 900;font-style:normal;font-display:swap;src:url(/assets/fonts/figtree-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Figtree;font-weight:300 900;font-style:normal;font-display:swap;src:url(/assets/fonts/figtree-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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --krem:#f6efde; --krem2:#eee3c8; --kagit:#fffdf6;
  --yesil:#1f4a2f; --yesil-koyu:#173a25; --altin:#b8923a; --kahve:#7a5c20;
  --ink:#2a2118; --soluk:#5c5346; --cizgi:#d6c9a8;
  --wa:#15804a; --wa-koyu:#116a3d;
  --bas:Fraunces,Georgia,"Times New Roman",serif; --govde:Figtree,system-ui,-apple-system,"Segoe UI",sans-serif;
  --olcu:1200px; --mini:56px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--mini) + 12px)}
body{margin:0;background:var(--krem);color:var(--ink);font:400 clamp(16px,.4vw + 14.5px,18px)/1.65 var(--govde);-webkit-text-size-adjust:100%}
::selection{background:var(--altin);color:var(--ink)}
h1,h2,h3,p,ul,ol,figure,blockquote,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:4px}
:focus-visible{outline:3px solid var(--altin);outline-offset:3px}
.atla{position:absolute;left:8px;top:-60px;background:var(--yesil);color:#fff;padding:12px 16px;z-index:60}
.atla:focus{top:8px}
.kapsa{width:min(100% - 32px,var(--olcu));margin-inline:auto}
.ikon{width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ikon-wa{width:1.25em;height:1.25em;flex:none;fill:currentColor}
.soluk{color:var(--soluk)}

/* ---- düğmeler (eş boyut, tek satır) ---- */
.dugme{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:48px;padding:0 20px;border:2px solid var(--yesil);border-radius:3px;font:700 .98rem/1 var(--govde);text-decoration:none;white-space:nowrap;cursor:pointer;background:transparent;color:var(--yesil);transition:background .2s,color .2s,border-color .2s}
.dugme.dugme-ana{background:var(--yesil);color:#fff}
.dugme.dugme-ana:hover{background:var(--yesil-koyu);border-color:var(--yesil-koyu)}
.dugme.dugme-cizgi:hover{background:var(--yesil);color:#fff}
.dugme.dugme-wa{background:var(--wa);border-color:var(--wa);color:#fff}
.dugme.dugme-wa:hover{background:var(--wa-koyu);border-color:var(--wa-koyu)}
.dugme.dugme-altin{background:var(--altin);border-color:var(--altin);color:var(--ink)}
.dugme.dugme-altin:hover{background:#cba64f;border-color:#cba64f}
.dugme.dugme-acik{border-color:var(--krem);color:var(--krem)}
.dugme.dugme-acik:hover{background:var(--krem);color:var(--yesil)}
.dugme-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:10px;max-width:520px;margin-top:22px}

/* ---- başlık (statik; mini şerit kaydırınca) ---- */
.ust{background:#0b0b0b;border-bottom:1px solid #2a2a2a}
.ust-ic{display:flex;align-items:center;gap:16px;padding-block:14px}
.marka{display:block;flex:none;width:clamp(160px,17vw,220px)}
.marka img{width:100%;height:auto}
.menu{display:flex;align-items:center;justify-content:center;gap:2px;flex:1 1 auto;min-width:0}
.menu a{display:flex;align-items:center;min-height:44px;padding:0 13px;text-decoration:none;font-weight:600;font-size:.97rem;white-space:nowrap;border-bottom:2px solid transparent;color:#f1ead8}
.menu a:hover{color:#e0bd62;border-bottom-color:var(--altin)}
.menu a[aria-current="page"]{color:#e0bd62;border-bottom-color:var(--altin)}
.ust .menu-dugme{border-color:#6b5a2c;color:#f1ead8;background:transparent}
.ust-eylem{flex:none}
.menu-dugme{display:none;margin-left:auto}
@media (max-width:1060px){
  .ust-ic{flex-wrap:wrap}
  .menu-dugme{display:inline-flex;min-height:44px;padding:0 16px}
  .ust-eylem{order:3}
  .js .menu{display:none;order:4;flex:1 1 100%;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid #2a2a2a}
  .js .menu.acik{display:flex}
  .menu a{border-bottom:1px solid #2a2a2a;padding:0 4px}
  .menu a:hover{border-bottom-color:#2a2a2a}
}
.mini{position:fixed;inset:0 0 auto 0;z-index:30;height:var(--mini);background:#0b0b0b;border-bottom:1px solid #2a2a2a;transform:translateY(-110%);transition:transform .25s;visibility:hidden}
.mini.goster{transform:none;visibility:visible}
.mini-ic{display:flex;align-items:center;gap:14px;height:100%}
.mini-ad{font:700 1.15rem var(--bas);text-decoration:none;color:#e0bd62;white-space:nowrap}
.mini-menu{display:flex;gap:2px;margin-left:auto}
.mini-menu a{color:#f1ead8;display:flex;align-items:center;min-height:44px;padding:0 10px;text-decoration:none;font-weight:600;font-size:.92rem}
.mini-ara{min-height:44px;padding:0 16px}
@media (max-width:640px){.mini-menu{display:none}.mini-ara{margin-left:auto}}

/* ---- bölünmüş düzen: sol yapışık başlık / sağ kayan içerik ---- */
.bolunmus{display:grid;grid-template-columns:minmax(0,1fr);border-bottom:1px solid var(--cizgi)}
.sol,.sag{min-width:0;padding:clamp(26px,3.6vw,48px) 16px}
.alan:nth-of-type(even){background:var(--krem2)}
@media (min-width:900px){
  .bolunmus{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .sol{padding-inline:clamp(24px,4vw,64px) clamp(16px,2.4vw,36px)}
  .sag{padding-inline:clamp(16px,2.4vw,36px) clamp(24px,4vw,64px);border-left:1px solid var(--cizgi)}
  .yapisik{position:sticky;top:calc(var(--mini) + 16px)}
}
.no{font:700 1.15rem var(--bas);color:var(--kahve);letter-spacing:.08em;margin-bottom:6px}
.etiket{font-weight:700;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--kahve);margin-bottom:14px}
.dev{font:700 clamp(2.5rem,1.6rem + 3.8vw,5rem)/.98 var(--bas);color:var(--yesil);letter-spacing:-.01em;overflow-wrap:break-word;hyphens:manual}
.dev span{color:var(--altin)}
.dev.kucuk{font-size:clamp(2.1rem,1.4rem + 2.6vw,3.6rem)}
.ozet{margin-top:16px;max-width:36ch;font-size:1.12rem;color:var(--soluk)}
.kirinti{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:.88rem;margin-bottom:14px;color:var(--soluk)}
.kirinti a{text-decoration:none;color:var(--kahve);font-weight:600}
.kirinti a::after{content:"/";margin-left:10px;color:var(--cizgi)}

/* ---- fotoğraf kutusu (kolon doldurulamıyorsa yeşil kutuya alınır) ---- */
.foto-kutu{background:var(--yesil);padding:clamp(12px,1.8vw,24px);border-radius:4px}
.foto-kutu img{width:100%;max-width:690px;margin-inline:auto;border-radius:2px}
.madde{display:grid;gap:8px;margin-top:20px}
.madde li{display:flex;align-items:flex-start;gap:10px;font-weight:600}
.madde .ikon{margin-top:.2em;color:var(--kahve)}

/* ---- sahneler (vektörel) ---- */
.sahne-kutu{max-width:420px;margin-top:24px;border:1px solid var(--cizgi);background:var(--kagit)}
.sahne{display:block;width:100%;height:auto;overflow:hidden}
.don{stroke-dasharray:3 3.2}
@media (prefers-reduced-motion:no-preference){
  .s-halat{transform-box:fill-box;transform-origin:top center;animation:halat 5s ease-in-out infinite}
  .s-kanca{animation:kanca 5s ease-in-out infinite}
  @keyframes halat{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.75)}}
  @keyframes kanca{0%,100%{transform:translateY(0)}50%{transform:translateY(30px)}}
  .gecen{animation:gec 9s linear infinite}
  @keyframes gec{from{transform:translateX(-170px)}to{transform:translateX(420px)}}
  .yol-serit{animation:yol 1s linear infinite}
  @keyframes yol{to{stroke-dashoffset:48}}
  .don{transform-box:fill-box;transform-origin:center;animation:don .7s linear infinite}
  @keyframes don{to{transform:rotate(360deg)}}
  .tarama{animation:tara 4.5s linear infinite}
  @keyframes tara{0%{transform:translateX(0);opacity:1}85%{opacity:1}100%{transform:translateX(230px);opacity:0}}
  .tik{transform-box:fill-box;transform-origin:center;animation:tik 3.6s ease-in-out infinite;animation-delay:var(--g,0s)}
  @keyframes tik{0%,100%{transform:scale(1)}50%{transform:scale(1.2)}}
  .isik{animation:isil 2.6s ease-in-out infinite;animation-delay:var(--g,0s)}
  .tank{animation:isil 2.4s ease-in-out infinite}
  @keyframes isil{0%,100%{opacity:1}50%{opacity:.4}}
  .avize{transform-box:fill-box;transform-origin:top center;animation:sal 5s ease-in-out infinite}
  @keyframes sal{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
}
.durdur .sahne *{animation-play-state:paused}

/* ---- kahraman ---- */
.kahraman .sol{display:flex;align-items:center}
.kahraman .dev{font-size:clamp(2.8rem,1.5rem + 4.6vw,5.6rem)}
.kahraman .sag{padding:0;background:var(--yesil)}
.mozaik{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:6px;height:100%;background:var(--yesil)}
.mozaik-kare{position:relative;display:block;height:100%;min-height:0;aspect-ratio:4/3;overflow:hidden;text-decoration:none}
.mozaik-kare img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.mozaik-kare:hover img{transform:scale(1.04)}
.mozaik-ad{position:absolute;left:0;bottom:0;padding:8px 14px;background:rgba(23,58,37,.9);color:var(--krem);font-weight:700;font-size:.95rem}
.mozaik-ad b{color:var(--altin);margin-right:4px;font-family:var(--bas)}
@media (min-width:900px){
  .kahraman .sag{min-height:min(680px,calc(100svh - 170px))}
  .mozaik-kare{aspect-ratio:auto}
}

/* ---- bölümler ---- */
.bolum{padding:clamp(30px,4vw,54px) 0}
.bolum + .bolum{padding-top:clamp(12px,1.6vw,22px)}
.bolum-baslik{font:700 clamp(1.7rem,1.2rem + 1.8vw,2.6rem)/1.05 var(--bas);color:var(--yesil);margin-bottom:20px}
.yazi{display:grid;gap:14px;align-content:start}
.yazi p{max-width:62ch}
.yazi .giris{font-size:1.28rem;line-height:1.5;color:var(--yesil);font-weight:600}
.markalar{display:flex;flex-wrap:wrap;gap:12px;align-items:stretch}
.markalar li{background:#fff;border:1px solid var(--cizgi);padding:10px 14px;display:flex;align-items:center;justify-content:center}
.markalar img{height:72px;width:auto;max-width:150px;object-fit:contain}
.alan-liste{display:grid;gap:8px;margin-top:10px}
.alan-liste a{display:flex;align-items:center;gap:14px;min-height:56px;padding:0 16px;background:#fff;border:1px solid var(--cizgi);text-decoration:none;font-weight:700;color:var(--yesil)}
.alan-liste a:hover{background:var(--yesil);color:#fff}
.alan-liste b{font-family:var(--bas);color:var(--kahve)}
.alan-liste a:hover b{color:var(--altin)}
.alan-liste span{flex:1}

/* ---- fotoğraf ızgarası (sayı sütuna uyar; son satır ortalanır) ---- */
.izgara{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.izgara .kare{width:calc((100% - 12px) / 2)}
.izgara img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:2px}
@media (min-width:600px){.izgara .kare{width:calc((100% - 24px) / 3)}}
@media (min-width:1040px){.izgara .kare{width:calc((100% - 36px) / 4)}}

/* ---- çağrı bandı ---- */
.cagri-kutu{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px;background:var(--yesil);color:var(--krem);padding:clamp(22px,3vw,40px);border-radius:4px}
.cagri-metin h2{font:700 clamp(1.5rem,1.15rem + 1.05vw,1.68rem)/1.15 var(--bas);max-width:26ch}
.cagri-metin p{margin-top:8px;color:#dfe6d6}
.cagri-kutu .dugme-grid{margin-top:0;flex:1 1 380px;max-width:440px}

/* ---- panel, form, iletişim ---- */
.ikili{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:14px;align-items:start}
.panel{background:var(--kagit);border:1px solid var(--cizgi);padding:clamp(18px,2.4vw,30px);border-radius:4px;min-width:0}
.ilt-liste{display:grid;gap:12px}
.ilt-liste li{display:grid;gap:0}
.ilt-liste span{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--kahve)}
.ilt-liste a{font-weight:700;font-size:1.1rem;text-decoration:none;color:var(--yesil)}
.ilt-liste a:hover{text-decoration:underline}
.form{display:grid;gap:12px}
.form-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:10px}
.form label{display:grid;gap:3px;font-weight:600;font-size:.94rem;min-width:0}
.form label.genis{grid-column:1/-1}
.form input[type=text],.form input[type=tel],.form input[type=email],.form input[type=number],.form input[type=date],.form input[type=time],.form select,.form textarea{width:100%;min-height:46px;padding:8px 12px;border:1.5px solid #b9ab86;border-radius:3px;background:#fff;font:inherit;color:var(--ink)}
.form textarea{min-height:76px;resize:vertical}
.form-not{font-weight:400;color:var(--soluk);font-size:.82rem}
.kvkk{display:flex!important;grid-template-columns:none;align-items:flex-start;gap:10px;font-weight:400!important;font-size:.88rem!important;color:var(--soluk)}
.kvkk input{margin-top:.3em;flex:none;width:18px;height:18px}
.form .dugme{justify-self:start;min-width:200px}
.uyari{padding:12px 14px;border-radius:3px;margin-bottom:12px;font-weight:600}
.uyari-iyi{background:#e3f1e3;color:#1c4a22;border:1px solid #9cc79c}
.uyari-kotu{background:#fbe9e5;color:#7a2418;border:1px solid #e0a79c}
.harita{border:1px solid var(--cizgi);background:var(--krem2);aspect-ratio:16/7;min-height:280px;padding:0;overflow:hidden;border-radius:4px}
.harita iframe{width:100%;height:100%;border:0;display:block}

/* ---- altbilgi (koyu; tek koyu kütle) ---- */
.altbilgi{background:var(--yesil-koyu);color:#e7e3d2;margin-top:clamp(30px,4vw,54px)}
.altbilgi-ic{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:28px;padding-block:clamp(30px,4vw,48px)}
.alt-ad{font:700 1.5rem var(--bas);color:#fff;margin-bottom:6px}
.altbilgi .soluk{color:#c9d3c0}
.alt-baslik{font-weight:700;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--altin);margin-bottom:10px}
.alt-liste{display:grid;gap:0}
.alt-liste a{display:flex;align-items:center;min-height:44px;text-decoration:none;color:#f2eedd}
.alt-liste a:hover{text-decoration:underline;color:#fff}
.alt-serit{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding-block:16px;border-top:1px solid rgba(255,255,255,.14);font-size:.88rem;color:#c9d3c0}
@media (max-width:560px){.telif-uzun{display:none}}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* WhatsApp iki mod: görünürlük ÇİFT SINIFLA, dosyanın SONUNDA (düğmenin kendi display'i kuralı ezmesin) */
.dugme.wa-masaustu{display:none}
@media (min-width:601px){.dugme.wa-mobil{display:none}.dugme.wa-masaustu{display:inline-flex}}

/* ölçüm düzeltmeleri (375 px): tek sütuna düşen kapların taban genişliği 0 olsun */
.yapisik{min-width:0;width:100%}
.dugme-grid{width:100%;min-width:0}
.cagri-kutu .dugme-grid{flex:1 1 280px}
.kirinti a,.kirinti span{display:inline-flex;align-items:center;min-height:44px}
.kirinti{gap:0 10px;margin-bottom:6px}
.ilt-liste a{display:flex;align-items:center;min-height:44px}
.mozaik li{min-width:0}

/* mobil başlık: logo | WhatsApp | Menü tek satır; kahramanda önce mozaik (ilk ekran görsel payı, Ö13) */
@media (max-width:1060px){
  .marka{order:0}
  .ust-eylem{order:1;margin-left:auto}
  .menu-dugme{order:2;margin-left:0}
}
@media (max-width:560px){
  .ust-ic{gap:8px;padding-block:12px}
  .ust .dugme{padding:0 12px;font-size:.92rem}
}
@media (max-width:899px){
  .kahraman .sag{order:-1}
  .mozaik-kare{aspect-ratio:1/1}
  .kahraman .sol{padding-top:20px}
}
.menu-ikon{display:none}
@media (max-width:560px){.menu-yazi{display:none}.menu-ikon{display:block;width:22px;height:22px}.ust .menu-dugme{padding:0;width:48px}}
@media (max-width:560px){.ust .dugme.dugme-wa{padding:0 10px;font-size:.88rem;gap:.4em}}

/* ---- manşet (eski sitenin 4 manşeti; koyu vinyetli kareler, başlık üstte) ---- */
.manset{position:relative;background:#0b0b0b;color:#fff;overflow:hidden;aspect-ratio:1920/664;min-height:260px;max-height:664px}
.manset-slayt{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .9s ease;display:flex;align-items:center;justify-content:center}
.manset-slayt.aktif{opacity:1}
.manset-slayt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.manset-baslik{position:relative;margin:0;padding:0 16px;text-align:center;font:700 clamp(1.7rem,.6rem + 4.6vw,3.6rem)/1.2 var(--bas);text-transform:uppercase;text-shadow:0 3px 0 rgba(0,0,0,.75);letter-spacing:.01em}
.js .manset-slayt:not(.aktif){visibility:hidden}
.manset-ok{position:absolute;top:50%;translate:0 -50%;z-index:2;width:48px;height:48px;border:0;background:var(--yesil);color:#fff;cursor:pointer;display:grid;place-items:center}
.manset-ok:hover{background:var(--yesil-koyu)}
.manset-ok svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:3}
.manset-ok.geri{left:0}.manset-ok.ileri{right:0}
@media (prefers-reduced-motion:reduce){.manset-slayt{transition:none}}
