.product-category-page .gallery{grid-template-columns:repeat(4,1fr)}
@media(min-width:700px){.product-category-page .gallery{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1100px){.product-category-page .gallery{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){.product-category-page .gallery{grid-template-columns:repeat(2,1fr)}}
.product-category-page .gallery figure{overflow:hidden;aspect-ratio:16/9}
.product-category-page .gallery img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
.products-page #fihrist,.products-page #kose-perforaj{scroll-margin-top:60px}
.contact-container{max-width:1200px}
@media(min-width:900px){
  /* Masaüstünde: Adres / İletişim / Bize Ulaşın bloklarını 10px yukarı al */
  .contact-container{margin-top:-10px}
}
.contact-grid{display:grid;gap:16px;grid-template-columns:1fr;margin-bottom:0;padding-bottom:0}
.contact-grid h2{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;font-weight:800;font-size:1.6rem;margin:0 0 20px;line-height:1.2}
.contact-grid > section{padding-top:0}
.contact-grid address{font-style:normal}
.contact-grid > section{margin-bottom:0}
.contact-grid{justify-content:flex-start;align-items:start}
.contact-grid a{color:var(--fg);text-decoration:none}
.contact-grid a:hover{color:var(--accent);text-decoration:underline}
@media(min-width:900px){.contact-grid{grid-template-columns:auto auto auto}}
.contact-grid .form{max-width:none}
@media(min-width:900px){.contact-grid > section:first-child{margin-left:-10px}}
@media(min-width:900px){.contact-grid > section:nth-child(2){margin-left:75px}}
@media(min-width:900px){.contact-grid > section:nth-child(3){margin-left:100px}}

/* Mail Otomasyonu formu: mesaj sağda, alanlar solda, buton geniş */
.contact-form{display:grid;gap:10px}
/* Contact page: remove extra space under form status */
.contact-grid .status{min-height:0;margin:0}
.contact-grid .list{margin:0}
.contact-grid address p{margin:0}
/* Remove bottom margin under submit button */
.contact-form .btn{margin-bottom:0}
@media(min-width:900px){
  .contact-form{grid-template-columns:1fr 1fr;column-gap:16px}
  .contact-form input[name="name"],
  .contact-form input[name="email"],
  .contact-form input[name="phone"]{grid-column:1}
  .contact-form textarea{grid-column:2;grid-row:1 / span 3;min-height:240px;height:100%}
  .contact-form .btn{grid-column:1 / -1;width:100%;margin-bottom:0}
}
.contact-grid .social-links{margin-top:8px;display:flex;gap:10px;justify-content:center}
.contact-grid .social-links a{text-decoration:none;color:inherit;line-height:1}
.contact-grid .social-links svg,.contact-grid .social-links img{width:28px;height:28px;display:block}
.contact-grid .social-links a:hover{color:var(--accent)}
/* Mobile-specific contact layout tweaks */
@media(max-width:900px){
  /* Put Adres and İletişim yan yana */
  .contact-grid{grid-template-columns:1fr 1fr;align-items:start}
  .contact-grid > section:nth-child(1){grid-column:1}
  .contact-grid > section:nth-child(2){grid-column:2}
  /* Form spans full row under them */
  .contact-grid > section:nth-child(3){grid-column:1 / -1}
  /* In the form: Ad/E‑posta/Telefon left; Mesaj ve Gönder sağda */
  .contact-form{grid-template-columns:1fr 1fr}
  .contact-form input[name="name"],
  .contact-form input[name="email"],
  .contact-form input[name="phone"]{grid-column:1}
  .contact-form textarea{grid-column:2;grid-row:1 / span 3;min-height:220px;height:100%}
  .contact-form .btn{grid-column:2;width:100%;margin-bottom:0}
}
/* Remove extra space under contact page on mobile: bring footer closer */
@media(max-width:900px){
  body.contact-page .site-footer{margin-top:8px}
  body.contact-page .contact-container{margin-bottom:0;padding-bottom:0}
}
/* Mobile: shrink map height a bit */
@media(max-width:900px){
  .map-hero-wrap iframe{height:400px !important}
}
.perforaj h2{margin:24px 0 10px}
.fihrist h2{margin:24px 0 10px}
.gallery{display:grid;gap:12px;grid-template-columns:repeat(2,1fr);margin-bottom:28px}
@media(min-width:700px){.gallery{grid-template-columns:repeat(3,1fr)}}
@media(min-width:900px){.gallery{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1100px){.gallery{grid-template-columns:repeat(5,1fr)}}
.gallery figure{margin:0;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--card-bg);cursor:pointer;position:relative}
.gallery img{width:100%;height:160px;object-fit:cover;display:block}
.gallery figure.more img{filter:blur(2px) brightness(.7)}
.more-badge{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.55);color:#fff;padding:6px 10px;border-radius:999px;font-weight:700}

/* Lightbox */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.82);display:flex;align-items:center;justify-content:center;z-index:50}
.lightbox[hidden]{display:none !important}
.lightbox{touch-action:pan-y}
.lightbox img{max-width:90vw;max-height:80vh;width:auto;height:auto;object-fit:contain;display:block;margin:0 auto;cursor:zoom-in;transition:transform .2s ease}
.lightbox img.zoomed{transform:scale(1.6);cursor:zoom-out}
.lightbox button{position:absolute;background:rgba(255,255,255,.9);border:4px solid var(--accent);border-radius:8px;padding:6px 10px;cursor:pointer}
.lightbox-close{top:16px;right:16px;font-size:22px;line-height:1}
.lightbox-prev{left:16px;top:50%;transform:translateY(-50%);font-size:26px}
.lightbox-next{right:16px;top:50%;transform:translateY(-50%);font-size:26px}
.lightbox-counter{position:absolute;right:16px;bottom:12px;background:rgba(255,255,255,.92);color:#111827;border:4px solid var(--accent);border-radius:8px;padding:8px 14px;font-weight:900;min-width:84px;text-align:center;font-size:1.1rem}
/* external separator element between anchors */
.nav-sep{position:relative;display:block;width:0;margin:0 -7.2px}
.nav-sep::before{content:"";position:absolute;left:-1.3px;top:0px;bottom:0px;width:3px;background:var(--border);transform:rotate(var(--sep-angle));transform-origin:center;pointer-events:none;z-index:4}
:root{
  --bg:#ffffff;--fg:#0b0b0c;--muted:#6b7280;--primary:#111827;--primary-contrast:#ffffff;--border:#e5e7eb;--card-bg:#ffffff;--accent:#536F3A;--menu-border:#94a3b8
  ;
  --sep-angle:13deg; --overlap:0px; --sep-extend:36px; --sep-offset:18px;
}
html[data-theme="dark"]{
  --bg:#0b0b0c;--fg:#f3f4f6;--muted:#9ca3af;--primary:#536F3A;--primary-contrast:#ffffff;--border:#1f2937;--card-bg:#111317;--accent:#536F3A;--menu-border:var(--border);
}
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  overflow-x:hidden;
  min-height:100vh;
  display:grid;
  grid-template-rows:auto 1fr auto;
}

/* Masaüstü için: ekran boyutuna göre hafif zoom ayarı (mobil hariç) */
@media(min-width:901px) and (max-width:1359px){
  html{zoom:.8}
}
@media(min-width:1920px) and (min-height:1080px){
  html{zoom:1.2}
}

/* Remove extra space at the very end of content */
main > *:last-child{margin-bottom:0 !important;padding-bottom:0 !important}
.site-footer{margin-top:0}
/* Layout: let footer hug content (no extra fill space) */
body{display:block;min-height:auto}
#swup{display:block;flex:none}
main{display:block;flex:none}
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.site-header{border-bottom:0;background:var(--bg);position:relative;top:auto;left:auto;right:auto;z-index:10}
.nav{display:flex;flex-direction:column;align-items:center;gap:10px;justify-content:center;padding:14px 0}
.brand{font-weight:700;display:flex;align-items:center;justify-content:flex-start;gap:10px;align-self:flex-start;width:100%}
.brand .logo{height:80px;width:auto;display:block}
.since{width:100%;text-align:right;color:var(--muted);font-weight:600;font-size:.95rem;margin:2px 0 6px}

/* Align logo and since-year on the same row above the menu */
.nav{display:grid;grid-template-columns:1fr auto;grid-template-areas:"brand since" "menu menu";row-gap:8px}
.brand{grid-area:brand;align-self:center}
.since{grid-area:since;align-self:center;margin:0;display:flex;justify-content:flex-end;align-items:baseline;gap:0}
#since-year{font-size:4rem;font-weight:800;letter-spacing:.2px;line-height:1;color:var(--accent);font-family:"Brush Script MT","Segoe Script","Lucida Handwriting","Comic Sans MS",cursive}
.since-dot{height:16px;width:16px;display:inline-block;margin:0 8px 0 0;background:var(--bg);border-radius:50%;position:relative;top:4px}
.since-label{font-weight:800;font-size:3rem;letter-spacing:.2px;line-height:1;color:var(--accent);font-family:"Brush Script MT","Segoe Script","Lucida Handwriting","Comic Sans MS",cursive}
nav{grid-area:menu}
/* Allow content area to take remaining height so footer sticks to bottom */
#swup{flex:1 0 auto;display:flex;flex-direction:column}
main{flex:1 0 auto}
nav{display:flex;gap:0;flex-wrap:nowrap;justify-content:center;position:relative;padding:0 6px;width:100%;background:var(--bg)}
/* Top & bottom straight separators around the menu row */
nav::before,nav::after{content:"";position:absolute;left:50%;height:2px;background:var(--border);transform:translateX(-50%);pointer-events:none;width:100vw;z-index:5}
nav::before{top:0;height:3px}
nav::after{bottom:0;height:2.1px}
/* Item slanted (parallelogram) clickable areas */
nav a{
  position:relative;
  margin:0;
  color:var(--fg);
  text-decoration:none;
  border-radius:0;
  font-size:1.25rem;
  display:flex;
  flex:1 1 0;
  justify-content:center;
  align-items:center;
  padding:22px 36px;
  background:transparent;
  min-width:0;
  text-align:center;
  /* Parallelogram shape + hit area */
  clip-path:polygon(7% 0, 100% 0, 93% 100%, 0 100%);
  z-index:1;
}
/* simplify: top/bottom lines are handled by nav::before/after */
nav a::before{display:none}
nav a .label{display:block;position:relative}
/* remove label pseudo separators */
/* No overlap: separators control spacing */
nav a + a{ margin-left: 0 }
/* Separatör çizgilerine artık ihtiyaç yok; yamuk alanların yan kenarları çizgi görevini görür */
nav a+ a::before{display:none}
/* Slanted separators between items reaching top/bottom lines */
nav a+ a::after{display:none}
nav a.active,nav a:hover{background:var(--accent);color:#ffffff;z-index:2}
nav a.active .label,nav a:hover .label{color:#ffffff}
/* Allow separators to sit above items (no isolation) */
/* Tüm yamuk buton boyunca tıklanabilir alan sağlamak için */
nav a{display:inline-block}
/* Mobile header/nav adjustments */
@media(max-width:900px){
  .brand .logo{height:48px}
  /* Add 5px gap on the left of the main logo */
  .brand .logo{margin-left:10px}
  #since-year{font-size:1.8rem}
  .since-label{font-size:1.5rem}
  .since-dot{height:12px;width:12px;top:3px;margin:0 3px 0 0}
  /* Show since block again on phones, but smaller */
  .since{
    display:flex;
    margin:0;                   /* reset margins */
    padding-right:14px;         /* explicit right gap from edge */
    justify-content:flex-end;   /* align to right within its cell */
  }
  /* Ensure brand green for since text on mobile */
  #since-year,.since-label{color:var(--accent)}
  .nav{
    padding:6px 0;
    /* Make brand column auto, since column flexible so since sits next to logo */
    grid-template-columns:auto 1fr;
    grid-template-areas:"brand since" "menu menu";
  }
  nav{
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    /* Reliable horizontal lines via borders */
    border-top:1.5px solid var(--border);
    border-bottom:1.5px solid var(--border);
  }
  /* Remove pseudo lines to avoid stacking issues */
  nav::before,nav::after{display:none}
  /* Make menu text smaller and prevent overlap */
  nav a{
    font-size:.68rem;
    padding:7px 5px;
    /* milder slant to keep inside viewport */
    clip-path:polygon(7% 0, 100% 0, 93% 100%, 0 100%); /* same slant as separators/desktop */
    /* keep green area inside top/bottom borders and slanted separators */
    margin:-1px 2px;
    background-clip:padding-box;
    flex:1 0 0;                      /* equal width for all buttons */
    min-width:0;
    border-radius:0
  }
  /* Slanted separators between items (match desktop angle/color/thickness) */
  .nav-sep{
    display:block; width:0; margin:0 -5px;
    position:relative;
    align-self:stretch;
    height:auto
  }
  .nav-sep::before{
    content:""; position:absolute; top:-2px; bottom:-2px; left:-1px; /* extend and center slightly */
    width:1.5px; background:var(--border);
    transform:rotate(var(--sep-angle)); transform-origin:center;
    pointer-events:none; z-index:4
  }
}
.hero{padding:64px 0;border-bottom:1px solid var(--border)}
.hero h1{font-size:40px;margin:0 0 8px}
.hero p{color:var(--muted);margin:0 0 16px}
.hero-actions{display:flex;gap:12px}
.carousel{padding:30px 0 32px;margin-bottom:10px}
/* Masaüstü için: 1920x1080 referans alınarak slider yüksekliği
   360px ile 560px arasında tutulur. 1080p ekranda yaklaşık 560px olur,
   daha kısa ekranlarda otomatik küçülür, daha büyüklerde büyümez. */
.carousel .swiper{
  --carousel-h:clamp(360px, calc(100vh - 520px), 560px);
  width:min(100%, 980px);
  margin:0 auto;
  position:relative;
  border-left:16px solid var(--accent);
  border-right:16px solid var(--accent);
  border-top:0;
  border-bottom:0;
  border-radius:16px;
  padding:0 64px;
  background:#fff;
  height:var(--carousel-h);
  box-shadow:0 10px 30px rgba(0,0,0,.10);
}
.carousel .swiper-slide{display:flex;justify-content:center;align-items:center;height:var(--carousel-h)}
.carousel .swiper-slide img{width:100%;height:100%;object-fit:contain;border-radius:10px;border:none;background:#fff;filter:drop-shadow(0 8px 16px rgba(0,0,0,.08))}
/* place arrows on the border area, not on the photo */
.carousel .swiper-button-prev,.carousel .swiper-button-next{color:var(--accent);width:44px;height:44px;border:2px solid var(--accent);border-radius:50%;background:#fff;top:calc(var(--carousel-h)/2);transform:translateY(-50%);z-index:5;box-shadow:0 6px 16px rgba(0,0,0,.12);transition:transform .15s ease,background .15s ease}
.carousel .swiper-button-prev{left:8px}
.carousel .swiper-button-next{right:8px}
.carousel .swiper-button-prev:after,.carousel .swiper-button-next:after{font-size:18px}
.carousel .swiper-button-prev:hover,.carousel .swiper-button-next:hover{background:rgba(255,255,255,.95);transform:translateY(-50%) scale(1.05)}
/* prevent blue selection/drag highlight */
.carousel, .carousel *{-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.carousel .swiper-button-prev:focus,.carousel .swiper-button-next:focus{outline:none}
.carousel .swiper-pagination-bullets{bottom:6px}
.carousel .swiper-pagination-bullet{background:var(--border);opacity:1;width:8px;height:8px;transition:transform .15s ease}
.carousel .swiper-pagination-bullet-active{background:var(--accent);transform:scale(1.2)}
/* Mobile carousel adjustments */
@media(max-width:900px){
  .carousel{padding:12px 0 14px}
  .carousel .swiper{
    --carousel-h:min(60vw, 360px);
    padding:0 16px;
    border-left:6px solid var(--accent);
    border-right:6px solid var(--accent)
  }
  /* Lighten edge fade further on mobile */
  .carousel .swiper::before,.carousel .swiper::after{width:22px}
  .carousel .swiper::before{left:6px;background:linear-gradient(90deg, rgba(255,255,255,.20), rgba(255,255,255,0))}
  .carousel .swiper::after{right:6px;background:linear-gradient(270deg, rgba(255,255,255,.20), rgba(255,255,255,0))}
  /* Hide arrows on mobile; use swipe instead */
  .carousel .swiper-button-prev,.carousel .swiper-button-next{display:none}
}

/* Desktop: carousel'in üst ve alt boşluklarını biraz azalt */
@media(min-width:900px){
  .carousel{padding:13px 0 20px;margin-bottom:4px}
}

/* Edge fade for nicer visual bounds */
.carousel .swiper::before,.carousel .swiper::after{content:"";position:absolute;top:0;bottom:0;width:40px;pointer-events:none;z-index:3}
.carousel .swiper::before{left:16px;background:linear-gradient(90deg, rgba(255,255,255,1), rgba(255,255,255,0))}
.carousel .swiper::after{right:16px;background:linear-gradient(270deg, rgba(255,255,255,1), rgba(255,255,255,0))}
.btn{background:var(--primary);color:var(--primary-contrast);border:none;padding:10px 16px;border-radius:10px;text-decoration:none;display:inline-block}
.btn:hover{opacity:.95}
.btn-outline{border:1px solid var(--border);padding:10px 16px;border-radius:10px;text-decoration:none;color:var(--fg)}
.grid-3{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));padding:32px 0}
.products-grid{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);padding:12px 0}
@media(max-width:900px){.products-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.products-grid{grid-template-columns:repeat(2,1fr)}}
.products-grid .card .card-title{font-weight:800;font-size:1.2rem;margin:8px 10px 6px;text-align:center}
.products-page .page-title{margin-bottom:34px}
.products-page .products-section + .products-section{margin-top:28px}
.products-page .products-section:last-of-type{margin-bottom:10px}
.services .grid-3{padding:12px 0}
.services h2{margin:8px 0 10px}
.services{margin-bottom:15px}
.services .card{margin-bottom:2px}
/* Home page: reduce gap between Hizmetlerimiz and footer */
body.home-page .services{margin-bottom:2px}
body.home-page .site-footer{margin-top:8px}
.grid-2{display:grid;gap:24px;grid-template-columns:1fr;}
@media(min-width:900px){.grid-2{grid-template-columns:1fr 1fr}}
.card{border:1px solid var(--border);border-radius:12px;padding:16px;background:var(--card-bg);cursor:pointer;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease}
.card-link{display:block;text-decoration:none;color:inherit}
.card-link:hover,.card-link:focus-visible{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 2px 10px rgba(115,139,59,.3)}
.card-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.card-link{display:block;text-decoration:none;color:inherit}
.card img{width:100%;height:180px;object-fit:cover;border-bottom:1px solid var(--border)}
.list{padding-left:18px}
.list li{margin:10px 0}
.form{display:grid;gap:10px}
.form input,.form textarea{padding:10px;border:1px solid var(--border);border-radius:10px;width:100%}
.form textarea{min-height:120px}
.status{min-height:24px}
.map{width:100%;height:300px;border:1px solid var(--border);border-radius:12px}
.map-hero-wrap{margin:10px 0 25px;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);display:flex;justify-content:center;position:relative;z-index:5}
.map-hero{display:block;width:min(1000px, calc(100vw - 64px));height:600px;border:0}
.site-footer{border-top:3px solid var(--border);padding:2px 0 6px;margin-top:0;background:var(--bg)}

/* Footer legal area */
.site-footer .legal{margin:6px 0 2px;color:var(--muted);text-align:center}
.site-footer .legal-links{margin:0;color:var(--muted);text-align:center}
.site-footer .legal-links a{color:inherit;text-decoration:none}
.site-footer .legal-links a:hover{text-decoration:underline}
.site-footer .container{position:relative}
.site-footer .visitor-counter{position:absolute;right:16px;top:8px;color:var(--muted);font-weight:600}

/* Footer directly follows content (no auto top margin) */
.site-footer{position:static;left:auto;right:auto;bottom:auto;height:60px;max-height:60px;padding:0;box-sizing:border-box;z-index:10;margin-top:100px}
.site-footer .container{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}
.site-footer .legal,.site-footer .legal-links{margin:0}

/* Mobile: footer should not be fixed; avoid overlap with browser UI */
@media(max-width:900px){
  body{padding-bottom:0}
  .site-footer{position:static;height:auto;max-height:none;padding:6px 0;border-top:1.5px solid var(--border)}
  .site-footer .container{height:auto}
  .site-footer .visitor-counter{position:static;right:auto;top:auto;margin:0 0 2px 0;font-size:.9rem}
  .site-footer .legal,.site-footer .legal-links{font-size:.9rem;line-height:1.35}
  .site-footer .legal-links a{font-size:inherit}
}

/* Theme toggle */
.theme-toggle,
.audio-toggle{
  position:absolute;
  width:56px;
  height:56px;
  border-radius:9999px;
  border:3px solid var(--border);
  background:transparent;
  color:var(--fg);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  line-height:1;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .12s ease
}
 .theme-toggle{top:21px; right:75px}
 .audio-toggle{top:21px; right:12px}
.theme-toggle:hover,.theme-toggle:focus-visible,
.audio-toggle:hover,.audio-toggle:focus-visible{
  background:var(--accent);
  color:#fff;
  border-color:var(--border);
  box-shadow:0 2px 10px rgba(115,139,59,.30);
  transform:scale(1.03)
}
/* Mobile: smaller and closer to the corner */
@media(max-width:900px){
  .theme-toggle,.audio-toggle{display:none}
}

/* About page typography */
.about-page .page-title{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;font-weight:800;font-size:1.6rem;margin:0 0 16px;line-height:1.2}
.about-page p{margin:0 0 12px;line-height:1.6}
.about-page .about-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){.about-page .about-grid{grid-template-columns:1fr 1fr;align-items:start}}
.about-page .about-photos{display:flex;flex-direction:column;gap:12px}
.about-page .about-photos img{display:block;width:100%;height:auto;object-fit:contain;border:0;border-radius:8px;background:transparent;padding:0}
@media(max-width:600px){.about-page .about-photos img{height:auto}}
/* About page: tighter gallery, no figure background/border and fewer columns for larger photos */
.about-page .gallery{gap:4px;margin-bottom:20px;grid-template-columns:1fr}
@media(min-width:700px){.about-page .gallery{grid-template-columns:repeat(2,1fr)}}
.about-page .gallery figure{border:0;border-radius:8px;background:transparent}
/* Place photos below the text and span full width on desktop */
@media(min-width:900px){.about-page .about-photos{grid-column:1 / -1}}
/* On very wide screens, use single column to maximize photo size */
@media(min-width:1100px){.about-page .gallery{grid-template-columns:1fr}}
.about-page .about-cover{cursor:pointer;margin-top:70px;background:transparent;border:0;border-radius:10px;padding:0;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;--cover-border-w:clamp(3px,.6vw,8px)}
.about-page .about-text{margin-top:100px}
.about-page .about-gallery-btn{display:none} /* desktop default: hidden */
.about-page .about-cover figure{position:relative}
/* Narrow, centered hover background just behind the image */
.about-page .about-cover figure::before{content:none !important}
.about-page .about-cover:hover{background:transparent;box-shadow:none}
.about-page .about-cover:hover figure::before{opacity:0}
.about-page .about-cover img{position:relative;z-index:1;display:block;width:100%;height:auto;max-height:720px;object-fit:contain;border-radius:10px;transition:transform .15s ease,box-shadow .15s ease}
.about-page .about-cover:hover img{box-shadow:0 0 0 var(--cover-border-w) var(--accent)}
/* Small badge to indicate the image opens the gallery */
.about-page .about-cover .gallery-badge{
  position:absolute;
  right:12px;
  bottom:12px;
  z-index:2;
  background:var(--accent);
  color:#fff;
  border:2px solid var(--accent);
  border-radius:999px;
  padding:6px 10px;
  font-weight:800;
  font-size:.9rem;
  letter-spacing:.2px;
  opacity:.9;
  transition:background .15s ease,color .15s ease,opacity .15s ease,transform .15s ease
}
.about-page .about-cover:hover .gallery-badge,
.about-page .about-cover:focus-within .gallery-badge{
  background:var(--accent);
  color:#fff;
  opacity:1;
  transform:translateY(-1px)
}
.about-page .about-cover:hover img{transform:scale(1.02)}
.about-page .about-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.about-page .about-thumbs img{display:block;width:100%;height:340px;object-fit:contain;border-radius:8px;background:transparent}
@media(max-width:600px){.about-page .about-thumbs img{height:220px}}
@media(min-width:900px){.about-page .about-thumbs{grid-column:1 / -1}}
/* Emphasize 2 and 3: lift #2 slightly and enlarge #3 on desktop */
@media(min-width:900px){.about-page .about-thumbs figure:nth-child(1) img{height:400px;margin-top:-16px}}
@media(min-width:900px){.about-page .about-thumbs figure:nth-child(2) img{height:460px;margin-top:-24px}}

/* Mobile About page: text under heading, photo hidden, right-aligned gallery button */
@media(max-width:900px){
  .about-page .page-title{margin:0 0 16px}
  .about-page .about-text{margin-top:0;display:flex;flex-direction:column}
  .about-page .about-grid{gap:6px;margin-top:0}
  /* Keep text spacing as is; only trim structural gaps */
  .about-page .about-cover{margin-top:0}
  .about-page .about-cover figure{display:none}
  /* Loosen paragraph line-height for better readability */
  .about-page .about-text p{line-height:1.5}
  .about-page .about-gallery-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin:12px 0 -80px; /* tighten space above footer further */
    padding:6px 10px;
    font-weight:800;
    color:#fff;
    background:var(--accent);
    border:2px solid var(--accent);
    border-radius:999px;
    text-decoration:none;
    align-self:flex-end
  }
}
/* Mobile: slightly shorter footer to reduce bottom space */
@media(max-width:900px){
  .site-footer{height:56px;max-height:56px}
}

/* Desktop: keep 28–30px space after content, and fix footer to screen bottom
   When page content is short, footer stays pinned to the bottom.
   When content is long, bottom padding provides ~28px gap above the footer. */
@media(min-width:900px){
  /* Default footer height: 60px */
  body{padding-bottom:calc(60px + 28px)}
  .site-footer{
    position:fixed;left:0;right:0;bottom:0;
    height:60px;max-height:60px;margin-top:0;z-index:10
  }
  /* Products page uses taller footer (70px) */
  body.products-page{padding-bottom:calc(70px + 28px)}
  body.products-page .site-footer{position:fixed;height:70px;max-height:70px}
  /* Contact page: footer sayfa içeriğinin sonunda olsun (fixed değil) */
  body.contact-page{padding-bottom:0}
  body.contact-page .site-footer{
    position:static;
    height:auto;
    max-height:none;
  }
  body.contact-page .contact-container{margin-bottom:0;padding-bottom:0}
  /* Home page: after Hizmetlerimiz, remove extra 28px gap on desktop */
  body.home-page{padding-bottom:60px}
  body.home-page .services{margin-bottom:0}
}
/* Body-level Ürünler flyout (no changes to existing header/nav styles) */
.menu-flyout{position:absolute;z-index:30;background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;display:flex;flex-direction:column;gap:8px}
.menu-flyout .item{position:relative;display:block;color:var(--border);text-decoration:none;border:0;border-radius:0;padding:12px 18px;background:transparent;text-align:center}

.menu-flyout .item::before{content:"";position:absolute;inset:0;background:var(--card-bg);-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'><polygon points='5,4 100,4 95,96 0,96' fill='white'/></svg>") no-repeat 0 0/100% 100%;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'><polygon points='5,4 100,4 95,96 0,96' fill='white'/></svg>") no-repeat 0 0/100% 100%;z-index:1;transition:background .2s ease}
.menu-flyout .item::after{content:"";position:absolute;inset:0;background:var(--border);-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'><polygon points='5,3 100,3 95,97 0,97' fill='none' stroke='white' stroke-width='3' vector-effect='non-scaling-stroke' stroke-linejoin='miter' stroke-linecap='butt'/></svg>") no-repeat 0 0/100% 100%;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'><polygon points='5,3 100,3 95,97 0,97' fill='none' stroke='white' stroke-width='3' vector-effect='non-scaling-stroke' stroke-linejoin='miter' stroke-linecap='butt'/></svg>") no-repeat 0 0/100% 100%;z-index:2;pointer-events:none}
.menu-flyout .item .label{color:var(--fg);position:relative;z-index:3}
.menu-flyout .item.active::before,.menu-flyout .item:hover::before,.menu-flyout .item:focus-visible::before{background:var(--accent)}
.menu-flyout .item.active .label,.menu-flyout .item:hover .label,.menu-flyout .item:focus-visible .label{color:#fff}


/* Prepress layout */
.prepress h1{text-align:left}
.prepress .page-title{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;font-weight:800;font-size:1.6rem;margin:10px 0 20px;text-align:left;margin-left:-10px}
@media(min-width:900px){.prepress .page-title{margin-bottom:50px}}
.prepress .prepress-grid{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:900px){.prepress .prepress-grid{grid-template-columns:1fr 1fr;column-gap:56px}}
.prepress .prepress-category{margin-bottom:16px}
/* After Dü z/Eğri maddelerinden sonraki fotoğa kadar boşluk ekle: ikinci kategori kapağına üst boşluk */
.prepress .prepress-category + .prepress-category .prepress-cover{margin-top:24px}
/* Desktop: align Yuvarlak cover top with Düz/Eğri cover top (no extra offset) */
@media(min-width:900px){.prepress .prepress-category + .prepress-category .prepress-cover{margin-top:0}}
/* Son kategori ile footer arasını kısalt */
.prepress .prepress-category:last-of-type{margin-bottom:4px}

/* Prepress page: bring footer closer (override global footer margin) */
body.prepress-page .site-footer{margin-top:0px}
.prepress .prepress-category.align-right{text-align:right}
.prepress .prepress-category.align-right h2,.prepress .prepress-category.align-right p{text-align:right}
.prepress .prepress-cover{margin:0 0 22px}
.prepress .prepress-cover .card{margin:0 0 36px}
.prepress .prepress-cover .card{position:relative;overflow:hidden;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease}
/* Match products card hover: turn background/border to accent, no overlay */
.prepress .prepress-cover .card::after{content:none !important}
.prepress .prepress-cover .card:hover{
  background:var(--accent);
  border-color:var(--accent);
  box-shadow:0 2px 10px rgba(115,139,59,.30)
}
.prepress .prepress-category h2{
  display:inline-block;
  font-style:normal;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  font-weight:800;
  transform:none;
  margin:0 0 12px
}
.prepress .prepress-category .list{margin:0 0 4px}
.prepress .prepress-category .list li{margin:6px 0}

/* Sticky page-bottom only on Products pages */
body.products-page{padding-bottom:0;display:flex;flex-direction:column;min-height:100vh}
body.products-page #swup, body.products-page main{flex:1 0 auto}
body.products-page .site-footer{position:static;height:70px;max-height:70px}
body.products-page .site-footer{margin-top:8px}
@supports not (zoom:1){ body.products-page{padding-bottom:0} }