/* ashtonretailpark.co.uk — RECONSTRUCTED
   Tema stylesheet'i (themes/Ashton Retail Park/css/ashton.css) Wayback'te YOK ve
   origin ölü. Bu, sayfanın kendi yapısına göre elle yazılmış bir yaklaşımdır.
   Bootstrap 5 + AOS + Slick zaten yerelde mevcut. */
:root{--navy:#0b2d5c;--navy2:#12406f;--accent:#e8462c;--ink:#22272f;--mut:#5d6674;
  --line:#e3e7ec;--bg:#fff;--bg2:#f6f8fa;--wrap:1140px;--r:10px;
  --sh:0 1px 2px rgba(11,45,92,.05),0 8px 22px rgba(11,45,92,.07)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:16px/1.65 "Lexend Deca",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--navy2);text-decoration:none}a:hover{text-decoration:underline}

/* üst bar */
body>header,body>nav,.topbar{background:#fff;border-bottom:1px solid var(--line)}
header,nav{padding:.7rem 1.25rem}
header>*,nav>*{max-width:var(--wrap);margin-inline:auto}
nav ul,header ul{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;margin:0;padding:0;
  align-items:center;justify-content:center}
nav a,header a{color:var(--navy);font-weight:600;font-size:.86rem;letter-spacing:.03em}
nav a:hover,header a:hover{color:var(--accent);text-decoration:none}

/* bölümler */
section,footer{padding:clamp(1.8rem,4vw,3rem) 1.25rem;border-bottom:1px solid var(--line)}
section>*,footer>*{max-width:var(--wrap);margin-inline:auto}
section:nth-of-type(even){background:var(--bg2)}

h1{font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.15;color:var(--navy);font-weight:700;margin:0 0 .7rem}
h2,h3{font-size:clamp(1.25rem,2.4vw,1.7rem);color:var(--navy);font-weight:700;margin:0 0 .8rem}
h4,h5{font-size:1rem;color:var(--navy);font-weight:700;margin:0 0 .3rem}
h6{font-size:.72rem;text-transform:uppercase;letter-spacing:.11em;color:var(--mut);margin:1.3rem 0 .4rem}
p{margin:0 0 .9rem;color:var(--mut);max-width:66ch}

/* mağaza rozetleri ızgarası */
.ar-badge{display:inline-flex;align-items:center;justify-content:center;min-width:132px;min-height:52px;
  margin:.3rem;padding:.55rem 1rem;border:1px solid var(--line);border-radius:var(--r);
  background:#fff;box-shadow:var(--sh);color:var(--navy);font-weight:700;font-size:.82rem;text-align:center}
.ar-lost{max-width:250px}

/* görseller */
figure{margin:0 0 1.2rem}
section img{border-radius:var(--r);box-shadow:var(--sh);max-height:400px;object-fit:cover;width:100%}

/* form */
input,textarea,select{display:block;width:100%;max-width:430px;padding:.68rem .8rem;margin:.25rem 0 .9rem;
  border:1px solid #ccd3dc;border-radius:8px;font:inherit;background:#fff}
button,input[type=submit]{width:auto;background:var(--navy);color:#fff;border:0;padding:.72rem 1.7rem;
  border-radius:var(--r);font-weight:700;cursor:pointer}
button:hover,input[type=submit]:hover{background:var(--navy2)}

/* slick/aos kalıntıları görünmesin */
.slick-slide{float:none!important}
[data-aos]{opacity:1!important;transform:none!important}
html,body{overflow-x:hidden;max-width:100vw}
@media(max-width:640px){section img{max-height:230px}}

/* --- pass 2: instagram feed eklentisi CSS'i yok, dev ikon/boşluk üretiyor --- */
/* feed'in placeholder kutuları */
.sbi_link,.sbi_photo_wrap{max-height:220px!important;overflow:hidden}
/* genel: satır içi svg'ler ikon boyutunda kalsın */
a>svg,li>svg,p>svg,span>svg{width:24px!important;height:24px!important;display:inline-block}
/* boş bölümler yer kaplamasın */
section:empty,div:empty:not([class*="col"]):not([class*="grid"]){display:none}
section>div:empty{display:none}
/* aşırı yükseklik veren kalıntılar */
[style*="min-height"]{min-height:0!important}

/* --- pass 3: görselsiz slick slider'lar dev boşluk bırakıyor --- */
.slick-slider,.slick-list,.slick-track{min-height:0!important;height:auto!important}
.slick-slide{height:auto!important;min-height:0!important}
.slick-slide>div{min-height:0!important}
/* slider içindeki rozetler tek satırda aksın */
.slick-track{display:flex!important;flex-wrap:wrap!important;justify-content:center;gap:.4rem;
  transform:none!important;width:auto!important}
.slick-slide{width:auto!important;float:none!important}
/* boş kalan konteynerler */
[class*="slider"]:empty,[class*="carousel"]:empty{display:none!important}
section,div{background-image:none}
/* aşırı padding/margin veren tema kalıntıları */
[class*="py-"],[class*="my-"]{padding-block:clamp(.5rem,2vw,1.5rem)!important}
main,#main,.site-main{padding:0!important}
/* rozetleri düzgün ızgaraya al */
.ar-badge{min-width:112px;min-height:44px;font-size:.76rem}

/* ═══ 2026-08-25 DÜZEN DÜZELTMESİ ═══
   Eksik ashton.css + sbi-styles.min.css (ikisi de Wayback'te YOK, origin ölü)
   yüzünden: nav dikey, Instagram tam genişlik/sola yığılmış. Aşağısı onları
   sayfanın gerçek DOM'una göre yeniden kuruyor. Ölçümle bulundu, kör yazılmadı. */

/* --- 1) Yatay navigasyon --- */
.site-navigation{padding:0 !important}
.site-navigation .site-menu,
.site-navigation ul.site-menu{
  display:flex !important; flex-direction:row !important; flex-wrap:wrap;
  align-items:center; justify-content:center;
  gap:.2rem 2rem; margin:0 !important; padding:0 !important; list-style:none;
}
.site-navigation .site-menu > li{
  display:inline-block !important; list-style:none; margin:0; padding:0;
}
.site-navigation .site-menu > li > a{
  display:inline-block; padding:.5rem .1rem;
  color:var(--navy); font-weight:600; font-size:.95rem; letter-spacing:.02em;
}
.site-navigation .site-menu > li > a:hover{color:var(--accent);text-decoration:none}

/* --- 2) Instagram feed: konteynerle ve 4'lü ızgara yap --- */
#sb_instagram{
  max-width:var(--wrap); margin-inline:auto !important; padding-inline:1.25rem;
  box-sizing:border-box;
}
#sb_instagram .sb_instagram_header{
  max-width:var(--wrap); margin-inline:auto; padding:0 0 .9rem;
  display:flex; align-items:center; gap:.7rem;
}
#sb_instagram .sb_instagram_header .sbi_header_img,
#sb_instagram .sb_instagram_header img{width:48px;height:48px;border-radius:50%;flex:0 0 48px}
#sb_instagram .sb_instagram_header h3{margin:0;font-size:1.05rem}

#sb_instagram #sbi_images{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px; width:100%; padding:0;
}
#sb_instagram #sbi_images .sbi_item{width:auto !important;padding:0 !important;margin:0}
#sb_instagram .sbi_photo_wrap{width:100% !important;margin:0}
#sb_instagram .sbi_photo{
  display:block; width:100%; aspect-ratio:1/1; object-fit:cover;
  border-radius:8px; overflow:hidden; background:var(--bg2);
}
#sb_instagram .sbi_photo img{width:100%;height:100%;object-fit:cover;display:block}
/* metin taşmasını engelle */
#sb_instagram .sbi_caption_wrap,#sb_instagram .sbi_info{max-width:100%;overflow:hidden}

@media (max-width:900px){#sb_instagram #sbi_images{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){#sb_instagram #sbi_images{grid-template-columns:1fr}}

/* --- 3) Bootstrap .row negatif margin'inin gövdeyi taşırmasını engelle --- */
.site-wrap,body{overflow-x:hidden}
/* IG ikonları (eski kuraldan korundu) */
#sb_instagram svg,.sbi_item svg,#sbi_images svg{width:24px;height:24px}

/* --- IG: gerçek fotoğraflar kurtarılamaz (cdninstagram imzalı URL'ler 403).
   Boş kutu yerine okunabilir metin kartı; sahte görsel KOYMUYORUZ. --- */
#sb_instagram .sbi_photo{
  height:auto !important; aspect-ratio:auto !important; min-height:0 !important;
  background:none !important; border-radius:0;
}
#sb_instagram #sbi_images .sbi_item{
  background:var(--bg2); border:1px solid var(--line); border-radius:10px;
  padding:1rem; display:flex; flex-direction:column; gap:.5rem;
}
#sb_instagram .sbi_caption_wrap,#sb_instagram .sbi_caption{
  font-size:.9rem; line-height:1.5; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;
}
/* üst üste binen ikonları hizala */
#sb_instagram .sbi_meta,#sb_instagram .sbi_info{display:flex;align-items:center;gap:.4rem;margin-top:auto}
#sb_instagram svg,.sbi_item svg,#sbi_images svg{width:18px;height:18px;flex:0 0 18px}
#sb_instagram .sb_instagram_header .sbi_header_img{overflow:hidden}

/* --- portfolio kartları: görselsiz kalanlar için düzgün kutu --- */
.portfolio-item-wrapper{
  background:var(--bg2); border:1px solid var(--line); border-radius:10px;
  padding:1.1rem 1.25rem; min-height:0;
}
.portfolio-item-wrapper .content-title{margin:0 0 .2rem;color:var(--navy);font-size:1.05rem}
.portfolio-item-wrapper .content-details{color:var(--mut);font-size:.92rem}

/* --- Magaza rozetleri: gercek logolar (Greggs, PureGym, Jollyes...) Wayback'te
   YOK ve origin olu. Marka logosunu AI ile URETMIYORUZ (sahte marka olur) —
   okunakli tipografik rozet olarak sunuluyor. --- */
.ar-badge{
  display:inline-flex !important; align-items:center; justify-content:center;
  min-width:150px; min-height:64px; padding:.85rem 1.1rem;
  background:#fff; border:1px solid var(--line); border-radius:10px;
  box-shadow:var(--sh); color:var(--navy);
  font-weight:700; font-size:.9rem; letter-spacing:.01em; text-align:center;
  transition:box-shadow .15s ease, transform .15s ease;
}
.ar-badge:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(11,45,92,.12)}
/* rozet izgarasi duzgun otursun */
.row.text-center .col-lg-12{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center}

/* "Visit us / What's On" kartlari */
.portfolio-item-wrapper{
  display:flex; flex-direction:column; justify-content:center;
  min-height:92px; transition:box-shadow .15s ease;
}
.portfolio-item-wrapper:hover{box-shadow:0 4px 14px rgba(11,45,92,.10)}

/* ═══ ALT SAYFA DUZEN DUZELTMESI (olcumle bulundu) ═══
   Anasayfa icerigi .container (1320px, ortalanmis) icinde; ALT SAYFALAR ise
   .container-wide kullaniyor. Bu sinif eksik ashton.css'te tanimliydi -> hicbir
   genislik siniri yok, Bootstrap .row'un -12px negatif margin'i disari tasiyor
   ve yazilar sola kayiyor (l=-12, w=1464 > 1440 viewport). */
.container-wide{
  width:100%;
  max-width:1320px;
  margin-inline:auto !important;
  padding-inline:12px;
  box-sizing:border-box;
}
/* .container-fluid tam genislikte kalmali ama icerigi ortalansin */
.shop-section > .container-wide,
.facilities-section > .container-wide,
.content-section > .container-wide{max-width:1320px}

/* negatif margin artik konteyner icinde kaliyor; yine de tasmayi kes */
.site-wrap{overflow-x:hidden}

/* alt sayfa bolum bosluklari */
.shop-section,.content-section,.page-section{padding-block:clamp(1.5rem,3vw,2.5rem)}

/* sutunlar dar ekranda alt alta gecsin */
@media (max-width:900px){
  .col-lg-4,.col-md-6,.col-lg-6,.col-sm-4{flex:0 0 100%;max-width:100%}
}

/* Magaza rozetleri .col-lg-4 (440px) icinde ama 150px kalip sola yaslaniyordu.
   Sutunu ortala, rozeti sutuna yay -> duzgun 3'lu izgara. */
.shop-section .col-lg-4,
.shop-section [class*="col-"]{
  display:flex; align-items:center; justify-content:center;
}
.shop-section .hover{width:100%; display:flex; justify-content:center}
.shop-section .hover > a{display:block; width:100%; max-width:280px}
.shop-section .ar-badge{
  width:100% !important; max-width:280px;
  min-height:88px; font-size:.95rem;
}

/* Rozet izgarasi: Bootstrap .col-lg-4 satirlari duzensiz sarilyordu (aralarda
   bosluk). Satir kapsayicisini gercek bir grid'e cevir -> esit 3 sutun.
   Ayrica "Shopping at..." ust basligi .col yuzunden yana kaymisti. */
.shop-section .row{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-inline:0 !important;
}
.shop-section .row > [class*="col-"]{
  width:auto !important; max-width:none !important;
  flex:none !important; padding:0 !important; margin:0 !important;
}
/* tam genislik isteyen basliklar grid'i asmasin */
.shop-section .row > .col-lg-12,
.shop-section .row > .col-sm-12,
.shop-section .row > .col-12{grid-column:1 / -1; text-align:center}

@media (max-width:900px){ .shop-section .row{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:560px){ .shop-section .row{grid-template-columns:1fr} }

/* Grid calisiyor (3x420px) ama rozet sutun icinde 280px kalip sola yasliydi.
   .hover ve <a> zincirini sutuna yay, rozeti tam genislige getir. */
.shop-section .row > [class*="col-"]{
  display:flex !important; align-items:stretch; justify-content:stretch;
}
.shop-section .hover{width:100% !important; display:flex !important; justify-content:stretch}
.shop-section .hover > a{width:100% !important; max-width:none !important; display:block}
.shop-section .ar-badge{
  width:100% !important; max-width:none !important;
  min-height:96px;
}
/* ust baslik: yan yana kaymayi engelle */
.shop-section .row > .col-lg-12,
.shop-section .row > .col-sm-12,
.shop-section .row > .col-12{
  display:block !important; grid-column:1 / -1 !important; text-align:center;
}

/* Bazi .col-lg-4 hucreleri BOS (orijinal HTML'de rozet yok) -> izgarada delik
   birakiyorlardi. Bos sutunlari akistan cikar, dolu olanlar sirayla dizilsin. */
.shop-section .row > [class*="col-"]:not(:has(.ar-badge)):not(.col-lg-12):not(.col-sm-12):not(.col-12){
  display:none !important;
}
/* :has desteklemeyen tarayici icin yedek: bos .hover'i da gizle */
.shop-section .hover:empty{display:none !important}