/* ==========================================================================
   LINA DERMA — Torbalı Güzellik Salonu
   style.css  —  tokens, base, components, sections (desktop-first temel)
   Medya sorguları: responsive.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. DESIGN TOKENS
   -------------------------------------------------------------------------- */
:root{
  /* Renkler — warm off-white / soft beige / taş + muted bordo aksan */
  --c-page:        #FCFAF7;
  --c-surface:     #FFFFFF;
  --c-panel:       #FAF6F1;   /* hero sol panel */
  --c-beige:       #F2E9DE;   /* hizmet seçici bandı */
  --c-beige-soft:  #F7F1E9;
  --c-ink:         #1C1815;   /* başlıklar */
  --c-body:        #57504A;   /* gövde metni */
  --c-muted:       #8C827A;   /* ikincil metin */
  --c-line:        #E9E0D6;   /* ince border */
  --c-line-strong: #DCD0C2;
  --c-accent:      #6B3A3F;   /* koyu muted bordo */
  --c-accent-dark: #552C31;
  --c-accent-soft: #F6EDEC;
  --c-star:        #E9A227;
  --c-wa:          #25A366;

  /* Tipografi */
  --f-serif: "Playfair Display", "Iowan Old Style", "Times New Roman", Georgia, serif;
  --f-sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --fs-eyebrow: 11.5px;
  --fs-xs:      12.5px;
  --fs-sm:      13.5px;
  --fs-base:    15px;
  --fs-md:      16.5px;
  --fs-lg:      clamp(19px, 1.5vw, 21px);
  --fs-h3:      clamp(17px, 1.25vw, 19px);
  --fs-h2:      clamp(26px, 2.4vw, 34px);
  --fs-h1:      clamp(36px, 3.7vw, 56px);

  /* Spacing */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 20px;
  --s-6: 24px; --s-7: 32px; --s-8: 40px; --s-9: 56px; --s-10: 72px;
  --s-11: 96px; --s-12: 120px;

  --section-y: clamp(52px, 5.6vw, 84px);

  /* Radius */
  --r-xs: 4px; --r-sm: 6px; --r-md: 10px; --r-lg: 14px; --r-xl: 18px; --r-pill: 999px;

  /* Shadow */
  --sh-1: 0 1px 2px rgba(28,24,21,.04), 0 4px 14px -10px rgba(28,24,21,.14);
  --sh-2: 0 2px 6px rgba(28,24,21,.05), 0 18px 34px -22px rgba(28,24,21,.26);
  --sh-header: 0 1px 0 var(--c-line), 0 10px 26px -24px rgba(28,24,21,.5);

  /* Layout */
  --container: 1280px;         /* geniş ekranlarda aşağıda büyür */
  --gutter: clamp(18px, 3.4vw, 40px);
  --header-h: 76px;
  --topbar-h: 38px;
  --sticky-h: calc(var(--header-h) + var(--topbar-h));

  --ease: cubic-bezier(.22,.61,.36,1);
}

/* Geniş ekranlar: içerik ölü boşlukta kaybolmasın */
@media (min-width: 1600px){ :root{ --container:1400px; --gutter:48px; } }
@media (min-width: 1900px){ :root{ --container:1520px; --gutter:56px; } }
@media (min-width: 2300px){ :root{ --container:1640px; } }

/* --------------------------------------------------------------------------
   2. RESET & BASE
   -------------------------------------------------------------------------- */
*,*::before,*::after{ box-sizing:border-box; }
/* Bileşen display kuralları (örn. .lead{display:grid}) [hidden]'ı ezmesin.
   Tek zorunlu !important: JS'in gizlediği her blok gerçekten gizlensin. */
[hidden]{ display:none !important; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:smooth; }
/* Çift dokunma zoom'u ve 300ms gecikme: interaktif öğelerde kapalı */
a, button, label, summary, input, select, textarea, .chip, .faq__q{ touch-action:manipulation; }
body{
  margin:0;
  background:var(--c-page);
  color:var(--c-body);
  font:400 var(--fs-base)/1.65 var(--f-sans);
  letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{ margin:0; color:var(--c-ink); font-weight:500; line-height:1.18; letter-spacing:-.01em; }
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
a{ color:inherit; text-decoration:none; }
img,picture,svg{ display:block; max-width:100%; }
img{ height:auto; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
address{ font-style:normal; }
blockquote{ margin:0; }
:focus-visible{ outline:2px solid var(--c-accent); outline-offset:3px; border-radius:var(--r-xs); }
::selection{ background:var(--c-accent); color:#fff; }

.sprite{ position:absolute; width:0; height:0; overflow:hidden; }
.ico{ width:20px; height:20px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.ico--sm{ width:17px; height:17px; }
.ico--xs{ width:14px; height:14px; }
.ico--google{ width:20px; height:20px; stroke:none; }

.skip-link{
  position:fixed; top:0; left:0; z-index:200;
  background:var(--c-accent); color:#fff; padding:12px 18px; font-size:var(--fs-sm);
  border-radius:0 0 var(--r-md) 0; transform:translateY(-120%);
  transition:transform .2s var(--ease);
}
.skip-link:focus-visible{ transform:none; }

.container{ width:min(100% - var(--gutter)*2, var(--container)); margin-inline:auto; }

/* --------------------------------------------------------------------------
   3. TYPOGRAPHY HELPERS
   -------------------------------------------------------------------------- */
.eyebrow{
  font-size:var(--fs-eyebrow); font-weight:500; letter-spacing:.18em;
  text-transform:uppercase; color:var(--c-muted); margin-bottom:var(--s-5);
}
.section-title{ font-family:var(--f-serif); font-size:var(--fs-h2); font-weight:500; }
.section-title--sm{ font-size:clamp(20px, 1.6vw, 24px); }
.section-sub{ font-size:var(--fs-sm); color:var(--c-muted); }

.section{ padding-block:var(--section-y); }
.section--services{ background:var(--c-surface); border-block:1px solid var(--c-line); }
.section--finder{ padding-top:clamp(36px,4vw,56px); padding-bottom:clamp(36px,4vw,56px); }
.section--reviews{ background:var(--c-surface); border-block:1px solid var(--c-line); }
.section--bottom{ background:var(--c-surface); border-top:1px solid var(--c-line); }

.section-head{
  display:flex; align-items:baseline; flex-wrap:wrap; gap:var(--s-3) var(--s-6);
  margin-bottom:var(--s-7);
}
.section-head__main{ display:flex; align-items:baseline; flex-wrap:wrap; gap:var(--s-2) var(--s-5); flex:1 1 auto; min-width:0; }
.section-head .link-more{ margin-left:auto; }
.section-head--sm{ margin-bottom:var(--s-5); align-items:flex-start; flex-wrap:nowrap; }
.section-head--sm .section-head__main{ flex-direction:column; gap:4px; }
.section-head--sm .link-more{ margin-top:5px; }

.link-more{
  display:inline-flex; align-items:center; gap:var(--s-2);
  flex:none; white-space:nowrap;
  font-size:var(--fs-sm); font-weight:500; color:var(--c-ink);
  padding-bottom:2px; border-bottom:1px solid transparent; transition:border-color .2s var(--ease), color .2s var(--ease);
}
.link-more .ico{ transition:transform .25s var(--ease); }
.link-more:hover{ color:var(--c-accent); border-bottom-color:var(--c-line-strong); }
.link-more:hover .ico{ transform:translateX(3px); }

/* --------------------------------------------------------------------------
   4. BUTTONS
   -------------------------------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2);
  min-height:48px; padding:13px 22px;
  font-size:14.5px; font-weight:500; line-height:1.2; letter-spacing:.005em;
  border:1px solid transparent; border-radius:var(--r-sm);
  transition:background-color .22s var(--ease), color .22s var(--ease),
             border-color .22s var(--ease), box-shadow .22s var(--ease), transform .22s var(--ease);
}
.btn__arrow{ transition:transform .25s var(--ease); }
.btn:hover .btn__arrow{ transform:translateX(3px); }

.btn--primary{ background:var(--c-accent); color:#fff; box-shadow:0 10px 22px -18px rgba(107,58,63,.9); }
.btn--primary:hover{ background:var(--c-accent-dark); transform:translateY(-1px); }
.btn--ghost{ background:var(--c-surface); border-color:var(--c-line-strong); color:var(--c-ink); }
.btn--ghost:hover{ border-color:var(--c-accent); color:var(--c-accent); transform:translateY(-1px); }
.btn--soft{ background:var(--c-beige); color:var(--c-ink); border-color:transparent; }
.btn--soft:hover{ background:var(--c-beige-soft); border-color:var(--c-line-strong); }
.btn--pill{ border-radius:var(--r-pill); }
.btn--sm{ min-height:42px; padding:10px 18px; font-size:var(--fs-sm); }

/* --------------------------------------------------------------------------
   5. HEADER
   -------------------------------------------------------------------------- */
.site-top{ position:sticky; top:0; z-index:90; }
.site-header{
  position:relative; z-index:90;
  background:var(--c-surface);
  border-bottom:1px solid var(--c-line);
  transition:box-shadow .3s var(--ease);
}
.site-header.is-scrolled{ box-shadow:var(--sh-header); }
.header__inner{ display:flex; align-items:center; gap:var(--s-7); min-height:var(--header-h); }

.brand{ display:inline-flex; flex-direction:column; gap:3px; flex:none; }
.brand__name{
  font-family:var(--f-serif); font-size:21px; font-weight:500; color:var(--c-ink);
  letter-spacing:.14em; line-height:1;
}
.brand__sub{
  font-size:8.5px; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  color:var(--c-muted); line-height:1;
}

.nav{ margin-inline:auto; }
.nav__list{ display:flex; align-items:center; gap:clamp(14px, 1.9vw, 28px); }
.nav__item{ position:relative; }
.nav__link{
  position:relative; display:inline-flex; align-items:center; gap:6px;
  padding:10px 0; font-size:14.5px; color:var(--c-body);
  transition:color .2s var(--ease);
}
.nav__link::after{
  content:""; position:absolute; left:0; right:0; bottom:2px; height:1.5px;
  background:var(--c-accent); transform:scaleX(0); transform-origin:left;
  transition:transform .28s var(--ease);
}
.nav__link:hover{ color:var(--c-ink); }
.nav__link:hover::after{ transform:scaleX(1); }
.nav__link.is-active{ color:var(--c-ink); font-weight:500; }
.nav__link.is-active::after{ transform:scaleX(1); }
.nav__toggle .ico{ transition:transform .25s var(--ease); }
.nav__toggle[aria-expanded="true"] .ico{ transform:rotate(180deg); }

.subnav{
  position:absolute; top:calc(100% + 10px); left:-18px; min-width:252px;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-md);
  box-shadow:var(--sh-2); padding:8px;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s;
}
.nav__item.is-open .subnav{ opacity:1; visibility:visible; transform:translateY(0); }
.subnav a{
  display:block; padding:10px 12px; font-size:14px; color:var(--c-body);
  border-radius:var(--r-sm); transition:background-color .18s var(--ease), color .18s var(--ease);
}
.subnav a:hover{ background:var(--c-beige-soft); color:var(--c-ink); }
.subnav__all{ margin-top:4px; border-top:1px solid var(--c-line); border-radius:0 0 var(--r-sm) var(--r-sm); color:var(--c-accent) !important; }

.header__actions{ display:flex; align-items:center; gap:var(--s-5); flex:none; }
.header__phone{
  display:inline-flex; align-items:center; gap:var(--s-2);
  font-size:14.5px; font-weight:500; color:var(--c-ink); white-space:nowrap;
}
.header__phone .ico{ color:var(--c-accent); }
.header__phone:hover{ color:var(--c-accent); }
.header__cta{ padding:12px 22px; min-height:44px; }

.burger{ display:none; width:44px; height:44px; align-items:center; justify-content:center;
  border:1px solid var(--c-line); border-radius:var(--r-sm); color:var(--c-ink); }
.burger__close{ display:none; }
.burger[aria-expanded="true"] .burger__open{ display:none; }
.burger[aria-expanded="true"] .burger__close{ display:block; }

/* Mobil menü */
.mobile-menu{
  position:absolute; top:100%; left:0; right:0; z-index:89;
  background:var(--c-surface); border-bottom:1px solid var(--c-line);
  box-shadow:var(--sh-2); padding:var(--s-5) 0 var(--s-6);
  max-height:calc(100dvh - var(--header-h) - 10px); overflow-y:auto;
  animation:menuIn .22s var(--ease);
}
@keyframes menuIn{ from{ opacity:0; transform:translateY(-8px); } to{ opacity:1; transform:none; } }
.mobile-menu__list > li + li{ border-top:1px solid var(--c-line); }
.mobile-menu__list a,
.mobile-menu__toggle{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s-3);
  width:100%; padding:15px 2px; font-size:16px; color:var(--c-ink); text-align:left;
}
.mobile-menu__toggle[aria-expanded="true"] .ico{ transform:rotate(180deg); }
.mobile-menu__toggle .ico{ transition:transform .25s var(--ease); color:var(--c-muted); }
.mobile-menu__sub{ padding:0 0 10px 2px; }
.mobile-menu__sub a{ padding:10px 0 10px 14px; font-size:14.5px; color:var(--c-body); border-left:1px solid var(--c-line); }
.mobile-menu__actions{ display:grid; gap:var(--s-2); margin-top:var(--s-5); }
body.menu-open{ overflow:hidden; }

/* --------------------------------------------------------------------------
   6. HERO
   -------------------------------------------------------------------------- */
.hero{
  /* İçerik genişliği ve kenar boşluğu .container ile BİREBİR aynı hesaplanır,
     böylece hero metni her ekran genişliğinde diğer section'larla hizalı kalır.
     Sağdaki görsel ekranın sağ kenarına taşar (full-bleed). */
  --content-w:min(var(--container), 100% - var(--gutter) * 2);
  --pad-x:calc((100% - var(--content-w)) / 2);
  --hero-split:.40;

  background:var(--c-panel);
  display:grid;
  grid-template-columns:
    minmax(0, var(--pad-x))                                  /* sol kenar boşluğu */
    minmax(0, calc(var(--content-w) * var(--hero-split)))    /* metin kolonu */
    minmax(0, 1fr);                                          /* görsel: sağ kenara taşar */
  align-items:stretch;
}
.hero__content{
  grid-column:2;
  align-self:center;
  padding:clamp(40px, 4.4vw, 68px) clamp(24px, 2.8vw, 40px) clamp(40px, 4.4vw, 68px) 0;
}
.hero__title{
  font-family:var(--f-serif); font-size:var(--fs-h1); font-weight:500;
  line-height:1.05; letter-spacing:-.022em; margin-bottom:var(--s-5);
}
.hero__lead{ font-size:var(--fs-base); color:var(--c-body); max-width:42ch; margin-bottom:var(--s-7); }
.hero__cta{ display:flex; flex-wrap:wrap; gap:var(--s-2); }
.hero__cta .btn{ padding-inline:18px; }
.hero__media{ grid-column:3; position:relative; min-height:100%; }
.hero__media picture{ display:block; height:100%; }
.hero__media img{ width:100%; height:100%; min-height:100%; object-fit:cover; object-position:center 42%; }

/* Güven şeridi */
.trust{ background:var(--c-panel); border-bottom:1px solid var(--c-line); }
.trust__list{ display:flex; flex-wrap:wrap; gap:var(--s-3) clamp(20px, 3vw, 44px); padding-block:var(--s-5) var(--s-6); }
.trust__item{ display:flex; align-items:center; gap:var(--s-3); font-size:var(--fs-sm); color:var(--c-body); }
.trust__icon{
  display:grid; place-items:center; width:34px; height:34px; flex:none;
  border:1px solid var(--c-line-strong); border-radius:var(--r-pill); color:var(--c-accent);
  background:var(--c-surface);
}

/* --------------------------------------------------------------------------
   7. HİZMETLER
   -------------------------------------------------------------------------- */
.services{ display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:var(--s-5); }
.s-card{ display:flex; }
.s-card__link{
  display:flex; flex-direction:column; width:100%;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-lg);
  overflow:hidden;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
}
.s-card__media{ display:block; overflow:hidden; aspect-ratio:2 / 1; background:var(--c-beige-soft); }
.s-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.s-card__body{ display:flex; flex-direction:column; gap:6px; padding:var(--s-4) var(--s-4) var(--s-5); flex:1; }
.s-card__title{ font-size:var(--fs-md); font-weight:600; color:var(--c-ink); line-height:1.25; letter-spacing:-.012em; }
.s-card__text{ font-size:var(--fs-sm); color:var(--c-muted); }
.s-card__more{
  display:inline-flex; align-items:center; gap:7px; margin-top:auto; padding-top:var(--s-3);
  font-size:var(--fs-sm); font-weight:500; color:var(--c-ink);
}
.s-card__more .ico{ transition:transform .25s var(--ease); }
.s-card__link:hover{ border-color:var(--c-line-strong); box-shadow:var(--sh-2); transform:translateY(-3px); }
.s-card__link:hover img{ transform:scale(1.04); }
.s-card__link:hover .s-card__more{ color:var(--c-accent); }
.s-card__link:hover .s-card__more .ico{ transform:translateX(3px); }

/* --------------------------------------------------------------------------
   8. HİZMET SEÇİCİ
   -------------------------------------------------------------------------- */
.finder{
  display:flex; align-items:center; flex-wrap:wrap; gap:var(--s-6) var(--s-7);
  background:var(--c-beige); border-radius:var(--r-xl);
  padding:clamp(22px, 2.6vw, 30px) clamp(22px, 2.8vw, 36px);
}
.finder__text{ flex:0 1 380px; }
.finder__title{ font-family:var(--f-serif); font-size:clamp(20px, 1.75vw, 26px); font-weight:500; color:var(--c-accent); line-height:1.22; }
.finder__sub{ font-size:var(--fs-sm); color:var(--c-body); margin-top:var(--s-2); }
.finder__options{ display:flex; flex-wrap:wrap; gap:var(--s-2); flex:1 1 auto; justify-content:center; }
.chip{
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:8px;
  width:92px; min-height:86px; padding:12px 8px;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-md);
  font-size:11.5px; line-height:1.28; color:var(--c-body); text-align:center;
  transition:border-color .2s var(--ease), background-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.chip .ico{ color:var(--c-accent); width:22px; height:22px; }
.chip:hover{ border-color:var(--c-line-strong); transform:translateY(-2px); }
.chip[aria-pressed="true"]{ border-color:var(--c-accent); background:var(--c-accent-soft); color:var(--c-ink); }
.finder__action{ flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.finder__hint{ font-size:var(--fs-xs); color:var(--c-muted); min-height:1em; }

/* --------------------------------------------------------------------------
   9. HAKKIMIZDA
   -------------------------------------------------------------------------- */
.about{
  --content-w:min(var(--container), 100% - var(--gutter) * 2);
  --pad-x:calc((100% - var(--content-w)) / 2);

  background:var(--c-surface);
  display:grid;
  grid-template-columns:
    minmax(0, calc(var(--pad-x) + var(--content-w) * .33))  /* sola taşan görsel */
    minmax(0, calc(var(--content-w) * .40))                 /* metin */
    minmax(0, 1fr)                                          /* avantajlar */
    minmax(0, var(--pad-x));                                /* sağ kenar boşluğu */
  align-items:center;
  padding-block:clamp(40px, 4.2vw, 64px);
  border-bottom:1px solid var(--c-line);
}
.about__media{ grid-column:1; align-self:center; }
.about__media picture{ display:block; height:100%; }
.about__media img{ width:100%; height:auto; aspect-ratio:2 / 1; object-fit:cover;
  border-radius:0 var(--r-lg) var(--r-lg) 0; }
.about__body{ grid-column:2; padding-inline:clamp(28px, 3.2vw, 52px); }
.about__text{ font-size:var(--fs-base); margin:var(--s-5) 0 var(--s-6); max-width:52ch; }
.about__quote{ margin:var(--s-7) 0 0; }
.about__quote blockquote{ font-family:var(--f-serif); font-size:var(--fs-lg); font-style:italic; color:var(--c-ink); line-height:1.4; }
.about__quote figcaption{ font-size:var(--fs-sm); color:var(--c-muted); margin-top:var(--s-2); }
.about__features{ grid-column:3; display:grid; gap:var(--s-5); padding-left:clamp(0px, 1vw, 12px); }
.feature{ display:flex; gap:var(--s-3); align-items:flex-start; }
.feature__icon{
  display:grid; place-items:center; width:36px; height:36px; flex:none;
  border:1px solid var(--c-line-strong); border-radius:var(--r-pill);
  color:var(--c-accent); background:var(--c-page);
}
.feature__body{ display:block; }
.feature__title{ display:block; font-size:14.5px; font-weight:600; color:var(--c-ink); }
.feature__text{ display:block; font-size:var(--fs-xs); color:var(--c-muted); line-height:1.5; margin-top:2px; }

/* --------------------------------------------------------------------------
   10. YORUMLAR
   -------------------------------------------------------------------------- */
.reviews{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--s-5); }
.review{
  display:flex; flex-direction:column; gap:var(--s-4);
  background:var(--c-page); border:1px solid var(--c-line); border-radius:var(--r-lg);
  padding:var(--s-6);
}
.review__top{ display:flex; align-items:center; gap:var(--s-3); }
.stars{ display:inline-flex; gap:2px; color:var(--c-star); }
.stars .ico{ width:14px; height:14px; stroke:none; fill:currentColor; }
.review__text{ font-size:var(--fs-sm); line-height:1.7; color:var(--c-body); }
.review__author{ display:flex; align-items:center; gap:var(--s-3); margin-top:auto; }
.review__author img{ width:36px; height:36px; border-radius:var(--r-pill); object-fit:cover; flex:none; }
.review__author strong{ display:block; font-size:var(--fs-sm); font-weight:600; color:var(--c-ink); }
.review__time{ display:block; font-size:var(--fs-xs); color:var(--c-muted); }

/* --------------------------------------------------------------------------
   11. GALERİ
   -------------------------------------------------------------------------- */
.gallery{ display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:var(--s-3); }
.gallery__item{ overflow:hidden; border-radius:var(--r-md); background:var(--c-beige-soft); }
.gallery__item img{
  width:100%; height:100%; aspect-ratio:3 / 2; object-fit:cover;
  transition:transform .6s var(--ease), filter .4s var(--ease);
}
.gallery__item:hover img{ transform:scale(1.05); filter:saturate(1.04); }

/* --------------------------------------------------------------------------
   12. BLOG + SSS + İLETİŞİM
   -------------------------------------------------------------------------- */
.bottom-grid{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,1.1fr) minmax(0,.85fr);
  gap:clamp(28px, 3.4vw, 56px);
  align-items:start;
}

/* Blog */
.posts{ display:grid; gap:var(--s-3); }
.post a{
  display:grid; grid-template-columns:72px minmax(0,1fr); gap:var(--s-4); align-items:center;
  background:var(--c-page); border:1px solid var(--c-line); border-radius:var(--r-md);
  padding:10px; transition:border-color .22s var(--ease), box-shadow .22s var(--ease), transform .22s var(--ease);
}
.post img{ width:72px; height:72px; object-fit:cover; border-radius:var(--r-sm); }
.post__title{ display:block; font-size:14px; font-weight:600; color:var(--c-ink); line-height:1.4; }
.post__date{ display:block; font-size:var(--fs-xs); color:var(--c-muted); margin-top:5px; }
.post a:hover{ border-color:var(--c-line-strong); box-shadow:var(--sh-1); transform:translateY(-2px); }
.post a:hover .post__title{ color:var(--c-accent); }

/* SSS */
.faq{ display:grid; gap:var(--s-2); }
.faq__item{ background:var(--c-page); border:1px solid var(--c-line); border-radius:var(--r-md); overflow:hidden; }
.faq__item h3{ margin:0; font-size:inherit; font-weight:inherit; }
.faq__q{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s-4);
  width:100%; padding:14px var(--s-4); min-height:52px;
  font-size:14px; font-weight:500; color:var(--c-ink); text-align:left;
  transition:background-color .2s var(--ease);
}
.faq__q:hover{ background:var(--c-beige-soft); }
.faq__icon{ color:var(--c-muted); transition:transform .28s var(--ease), color .2s var(--ease); }
.faq__q[aria-expanded="true"] .faq__icon{ transform:rotate(45deg); color:var(--c-accent); }
.faq__q[aria-expanded="true"]{ background:var(--c-beige-soft); }
.faq__a{ padding:0 var(--s-4) var(--s-4); font-size:var(--fs-sm); color:var(--c-body); line-height:1.7; }

/* İletişim */
.contact{ display:grid; gap:var(--s-3); font-size:var(--fs-sm); }
.contact__row{ display:grid; grid-template-columns:20px minmax(0,1fr); gap:var(--s-3); align-items:start; line-height:1.6; }
.contact__row .ico{ color:var(--c-accent); margin-top:2px; }
.contact__row a:hover{ color:var(--c-accent); }
.contact .btn{ justify-self:start; margin-top:var(--s-2); }
.map{
  display:block; margin-top:var(--s-4); overflow:hidden;
  border:1px solid var(--c-line); border-radius:var(--r-md); background:var(--c-beige-soft);
}
.map img{ width:100%; aspect-ratio:16 / 10; object-fit:cover; transition:transform .5s var(--ease); }
.map:hover img{ transform:scale(1.03); }

/* --------------------------------------------------------------------------
   13. FOOTER (SEO)
   -------------------------------------------------------------------------- */
.site-footer{ background:var(--c-surface); border-top:1px solid var(--c-line); }
.footer__grid{
  display:grid; grid-template-columns:1.7fr 1fr 1fr 1fr 1.15fr;
  gap:var(--s-7) clamp(20px, 2.4vw, 40px); padding-block:clamp(40px, 4vw, 64px) var(--s-8);
}
.footer__col{ min-width:0; }
.brand--footer{ margin-bottom:var(--s-4); }
.brand--footer .brand__name{ font-size:20px; }
.footer__about{ font-size:var(--fs-sm); color:var(--c-muted); max-width:34ch; margin-bottom:var(--s-4); }
.footer__nap{ display:grid; gap:3px; font-size:var(--fs-sm); color:var(--c-body); margin-bottom:var(--s-4); }
.footer__nap-name{ font-weight:600; color:var(--c-ink); }
.footer__nap a:hover{ color:var(--c-accent); }
.footer__title{
  font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:var(--c-ink); margin-bottom:var(--s-4);
}
.footer__links{ display:grid; gap:9px; }
.footer__links a{ font-size:var(--fs-sm); color:var(--c-body); transition:color .2s var(--ease), padding-left .2s var(--ease); }
.footer__links a:hover{ color:var(--c-accent); padding-left:3px; }
.footer__hours{ display:grid; gap:8px; font-size:var(--fs-sm); margin-bottom:var(--s-5); }
.footer__hours li{ display:flex; justify-content:space-between; gap:var(--s-3); color:var(--c-body); }
.footer__hours span:last-child{ color:var(--c-ink); font-weight:500; }
.footer__cta{ display:grid; gap:var(--s-2); }
.social{ display:flex; gap:var(--s-2); }
.social a{
  display:grid; place-items:center; width:36px; height:36px;
  border:1px solid var(--c-line); border-radius:var(--r-pill); color:var(--c-body);
  transition:border-color .2s var(--ease), color .2s var(--ease), background-color .2s var(--ease);
}
.social a:hover{ border-color:var(--c-accent); color:var(--c-accent); background:var(--c-accent-soft); }

.footer__areas{
  border-top:1px solid var(--c-line); padding-block:var(--s-5);
  display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--s-2) var(--s-4);
  font-size:var(--fs-sm); color:var(--c-muted);
}
.footer__areas-title{
  font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--c-ink);
}
.footer__areas a{ color:var(--c-accent); white-space:nowrap; }
.footer__areas a:hover{ text-decoration:underline; }

.footer__note{
  display:flex; gap:var(--s-3); align-items:flex-start;
  border-top:1px solid var(--c-line); padding-block:var(--s-5);
  font-size:var(--fs-xs); line-height:1.7; color:var(--c-muted);
}
.footer__note .ico{ color:var(--c-accent); flex:none; margin-top:2px; }
.footer__note strong{ color:var(--c-body); }
.footer__note a{ color:var(--c-accent); white-space:nowrap; }

.footer__bottom{ border-top:1px solid var(--c-line); background:var(--c-page); }
.footer__bottom-inner{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--s-2) var(--s-5);
  padding-block:var(--s-4); font-size:var(--fs-xs); color:var(--c-muted);
}
.footer__meta{ display:flex; flex-wrap:wrap; gap:var(--s-2); }

/* --------------------------------------------------------------------------
   14. MOBİL AKSİYON BARI
   -------------------------------------------------------------------------- */
.mobile-bar{
  display:none;
  position:fixed; left:0; right:0; bottom:0; z-index:95;
  grid-template-columns:repeat(3, 1fr); gap:var(--s-2);
  background:var(--c-surface); border-top:1px solid var(--c-line);
  padding:8px var(--s-3) calc(8px + env(safe-area-inset-bottom, 0px));
  box-shadow:0 -6px 24px -18px rgba(28,24,21,.6);
}
.mobile-bar__item{
  display:flex; align-items:center; justify-content:center; gap:7px;
  min-height:48px; padding:6px 8px; border-radius:var(--r-sm);
  border:1px solid var(--c-line); background:var(--c-page);
  font-size:13px; font-weight:500; color:var(--c-ink);
}
.mobile-bar__item--primary{ background:var(--c-accent); border-color:var(--c-accent); color:#fff; }

/* --------------------------------------------------------------------------
   15. MOTION
   -------------------------------------------------------------------------- */
.js [data-reveal]{ opacity:0; transform:translateY(14px); }
.js [data-reveal].is-visible{ opacity:1; transform:none; transition:opacity .6s var(--ease), transform .6s var(--ease); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .js [data-reveal]{ opacity:1; transform:none; }
}

/* --------------------------------------------------------------------------
   16. ANCHOR OFFSET (sticky header)
   -------------------------------------------------------------------------- */
[id]{ scroll-margin-top:calc(var(--sticky-h) + 18px); }

/* ==========================================================================
   17. TOP BAR
   ========================================================================== */
.topbar{
  background:var(--c-ink); color:#E8DFD5;
  font-size:12.5px; letter-spacing:.012em;
  border-bottom:1px solid rgba(232,223,213,.10);
}
.topbar .is-placeholder{ display:none; }   /* değer girilene kadar gizli kalır */
.topbar__inner{ display:flex; align-items:center; justify-content:space-between; gap:var(--s-5); min-height:38px; }
.topbar__info{ display:flex; align-items:center; flex-wrap:wrap; gap:var(--s-2) clamp(14px, 1.8vw, 26px); min-width:0; }
.topbar__item{ display:flex; align-items:center; gap:7px; color:rgba(232,223,213,.78); white-space:nowrap; }
.topbar__info .ico{ color:rgba(232,223,213,.55); }
.topbar__info a:hover{ color:#fff; }
.topbar__actions{ display:flex; align-items:center; gap:clamp(12px, 1.6vw, 20px); }
.topbar__link{
  display:inline-flex; align-items:center; gap:7px; font-weight:500; color:#F3EDE6;
  padding:8px 0; transition:color .2s var(--ease), opacity .2s var(--ease);
}
.topbar__link .ico{ color:rgba(243,237,230,.7); }
.topbar__link:hover{ color:#fff; }
.topbar__link--wa:hover .ico{ color:var(--c-wa); }
.topbar__social{ display:flex; align-items:center; gap:4px; padding-left:clamp(6px,1vw,14px); margin-left:clamp(2px,.6vw,8px); border-left:1px solid rgba(232,223,213,.18); }
.topbar__social a{
  display:grid; place-items:center; width:30px; height:30px; border-radius:var(--r-pill);
  color:rgba(232,223,213,.72); transition:background-color .2s var(--ease), color .2s var(--ease);
}
.topbar__social a:hover{ background:rgba(255,255,255,.08); color:#fff; }

/* ==========================================================================
   18. SAYFA BAŞLIĞI + BREADCRUMB
   ========================================================================== */
.page-hero{
  background:var(--c-panel); border-bottom:1px solid var(--c-line);
  padding-block:clamp(26px, 3.4vw, 48px) clamp(30px, 3.8vw, 54px);
}
.page-hero--article, .page-hero--legal{ background:var(--c-beige-soft); }
.page-hero__title{
  font-family:var(--f-serif); font-size:clamp(30px, 3.4vw, 48px); font-weight:500;
  line-height:1.1; letter-spacing:-.02em; margin-bottom:var(--s-4);
}
.page-hero__lead{ font-size:var(--fs-md); color:var(--c-body); max-width:62ch; line-height:1.68; }
.page-hero__meta{ font-size:var(--fs-xs); color:var(--c-muted); margin-top:var(--s-4); }
.page-hero__cta{ display:flex; flex-wrap:wrap; gap:var(--s-3); margin-top:var(--s-6); }
.page-hero .badge{ margin-bottom:var(--s-4); }

.breadcrumb{ margin-bottom:var(--s-5); }
.breadcrumb ol{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:var(--fs-xs); color:var(--c-muted); }
.breadcrumb li + li::before{ content:"/"; margin-right:6px; color:var(--c-line-strong); }
.breadcrumb a{ color:var(--c-muted); }
.breadcrumb a:hover{ color:var(--c-accent); text-decoration:underline; }
.breadcrumb [aria-current]{ color:var(--c-ink); }

/* ==========================================================================
   19. BÖLÜM VARYANTLARI + YARDIMCILAR
   ========================================================================== */
.section--tight{ padding-block:clamp(38px, 4vw, 60px); }
.section--soft{ background:var(--c-beige-soft); border-block:1px solid var(--c-line); padding-block:clamp(44px, 4.6vw, 72px); }
.container.narrow{ width:min(100% - var(--gutter)*2, 900px); }
.mt-lg{ margin-top:clamp(28px, 3vw, 44px); }
.text-muted{ color:var(--c-muted); font-size:var(--fs-sm); }
.section-foot{
  display:flex; gap:var(--s-2); align-items:flex-start;
  margin-top:var(--s-5); font-size:var(--fs-xs); color:var(--c-muted); max-width:78ch;
}
.section-foot .ico{ color:var(--c-accent); flex:none; margin-top:2px; }

.badge{
  display:inline-block; padding:5px 11px; border-radius:var(--r-pill);
  background:var(--c-accent-soft); color:var(--c-accent);
  font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
}
.badge--soon{ background:var(--c-beige); color:var(--c-muted); }

.note{
  display:flex; gap:var(--s-3); align-items:flex-start;
  padding:var(--s-4); border-radius:var(--r-md);
  font-size:var(--fs-sm); line-height:1.65;
}
.note .ico{ flex:none; margin-top:2px; }
.note--info{ background:var(--c-beige-soft); border:1px solid var(--c-line); color:var(--c-body); }
.note--info .ico{ color:var(--c-accent); }
.note--warn{ background:var(--c-accent-soft); border:1px solid #E7D3D1; color:var(--c-body); }
.note--warn .ico{ color:var(--c-accent); }

.ticks{ display:grid; gap:9px; }
.ticks li{ position:relative; padding-left:26px; font-size:var(--fs-sm); line-height:1.6; }
.ticks li::before{
  content:""; position:absolute; left:0; top:7px; width:14px; height:14px;
  border-radius:var(--r-pill); background:var(--c-accent-soft);
  box-shadow:inset 0 0 0 1px rgba(107,58,63,.25);
}
.ticks li::after{
  content:""; position:absolute; left:4px; top:11px; width:6px; height:3px;
  border-left:1.5px solid var(--c-accent); border-bottom:1.5px solid var(--c-accent);
  transform:rotate(-45deg);
}
.ticks--warn li::before{ background:#FBEFEA; box-shadow:inset 0 0 0 1px rgba(160,90,60,.25); }

.pill-list{ display:flex; flex-wrap:wrap; gap:var(--s-2); margin-top:var(--s-6); }
.pill-list li{
  display:inline-flex; align-items:center; gap:7px;
  padding:8px 14px; border-radius:var(--r-pill);
  background:var(--c-surface); border:1px solid var(--c-line);
  font-size:var(--fs-xs); color:var(--c-body);
}
.pill-list .ico{ color:var(--c-accent); }

.chip-links{ display:flex; flex-wrap:wrap; gap:var(--s-2); }
.chip-links a{
  display:inline-flex; align-items:center; gap:7px;
  padding:10px 16px; border-radius:var(--r-pill);
  background:var(--c-surface); border:1px solid var(--c-line);
  font-size:var(--fs-sm); color:var(--c-ink);
  transition:border-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.chip-links a:hover{ border-color:var(--c-accent); color:var(--c-accent); transform:translateY(-1px); }

.quote{ margin:var(--s-7) 0 0; padding-left:var(--s-5); border-left:2px solid var(--c-line-strong); }
.quote blockquote{ font-family:var(--f-serif); font-size:var(--fs-lg); font-style:italic; color:var(--c-ink); line-height:1.45; }
.quote figcaption{ font-size:var(--fs-sm); color:var(--c-muted); margin-top:var(--s-2); }

.kv{ display:grid; gap:10px; margin-top:var(--s-4); }
.kv > div{ display:grid; grid-template-columns:minmax(120px, 34%) 1fr; gap:var(--s-3); font-size:var(--fs-sm); }
.kv dt{ color:var(--c-muted); }
.kv dd{ margin:0; color:var(--c-ink); }

/* ==========================================================================
   20. SPLIT / STEPS / KARTLAR
   ========================================================================== */
.split{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px, 3.4vw, 56px); align-items:center; }
.split--media{ grid-template-columns:.95fr 1.05fr; align-items:center; }
.split__text > * + *{ margin-top:var(--s-4); }
.split__text p{ font-size:var(--fs-base); line-height:1.7; }
.split__media img{ width:100%; height:auto; border-radius:var(--r-lg); border:1px solid var(--c-line); }

.steps{ display:grid; gap:var(--s-3); }
.step{
  display:grid; grid-template-columns:38px 1fr; gap:var(--s-4); align-items:start;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-md);
  padding:var(--s-4);
}
.step__no{
  display:grid; place-items:center; width:34px; height:34px; border-radius:var(--r-pill);
  background:var(--c-accent-soft); color:var(--c-accent);
  font-family:var(--f-serif); font-size:15px; font-weight:600;
}
.step__body{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.6; }
.step__body strong{ display:block; font-size:15px; font-weight:600; color:var(--c-ink); margin-bottom:3px; }

.feature-grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--s-4); }
.feature-grid--2{ grid-template-columns:repeat(2, minmax(0,1fr)); }
.fcard{
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-lg);
  padding:var(--s-5); display:flex; flex-direction:column; gap:var(--s-2);
}
.fcard__icon{
  display:grid; place-items:center; width:38px; height:38px; margin-bottom:var(--s-2);
  border-radius:var(--r-pill); background:var(--c-beige-soft); color:var(--c-accent);
  border:1px solid var(--c-line);
}
.fcard h3{ font-size:var(--fs-h3); font-weight:600; }
.fcard p{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.6; }
.fcard .link-more{ margin-top:auto; padding-top:var(--s-3); }

.mini-card{
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-md);
  padding:var(--s-5);
}
.mini-card h3{ font-size:var(--fs-h3); font-weight:600; margin-bottom:var(--s-3); }
.two-col{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-4); margin:var(--s-5) 0; }

.team-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--s-4); }
.tcard{
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-lg);
  padding:var(--s-6); text-align:center;
}
.tcard__avatar{
  display:grid; place-items:center; width:64px; height:64px; margin:0 auto var(--s-4);
  border-radius:var(--r-pill); background:var(--c-beige-soft); color:var(--c-accent);
  border:1px solid var(--c-line);
}
.tcard h3{ font-size:var(--fs-h3); font-weight:600; }
.tcard__role{ font-size:var(--fs-xs); letter-spacing:.06em; text-transform:uppercase; color:var(--c-accent); margin-top:4px; }
.tcard__text{ font-size:var(--fs-sm); color:var(--c-muted); margin-top:var(--s-3); line-height:1.6; }

.mini-gallery{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-3); }
.mini-gallery li{ overflow:hidden; border-radius:var(--r-md); border:1px solid var(--c-line); }
.mini-gallery img{ width:100%; height:100%; aspect-ratio:3/2; object-fit:cover; }

.info-band{
  display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(24px,3vw,48px); align-items:start;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-lg);
  padding:clamp(22px, 2.6vw, 34px);
}

.empty-state{
  text-align:center; background:var(--c-surface); border:1px solid var(--c-line);
  border-radius:var(--r-xl); padding:clamp(30px, 4vw, 56px) var(--s-6);
}
.empty-state__icon{
  display:grid; place-items:center; width:56px; height:56px; margin:0 auto var(--s-5);
  border-radius:var(--r-pill); background:var(--c-beige-soft); color:var(--c-accent); border:1px solid var(--c-line);
}
.empty-state h2{ font-family:var(--f-serif); font-size:clamp(20px,2vw,26px); font-weight:500; margin-bottom:var(--s-3); }
.empty-state p{ font-size:var(--fs-sm); color:var(--c-muted); max-width:56ch; margin:0 auto; line-height:1.7; }
.empty-state__cta{ display:flex; flex-wrap:wrap; justify-content:center; gap:var(--s-3); margin-top:var(--s-6); }

/* ==========================================================================
   21. HİZMET BLOKLARI (zig-zag)
   ========================================================================== */
.svc{ padding-block:clamp(34px, 3.6vw, 56px); border-bottom:1px solid var(--c-line); background:var(--c-surface); }
.svc--alt{ background:var(--c-page); }
.svc__inner{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(26px, 3.2vw, 52px); align-items:center; }
.svc--alt .svc__inner{ grid-template-columns:1.1fr .9fr; }
.svc--alt .svc__media{ order:2; }
.svc__media img{ width:100%; height:auto; border-radius:var(--r-lg); border:1px solid var(--c-line); }
.svc__body > * + *{ margin-top:var(--s-4); }
.svc__body p{ font-size:var(--fs-base); line-height:1.7; }
.svc__body .eyebrow{ margin-bottom:var(--s-3); }
.svc__cta{ display:flex; flex-wrap:wrap; gap:var(--s-2); }

/* ==========================================================================
   22. YAZI TİPOGRAFİSİ (prose) + YAN PANEL
   ========================================================================== */
.layout-sidebar{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:clamp(28px, 3.4vw, 56px); align-items:start; }

.prose{ max-width:72ch; font-size:var(--fs-md); line-height:1.78; color:var(--c-body); }
.prose > * + *{ margin-top:var(--s-4); }
.prose h2{
  font-family:var(--f-serif); font-size:clamp(21px, 2vw, 27px); font-weight:500;
  line-height:1.25; margin-top:var(--s-8); margin-bottom:var(--s-3);
}
.prose h3{ font-size:var(--fs-h3); font-weight:600; margin-top:var(--s-5); }
.prose p{ font-size:var(--fs-md); }
.prose a{ color:var(--c-accent); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; }
.prose a:hover{ color:var(--c-accent-dark); }
.prose strong{ color:var(--c-ink); font-weight:600; }
.prose__figure{ margin:0 0 var(--s-6); }
.prose__figure img{ width:100%; height:auto; border-radius:var(--r-lg); border:1px solid var(--c-line); }
.prose .ticks li{ font-size:var(--fs-base); }
.prose--legal{ font-size:var(--fs-base); }
.prose--legal h2{ font-size:clamp(19px, 1.7vw, 23px); margin-top:var(--s-7); }

.table-wrap{ overflow-x:auto; margin:var(--s-5) 0; border:1px solid var(--c-line); border-radius:var(--r-md); }
.table{ width:100%; border-collapse:collapse; font-size:var(--fs-sm); background:var(--c-surface); }
.table caption{ text-align:left; padding:var(--s-3) var(--s-4); font-size:var(--fs-xs); color:var(--c-muted); }
.table th, .table td{ padding:11px var(--s-4); text-align:left; border-top:1px solid var(--c-line); }
.table thead th{ background:var(--c-beige-soft); color:var(--c-ink); font-weight:600; }

.toc-box{ background:var(--c-beige-soft); border:1px solid var(--c-line); border-radius:var(--r-md); padding:var(--s-5); }
.toc-box h2{ font-family:var(--f-sans); font-size:13px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; margin:0 0 var(--s-3); }
.toc{ display:grid; gap:8px; }
.toc li{ font-size:var(--fs-sm); }
.toc a{ color:var(--c-body); text-decoration:none; }
.toc a:hover{ color:var(--c-accent); text-decoration:underline; }
ol.toc{ counter-reset:toc; }
ol.toc li{ counter-increment:toc; }
ol.toc li::before{ content:counter(toc) ". "; color:var(--c-muted); }

.sidebar{ display:grid; gap:var(--s-4); position:sticky; top:calc(var(--sticky-h) + 20px); }
.sidebar__card{
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-lg);
  padding:var(--s-5); display:grid; gap:var(--s-3);
}
.sidebar__card--soft{ background:var(--c-beige-soft); }
.sidebar__title{ font-size:var(--fs-h3); font-weight:600; font-family:var(--f-sans); }
.sidebar__text{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.6; }
.sidebar__meta{ display:grid; gap:10px; font-size:var(--fs-sm); color:var(--c-body); }
.sidebar__meta li{ display:grid; grid-template-columns:20px 1fr; gap:10px; align-items:start; }
.sidebar__meta .ico{ color:var(--c-accent); margin-top:2px; }
.sidebar__link{ display:inline-flex; align-items:center; gap:6px; font-size:var(--fs-sm); font-weight:500; color:var(--c-accent); }
.sidebar__link:hover{ text-decoration:underline; }

.author-box{
  display:grid; grid-template-columns:52px 1fr; gap:var(--s-4);
  background:var(--c-beige-soft); border:1px solid var(--c-line); border-radius:var(--r-lg);
  padding:var(--s-5); margin-top:var(--s-7);
}
.author-box__avatar{
  display:grid; place-items:center; width:52px; height:52px; border-radius:var(--r-pill);
  background:var(--c-surface); border:1px solid var(--c-line); color:var(--c-accent);
}
.author-box__name{ font-size:15px; font-weight:600; color:var(--c-ink); }
.author-box__text{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.65; margin-top:4px; }
.author-box__link{ display:inline-flex; align-items:center; gap:5px; font-size:var(--fs-sm); color:var(--c-accent); margin-top:var(--s-2); }
.author-box__link:hover{ text-decoration:underline; }

.share{ display:flex; align-items:center; gap:var(--s-2); margin-top:var(--s-6); flex-wrap:wrap; }
.share__label{ font-size:var(--fs-xs); letter-spacing:.08em; text-transform:uppercase; color:var(--c-muted); margin-right:var(--s-2); }
.share__btn{
  display:grid; place-items:center; width:40px; height:40px; border-radius:var(--r-pill);
  border:1px solid var(--c-line); background:var(--c-surface); color:var(--c-body);
  transition:border-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.share__btn:hover{ border-color:var(--c-accent); color:var(--c-accent); transform:translateY(-1px); }
.share__status{ font-size:var(--fs-xs); color:var(--c-accent); }

/* ==========================================================================
   23. BLOG LİSTESİ
   ========================================================================== */
.feature-post{
  display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(22px,2.6vw,44px); align-items:center;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-xl);
  overflow:hidden;
}
.feature-post__media img{ width:100%; height:100%; aspect-ratio:16/10; object-fit:cover; }
.feature-post__body{ padding:clamp(20px,2.4vw,34px) clamp(20px,2.4vw,34px) clamp(20px,2.4vw,34px) 0; }
.feature-post__body h2{ font-family:var(--f-serif); font-size:clamp(22px,2.2vw,30px); font-weight:500; margin:var(--s-3) 0; }
.feature-post__body h2 a:hover{ color:var(--c-accent); }
.feature-post__body p{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.7; }
.post-meta{ display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-5); margin:var(--s-4) 0; font-size:var(--fs-xs); color:var(--c-muted); }
.post-meta li{ display:flex; align-items:center; gap:6px; }
.post-meta .ico{ color:var(--c-accent); }

.post-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--s-5); margin-top:var(--s-5); }
.pcard > a, .pcard > span{
  display:flex; flex-direction:column; height:100%;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-lg); overflow:hidden;
  transition:border-color .22s var(--ease), box-shadow .22s var(--ease), transform .22s var(--ease);
}
.pcard > a:hover{ border-color:var(--c-line-strong); box-shadow:var(--sh-2); transform:translateY(-3px); }
.pcard__media{ display:block; aspect-ratio:16/10; overflow:hidden; background:var(--c-beige-soft); }
.pcard__media img{ width:100%; height:100%; object-fit:cover; }
.pcard__body{ display:flex; flex-direction:column; gap:7px; padding:var(--s-4) var(--s-4) var(--s-5); flex:1; }
.pcard__tag{ font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--c-accent); }
.pcard__title{ font-size:var(--fs-h3); font-weight:600; color:var(--c-ink); line-height:1.35; }
.pcard__text{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.6; }
.pcard__date{ font-size:var(--fs-xs); color:var(--c-muted); margin-top:auto; padding-top:var(--s-3); }
.pcard--soon > span{ opacity:.72; }
.pcard--soon .badge{ margin-top:auto; align-self:flex-start; }
.post--soon > span{ display:grid; grid-template-columns:72px minmax(0,1fr); gap:var(--s-4); align-items:center;
  background:var(--c-page); border:1px dashed var(--c-line-strong); border-radius:var(--r-md); padding:10px; opacity:.8; }
.post--soon img{ width:72px; height:72px; object-fit:cover; border-radius:var(--r-sm); }

/* ==========================================================================
   24. İLETİŞİM + FORM
   ========================================================================== */
.contact-layout{ display:grid; grid-template-columns:1fr .9fr; gap:clamp(28px,3.4vw,56px); align-items:start; }
.info-list{ display:grid; gap:var(--s-4); margin-top:var(--s-4); }
.info-list li{ display:grid; grid-template-columns:38px 1fr; gap:var(--s-3); font-size:var(--fs-sm); line-height:1.6; }
.info-list__icon{
  display:grid; place-items:center; width:38px; height:38px; border-radius:var(--r-pill);
  background:var(--c-beige-soft); border:1px solid var(--c-line); color:var(--c-accent);
}
.info-list strong{ display:block; font-size:var(--fs-xs); letter-spacing:.06em; text-transform:uppercase; color:var(--c-muted); margin-bottom:3px; }
.info-list a:hover{ color:var(--c-accent); }

.map-box{ margin-top:var(--s-6); border:1px solid var(--c-line); border-radius:var(--r-lg); overflow:hidden; background:var(--c-beige-soft); }
.map-box iframe{ display:block; width:100%; height:340px; border:0; }
.map-box__ph{ display:grid; justify-items:center; gap:var(--s-3); padding:clamp(28px,3.4vw,48px) var(--s-5); text-align:center; }
.map-box__ph .ico{ width:30px; height:30px; color:var(--c-accent); }
.map-box__ph p{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.6; }
.map-box__ph p strong{ color:var(--c-ink); }
.map-box__actions{ display:flex; flex-wrap:wrap; justify-content:center; gap:var(--s-3); }
.map-box:focus{ outline:none; }
.map-box:focus-visible{ outline:2px solid var(--c-accent); outline-offset:3px; }

.contact-form{
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-xl);
  padding:clamp(22px,2.6vw,34px); box-shadow:var(--sh-1);
}
.contact-form__lead{ font-size:var(--fs-sm); color:var(--c-muted); margin:var(--s-3) 0 var(--s-5); line-height:1.6; }
.contact-form form, .lead__form{ display:grid; gap:var(--s-4); }

.field{ display:grid; gap:6px; }
.field label{ font-size:var(--fs-sm); font-weight:500; color:var(--c-ink); }
.field input[type="text"], .field input[type="tel"], .field input[type="email"], .field select, .field textarea{
  width:100%; padding:13px var(--s-4);
  font-family:inherit; font-size:16px;            /* iOS odak zoom'unu engeller */
  color:var(--c-ink); background:var(--c-page);
  border:1px solid var(--c-line-strong); border-radius:var(--r-sm);
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease), background-color .2s var(--ease);
}
.field textarea{ resize:vertical; min-height:92px; line-height:1.6; }
.field select{ appearance:none; background-image:linear-gradient(45deg, transparent 50%, var(--c-muted) 50%), linear-gradient(135deg, var(--c-muted) 50%, transparent 50%);
  background-position:calc(100% - 20px) 22px, calc(100% - 14px) 22px; background-size:6px 6px, 6px 6px; background-repeat:no-repeat; padding-right:44px; }
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; background:var(--c-surface); border-color:var(--c-accent);
  box-shadow:0 0 0 3px rgba(107,58,63,.12);
}
.field input::placeholder, .field textarea::placeholder{ color:#B3A89F; }
.field--check{ display:grid; grid-template-columns:24px 1fr; gap:var(--s-3); align-items:start; }
/* WCAG 2.5.8: dokunma hedefi her cihazda en az 24×24 CSS pikseli olmalı. */
.field--check input{ width:24px; height:24px; margin-top:1px; accent-color:var(--c-accent); flex:none; }
.field--check label{ font-size:var(--fs-xs); font-weight:400; color:var(--c-muted); line-height:1.6; }
.field--check label a{ color:var(--c-accent); text-decoration:underline; }
.field--check .field__error{ grid-column:1 / -1; }
.field__error{ font-size:var(--fs-xs); color:#A3392F; }
.field.has-error input, .field.has-error select{ border-color:#C0584B; background:#FDF6F4; }

/* ==========================================================================
   25. CTA BANDI
   ========================================================================== */
.cta-band{ background:var(--c-beige); border-top:1px solid var(--c-line); padding-block:clamp(34px,3.8vw,56px); }
.cta-band__inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--s-5) var(--s-7); }
.cta-band__title{ font-family:var(--f-serif); font-size:clamp(21px,2.1vw,28px); font-weight:500; margin-bottom:var(--s-2); }
.cta-band p{ font-size:var(--fs-sm); color:var(--c-body); max-width:60ch; }
.cta-band__actions{ display:flex; flex-wrap:wrap; gap:var(--s-3); }

/* ==========================================================================
   26. LEAD MODAL
   ========================================================================== */
.lead{ position:fixed; inset:0; z-index:120; display:none; place-items:center; padding:var(--s-5); }
.lead:not([hidden]){ display:grid; }
.lead__backdrop{ position:absolute; inset:0; background:rgba(28,24,21,.55); animation:fadeIn .25s var(--ease); }
.lead__dialog{
  position:relative; width:min(100%, 460px); max-height:calc(100dvh - 48px); overflow-y:auto;
  background:var(--c-surface); border-radius:var(--r-xl); box-shadow:0 30px 70px -30px rgba(28,24,21,.6);
  padding:clamp(24px, 3vw, 34px);
  animation:leadIn .32s var(--ease);
}
@keyframes fadeIn{ from{ opacity:0 } to{ opacity:1 } }
@keyframes leadIn{ from{ opacity:0; transform:translateY(14px) scale(.985) } to{ opacity:1; transform:none } }
.lead__close{
  position:absolute; top:10px; right:10px; width:44px; height:44px;
  display:grid; place-items:center; border-radius:var(--r-pill); color:var(--c-muted);
  transition:background-color .2s var(--ease), color .2s var(--ease);
}
.lead__close:hover{ background:var(--c-beige-soft); color:var(--c-ink); }
.lead__eyebrow{ margin-bottom:var(--s-3); }
.lead__title{ font-family:var(--f-serif); font-size:clamp(21px,2vw,26px); font-weight:500; line-height:1.25; }
.lead__desc{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.65; margin:var(--s-3) 0 var(--s-5); }
.lead__submit{ width:100%; }
.lead__hint{ display:flex; gap:7px; align-items:flex-start; font-size:var(--fs-xs); color:var(--c-muted); line-height:1.6; }
.lead__hint .ico{ color:var(--c-accent); flex:none; margin-top:2px; }
.lead__hint a{ color:var(--c-accent); text-decoration:underline; }
.lead__status{ font-size:var(--fs-xs); color:var(--c-accent); min-height:1em; }
body.lead-open{ overflow:hidden; }

/* ==========================================================================
   27. KAMPANYA SAYFASI — showcase, plan kartları, adımlar, mevsim
   ========================================================================== */
.page-hero--camp{ background:linear-gradient(180deg, var(--c-beige-soft) 0%, var(--c-panel) 100%); }

/* Öne çıkan program */
.promo{
  display:grid; grid-template-columns:.92fr 1.08fr; align-items:stretch;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-xl);
  overflow:hidden; box-shadow:var(--sh-1);
}
.promo__media{ position:relative; }
.promo__media picture{ display:block; height:100%; }
.promo__media img{ width:100%; height:100%; min-height:300px; object-fit:cover; }
.promo__body{ padding:clamp(24px, 3vw, 44px); display:flex; flex-direction:column; gap:var(--s-4); }
.promo__title{ font-family:var(--f-serif); font-size:clamp(24px, 2.4vw, 34px); font-weight:500; line-height:1.15; }
.promo__text{ font-size:var(--fs-base); line-height:1.72; color:var(--c-body); }
.promo__list{ margin-top:var(--s-1); }
.promo__cta{ display:flex; flex-wrap:wrap; gap:var(--s-3); margin-top:var(--s-2); }
.promo__note{ display:flex; gap:7px; align-items:flex-start; font-size:var(--fs-xs); color:var(--c-muted); }
.promo__note .ico{ color:var(--c-accent); flex:none; margin-top:2px; }

/* Plan kartları */
.plan-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-5); }
.plan{
  display:flex; flex-direction:column;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-xl);
  overflow:hidden;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
}
.plan:hover{ border-color:var(--c-line-strong); box-shadow:var(--sh-2); transform:translateY(-3px); }
.plan__media{ display:block; aspect-ratio:21/9; overflow:hidden; background:var(--c-beige-soft); }
.plan__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.plan:hover .plan__media img{ transform:scale(1.04); }
.plan__body{ display:flex; flex-direction:column; gap:var(--s-3); padding:clamp(20px,2.2vw,28px); flex:1; }
.plan__title{ font-family:var(--f-serif); font-size:clamp(20px,1.9vw,24px); font-weight:500; }
.plan__text{ font-size:var(--fs-sm); color:var(--c-body); line-height:1.7; }
.plan__list{ margin-top:var(--s-1); }
.plan__foot{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--s-3);
  margin-top:auto; padding-top:var(--s-4); border-top:1px solid var(--c-line);
}
.plan__note{ font-size:var(--fs-xs); color:var(--c-muted); max-width:30ch; }

/* Nasıl işliyor */
.howto{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-xl);
  overflow:hidden;
}
.howto__step{ padding:clamp(22px,2.6vw,34px); border-left:1px solid var(--c-line); }
.howto__step:first-child{ border-left:0; }
.howto__no{
  display:block; font-family:var(--f-serif); font-size:26px; font-weight:500;
  color:var(--c-accent); opacity:.55; margin-bottom:var(--s-3);
}
.howto__step h3{ font-size:var(--fs-h3); font-weight:600; margin-bottom:8px; }
.howto__step p{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.7; }

/* Mevsim kartları */
.season-grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--s-4); }
.season{
  position:relative; background:var(--c-surface); border:1px solid var(--c-line);
  border-radius:var(--r-lg); padding:var(--s-5) var(--s-5) var(--s-6);
  display:flex; flex-direction:column; gap:var(--s-2);
}
.season::before{
  content:""; position:absolute; top:0; left:var(--s-5); right:var(--s-5); height:2px;
  background:var(--c-accent); opacity:.28; border-radius:0 0 2px 2px;
}
.season__tag{
  font-size:11px; font-weight:600; letter-spacing:.09em; text-transform:uppercase;
  color:var(--c-accent); margin-bottom:var(--s-1);
}
.season h3{ font-family:var(--f-serif); font-size:19px; font-weight:500; }
.season p{ font-size:var(--fs-sm); color:var(--c-muted); line-height:1.65; }

/* ==========================================================================
   28. SABİT ÇAĞRI SEKMESİ ("Sizi Arayalım")
   Varsayılan: sağ altta hap düğme. Yalnız ≥1400px'te dikey sekmeye dönüşür —
   daha dar ekranlarda içeriğin sağ kenarına binmemesi için.
   ========================================================================== */
.call-tab{
  position:fixed; right:18px; bottom:22px; z-index:85;
  display:inline-flex; align-items:center; gap:9px;
  padding:12px 18px; border-radius:var(--r-pill);
  background:var(--c-accent); color:#fff;
  font-size:13px; font-weight:500; letter-spacing:.02em;
  box-shadow:0 14px 30px -14px rgba(28,24,21,.85);
  transition:background-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease), opacity .2s var(--ease);
}
.call-tab:hover{ background:var(--c-accent-dark); transform:translateY(-2px); }

@media (min-width: 1400px){
  .call-tab{
    right:0; top:50%; bottom:auto; transform:translateY(-50%);
    padding:18px 11px; border-radius:var(--r-md) 0 0 var(--r-md);
    writing-mode:vertical-rl; letter-spacing:.05em;
    box-shadow:-8px 0 22px -14px rgba(28,24,21,.85);
  }
  .call-tab .ico{ writing-mode:horizontal-tb; }
  .call-tab:hover{ transform:translateY(-50%); padding-right:15px; }
}

body.lead-open .call-tab,
body.menu-open .call-tab{ opacity:0; pointer-events:none; }

/* Ekip portreleri ve iletişim görseli */
.tcard__photo{ display:block; width:96px; height:96px; margin:0 auto var(--s-4); }
.tcard__photo img{ width:96px; height:96px; border-radius:var(--r-pill); object-fit:cover; border:1px solid var(--c-line); }
.contact-photo{ margin:0 0 var(--s-6); }
.contact-photo img{ width:100%; height:auto; border-radius:var(--r-lg); border:1px solid var(--c-line); }

/* SEO/AEO blokları: kısa bilgi tablosu ve blog girişi */
.section--facts{ background:var(--c-beige-soft); border-block:1px solid var(--c-line); padding-block:clamp(38px,4vw,60px); }
.facts{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr); gap:clamp(24px,3vw,52px); align-items:start; }
.facts__intro p{ font-size:var(--fs-sm); color:var(--c-muted); margin-top:var(--s-3); line-height:1.7; }
.facts__list{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-4) var(--s-6); margin:0; }
.facts__list > div{ padding-bottom:var(--s-4); border-bottom:1px solid var(--c-line); }
.facts__list dt{ font-size:13px; font-weight:600; color:var(--c-ink); margin-bottom:5px; }
.facts__list dd{ margin:0; font-size:var(--fs-sm); color:var(--c-body); line-height:1.65; }
.facts__list a{ color:var(--c-accent); text-decoration:underline; text-underline-offset:2px; }
.blog-intro{ max-width:72ch; margin-bottom:clamp(26px,3vw,40px); }
.blog-intro p{ font-size:var(--fs-md); line-height:1.75; color:var(--c-body); }
.blog-intro p + p{ margin-top:var(--s-3); }
.blog-intro a{ color:var(--c-accent); text-decoration:underline; text-underline-offset:3px; }
.blog-cats{ max-width:80ch; margin:var(--s-3) 0 var(--s-5); font-size:var(--fs-sm); color:var(--c-muted); line-height:1.8; }
.blog-cats em{ font-style:normal; font-weight:600; color:var(--c-ink); }
.page-hero__kicker{ font-family:var(--f-serif); font-size:clamp(17px,1.6vw,21px); font-style:italic; color:var(--c-muted); margin-bottom:var(--s-4); }

/* --------------------------------------------------------------------------
   Çerez onayı (yalnız üçüncü taraf ölçüm tanımlıysa görünür)
   -------------------------------------------------------------------------- */
.consent{
  position:fixed; left:var(--s-4); right:var(--s-4); bottom:var(--s-4); z-index:110;
  max-width:760px; margin-inline:auto;
  background:var(--c-surface); border:1px solid var(--c-line); border-radius:var(--r-lg);
  box-shadow:0 18px 50px -22px rgba(28,24,21,.55); padding:var(--s-4) var(--s-5);
}
.consent__inner{ display:flex; align-items:center; gap:var(--s-4); flex-wrap:wrap; }
.consent__text{ flex:1 1 320px; margin:0; font-size:var(--fs-sm); line-height:1.6; color:var(--c-body); }
.consent__text strong{ display:block; color:var(--c-ink); margin-bottom:2px; }
.consent__text a{ color:var(--c-accent); text-decoration:underline; }
.consent__actions{ display:flex; gap:var(--s-2); flex:0 0 auto; }
.consent__actions .btn{ min-width:108px; min-height:44px; }
@media (max-width: 900px){
  /* Mobil alt çubuğun üstünde durur */
  .consent{ left:var(--s-3); right:var(--s-3); bottom:calc(74px + env(safe-area-inset-bottom, 0px)); padding:var(--s-4); }
  .consent__actions{ width:100%; }
  .consent__actions .btn{ flex:1 1 0; }
}