/* ==========================================================================
   LINA DERMA — responsive.css
   Kırılımlar: 1180 / 1080 / 1024 / 900 / 700 / 560 / 400
   Mobil kompozisyon "küçültülmüş desktop" değil, yeniden kurgudur.
   ========================================================================== */

/* --------------------------------------------------------------------------
   ≤ 1180px — sıkılaştırma
   -------------------------------------------------------------------------- */
@media (max-width: 1290px){
  .hero{ --hero-split:.44; }
}
@media (max-width: 1150px){
  .hero{ --hero-split:.52; }
  .hero__content{ padding-right:clamp(18px, 2.2vw, 28px); }
}

@media (max-width: 1180px){
  .services{ gap:var(--s-4); }
  .s-card__body{ padding:var(--s-3) var(--s-3) var(--s-4); }
  .chip{ width:84px; min-height:82px; }
  .about__features{ gap:var(--s-4); }
}

/* --------------------------------------------------------------------------
   ≤ 1080px — header mobil menüye geçer
   -------------------------------------------------------------------------- */
@media (max-width: 1080px){
  /* Mobil/tablet: yalnız header sticky kalır, üst bar sayfayla birlikte kayar */
  .site-top{ position:static; }
  .site-header{ position:sticky; top:0; }
  :root{ --sticky-h: var(--header-h); }
  /* Dokunmatik bağlam: üst bardaki telefon/WhatsApp hedefleri büyür */
  .topbar__inner{ min-height:46px; }
  .topbar__link{ padding-block:14px; }
  .topbar__social a{ width:38px; height:38px; }
  .share__btn{ width:44px; height:44px; }
  .footer__top{ grid-template-columns:minmax(0,1fr) auto; }
  .footer__nav{ grid-column:1 / -1; order:3; }
  .footer__nav ul{ justify-content:flex-start; }
  .nav,
  .header__phone{ display:none; }
  .burger{ display:flex; }
  .header__inner{ justify-content:space-between; gap:var(--s-4); }
  .header__actions{ gap:var(--s-3); }
}

/* --------------------------------------------------------------------------
   ≤ 1024px — tablet
   -------------------------------------------------------------------------- */
@media (max-width: 1024px){
  /* Tablet ve altı: hero tek kolona iner — görsel tam genişlik, kırpma minimum */
  .hero{ display:block; padding-top:clamp(26px, 5vw, 38px); }
  .hero__content{
    width:min(100% - var(--gutter)*2, var(--container)); margin-inline:auto;
    padding:0 0 clamp(24px, 4vw, 34px);
  }
  .hero__media img{ aspect-ratio:16 / 10; height:auto; min-height:0; object-position:center 45%; }
  .hero__cta .btn{ padding-inline:16px; font-size:14px; }
  .hero__lead{ font-size:14.5px; }

  .services{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .gallery{ grid-template-columns:repeat(3, minmax(0,1fr)); }

  /* 1024 altında iki kolonlu kurgu ekip fotoğrafını kareye sıkıştırıyordu:
     görsel tam genişliğe alınır, kırpma sıfıra iner. */
  .about{ display:block; padding-block:0 var(--s-8); }
  .about__media img{ border-radius:0; aspect-ratio:16 / 7; min-height:0; }
  .about__body{
    width:min(100% - var(--gutter)*2, var(--container)); margin-inline:auto;
    padding:var(--s-7) 0 0;
  }
  .about__features{
    width:min(100% - var(--gutter)*2, var(--container)); margin-inline:auto;
    display:grid; grid-template-columns:repeat(2, minmax(0,1fr));
    padding:var(--s-6) 0 0; gap:var(--s-5);
  }

  .bottom-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .bottom-col#iletisim{ grid-column:1 / -1; }
  #iletisim .contact{ grid-template-columns:repeat(2, minmax(0,1fr)); align-items:start; }
  #iletisim .contact .btn{ grid-column:1 / -1; }
  #iletisim .map{ margin-top:var(--s-4); }
  #iletisim .map img{ aspect-ratio:21 / 6; }
}

/* --------------------------------------------------------------------------
   ≤ 900px — hero yeniden kurgulanır, mobil bar açılır
   -------------------------------------------------------------------------- */
@media (max-width: 900px){
  body{ padding-bottom:calc(66px + env(safe-area-inset-bottom, 0px)); }
  .mobile-bar{ display:grid; }

  .hero__title{ font-size:clamp(34px, 8.4vw, 46px); }
  .hero__lead{ font-size:15px; max-width:46ch; }
  .hero__cta{ gap:var(--s-2); }
  .hero__cta .btn{ flex:1 1 auto; min-width:0; }
  .hero__media img{ aspect-ratio:16 / 10; height:auto; min-height:0; object-position:center 45%; }

  .trust__list{ gap:var(--s-3) var(--s-6); padding-block:var(--s-4) var(--s-5); }

  .reviews{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .review:last-child{ grid-column:1 / -1; }

  .finder{ gap:var(--s-5); }
  .finder__text{ flex:1 1 100%; }
  .finder__options{ justify-content:flex-start; }
  .finder__action{ flex:1 1 100%; }
  .finder__action .btn{ width:100%; }
}

/* --------------------------------------------------------------------------
   ≤ 700px — mobil
   -------------------------------------------------------------------------- */
@media (max-width: 700px){
  :root{ --header-h:64px; --section-y:46px; }

  .brand__name{ font-size:18.5px; letter-spacing:.12em; }
  .brand__sub{ font-size:8px; }

  .hero__cta{ flex-direction:column; align-items:stretch; }
  .hero__cta .btn{ width:100%; }
  /* Mobil hero kaynağı 4:3 — kutuyu da 4:3 yapıp kırpmayı sıfırlıyoruz */
  .hero__media img{ aspect-ratio:4 / 3; object-position:center 50%; }

  .trust__list{ flex-direction:column; gap:var(--s-3); }
  .trust__icon{ width:30px; height:30px; }

  .section-head{ margin-bottom:var(--s-5); }
  .section-head .link-more{ margin-left:0; }
  .section-head__main{ flex-direction:column; align-items:flex-start; gap:4px; }

  .services{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-3); }
  .s-card__media{ aspect-ratio:16 / 9; }
  .s-card__title{ font-size:15px; }
  .s-card__text{ font-size:12.5px; }

  .finder{ padding:var(--s-5) var(--s-4); border-radius:var(--r-lg); }
  .finder__options{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--s-2); }
  .chip{ width:100%; min-height:88px; font-size:11px; }

  .about{ display:block; padding-block:0 var(--s-8); }
  .about__features{ padding-inline:0; }
  .about__media img{ border-radius:0; aspect-ratio:16 / 10; min-height:0; }
  .about__body{
    width:min(100% - var(--gutter)*2, var(--container)); margin-inline:auto;
    padding:var(--s-7) 0 0;
  }
  .about__quote{ margin-top:var(--s-6); }

  .reviews{ grid-template-columns:minmax(0,1fr); }
  .review{ padding:var(--s-5); }
  .review:last-child{ grid-column:auto; }

  .gallery{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-2); }

  .bottom-grid{ grid-template-columns:minmax(0,1fr); gap:var(--s-8); }
  .bottom-col#iletisim{ grid-column:auto; }
  #iletisim .contact{ grid-template-columns:minmax(0,1fr); }
  #iletisim .map img{ aspect-ratio:16 / 10; }

  .footer__top{ grid-template-columns:minmax(0,1fr); justify-items:start; gap:var(--s-5); padding-block:var(--s-7); }
  .footer__nav{ order:2; }
  .footer__nav ul{ gap:var(--s-3) var(--s-5); }
  .footer__actions{ margin-left:0; flex-wrap:wrap; gap:var(--s-4); }
  .footer__bottom-inner{ flex-direction:column; align-items:flex-start; gap:6px; }
}

/* --------------------------------------------------------------------------
   ≤ 480px — header CTA ikon moduna geçer (yer kazanımı)
   -------------------------------------------------------------------------- */
@media (max-width: 480px){
  .header__cta-label{ display:none; }
  .header__cta{ padding:12px 15px; }
  /* Tablolar dar ekranda kart düzenine geçer: ilk hücre başlık, diğerleri
     sütun adıyla etiketli (etiketleri site.js başlık satırından yazar).
     JS çalışmazsa tablo kendi kutusunda yana kayar. */
  .table--stack thead{ display:none; }   /* sütun adları her hücrede etiket olarak var */
  .table--stack, .table--stack tbody, .table--stack tr, .table--stack caption{ display:block; width:100%; }
  .table--stack tr{ padding:12px 14px; border-top:1px solid var(--c-line); }
  .table--stack td{ display:grid; grid-template-columns:minmax(0, 36%) minmax(0, 1fr); gap:10px;
                    padding:3px 0; border:0; overflow-wrap:break-word; }
  .table--stack td::before{ content:attr(data-label); color:var(--c-muted); font-size:var(--fs-xs); font-weight:600; line-height:1.6; }
  .table--stack td:first-child{ display:block; margin-bottom:4px; font-weight:600; color:var(--c-ink); }
  .table--stack td:first-child::before{ content:none; }
}

/* --------------------------------------------------------------------------
   ≤ 560px — küçük mobil
   -------------------------------------------------------------------------- */
@media (max-width: 560px){
  .about__features{ grid-template-columns:minmax(0,1fr); gap:var(--s-4); }
  .finder__options{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .chip{ flex-direction:row; align-items:center; justify-content:flex-start; gap:10px;
         min-height:56px; text-align:left; padding:10px 12px; font-size:12px; }
  .chip .ico{ width:20px; height:20px; }
  .post a{ grid-template-columns:64px minmax(0,1fr); }
  .post img{ width:64px; height:64px; }
}

/* --------------------------------------------------------------------------
   ≤ 400px — 375/390px cihazlar
   -------------------------------------------------------------------------- */
@media (max-width: 400px){
  :root{ --gutter:16px; }
  .hero__title{ font-size:33px; }
  .s-card__body{ padding:var(--s-3); }
  .s-card__text{ font-size:12px; }
  .gallery{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .mobile-bar__item{ font-size:12px; gap:5px; padding:6px 4px; }
  .footer__nav ul{ gap:var(--s-2) var(--s-4); }
}

/* --------------------------------------------------------------------------
   ≤ 340px — çok küçük ekranlar
   -------------------------------------------------------------------------- */
@media (max-width: 340px){
  .services{ grid-template-columns:minmax(0,1fr); }
  .s-card__media{ aspect-ratio:2 / 1; }
}


/* ==========================================================================
   YENİ BİLEŞENLER (topbar, iç sayfalar, form, modal)
   ========================================================================== */

@media (max-width: 1180px){
  .footer__grid{ grid-template-columns:1.6fr 1fr 1fr 1.05fr; }
  .footer__col--brand{ grid-column:1 / -1; }
  .footer__about{ max-width:60ch; }
}

@media (max-width: 1080px){
  .topbar__hide-md{ display:none; }
  .layout-sidebar{ grid-template-columns:minmax(0,1fr); }
  .sidebar{ position:static; grid-template-columns:repeat(2, minmax(0,1fr)); }
  .feature-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}

@media (max-width: 1080px){
  .facts{ grid-template-columns:minmax(0,1fr); }
  .season-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .promo{ grid-template-columns:minmax(0,1fr); }
  .promo__media img{ min-height:0; aspect-ratio:16/8; }
}

@media (max-width: 900px){
  /* Mobilde alt aksiyon barının hemen üstüne alınır */
  .call-tab{ bottom:calc(74px + env(safe-area-inset-bottom, 0px)); right:12px; padding:11px 16px; font-size:12.5px; }
  .plan-grid{ grid-template-columns:minmax(0,1fr); }
  .howto{ grid-template-columns:minmax(0,1fr); }
  .howto__step{ border-left:0; border-top:1px solid var(--c-line); }
  .howto__step:first-child{ border-top:0; }
  .split, .split--media, .svc__inner, .svc--alt .svc__inner,
  .contact-layout, .feature-post, .info-band{
    grid-template-columns:minmax(0,1fr);
  }
  .svc--alt .svc__media{ order:0; }
  .split--media .split__media{ order:-1; }
  .feature-post__body{ padding:0 clamp(20px,3vw,28px) clamp(22px,3vw,30px); }
  .feature-post__media img{ aspect-ratio:16/9; }
  .post-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .team-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--s-3); }
  .tcard{ padding:var(--s-5) var(--s-4); }
  .mini-gallery{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .contact-form{ padding:var(--s-5); }
}

@media (max-width: 700px){
  /* Mobil üst bar: iki bölge — solda konum/saat, sağda tek dokunuşluk aksiyonlar */
  .topbar{ font-size:11.5px; }
  .topbar__hide-sm{ display:none; }
  .topbar__inner{ gap:var(--s-3); min-height:44px; }
  .topbar__info{ gap:var(--s-4); min-width:0; overflow:hidden; }
  .topbar__item span{ overflow:hidden; text-overflow:ellipsis; }
  .topbar__actions{ gap:0; flex:none; }
  .topbar__link{ padding:12px 10px; font-size:11.5px; }
  .topbar__link + .topbar__link{ margin-left:2px; border-left:1px solid rgba(232,223,213,.16); }
  .topbar__link--wa .ico{ color:#7FD3A6; }
  .topbar__info{ gap:var(--s-3); }
  .topbar__actions{ gap:var(--s-3); }

  .footer__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-6) var(--s-5); }
  .footer__col--brand{ grid-column:1 / -1; }
  .footer__areas{ flex-direction:column; gap:var(--s-2); }
  .footer__bottom-inner{ flex-direction:column; align-items:flex-start; }
  .footer__meta{ gap:6px; }

  .page-hero__lead{ font-size:15px; }
  .page-hero__cta .btn{ flex:1 1 100%; }
  .prose{ font-size:15.5px; }
  .prose h2{ margin-top:var(--s-7); }
  .two-col, .feature-grid, .feature-grid--2, .team-grid{ grid-template-columns:minmax(0,1fr); }
  .facts, .facts__list{ grid-template-columns:minmax(0,1fr); }
  .season-grid{ grid-template-columns:minmax(0,1fr); }
  .promo__cta .btn{ flex:1 1 100%; }
  .plan__foot{ flex-direction:column; align-items:flex-start; }
  .post-grid{ grid-template-columns:minmax(0,1fr); }
  .sidebar{ grid-template-columns:minmax(0,1fr); }
  .mini-gallery{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .cta-band__inner{ flex-direction:column; align-items:flex-start; }
  .cta-band__actions{ width:100%; }
  .cta-band__actions .btn{ flex:1 1 auto; }
  .kv > div{ grid-template-columns:minmax(0,1fr); gap:2px; }
  .step{ grid-template-columns:32px 1fr; gap:var(--s-3); padding:var(--s-3); }
  .empty-state__cta .btn{ flex:1 1 100%; }
  .lead{ padding:0; place-items:end stretch; }
  .lead__dialog{
    width:100%; max-height:92dvh; border-radius:var(--r-xl) var(--r-xl) 0 0;
    padding:var(--s-6) var(--s-5) calc(var(--s-6) + env(safe-area-inset-bottom, 0px));
    animation:leadSheet .3s var(--ease);
  }
  /* Dokunmatikte onay metni biraz büyür; hedef boyutları temel stilde. */
  .field--check{ padding-block:4px; }
  .field--check label{ font-size:14px; padding-block:2px; }
  @keyframes leadSheet{ from{ transform:translateY(100%) } to{ transform:none } }
}

@media (max-width: 400px){
  .topbar__info li:nth-child(n+2){ display:none; }
  .footer__grid{ grid-template-columns:minmax(0,1fr); }
  .share__btn{ width:44px; height:44px; }
}

/* --------------------------------------------------------------------------
   Yazdırma
   -------------------------------------------------------------------------- */
@media print{
  .site-header, .topbar, .mobile-bar, .hero__media, .map, .gallery, .lead, .cta-band{ display:none !important; }
  body{ background:#fff; padding:0; }
}
