/* ==========================================================================
   Eylül Sandalye — Premium Design Layer
   Adds refined typography, color system, and motion on top of the base
   Furni template without touching its core files.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,400;0,500;0,600;0,700;1,500&family=Inter:wght@300;400;500;600;700;800&display=swap');

:root{
  --es-ink:        #1B211D;
  --es-ink-soft:    #4A5049;
  --es-forest:      #2C4638;
  --es-forest-deep: #203327;
  --es-paper:       #FBF9F4;
  --es-paper-alt:   #F1EEE5;
  --es-card:        #FFFFFF;
  --es-line:        #E1DDCD;
  --es-gold:        #B98A3E;
  --es-gold-deep:   #96702E;
  --es-gold-soft:   #EFE0BE;
  --es-shadow:      0 30px 60px -25px rgba(27,33,29,.35);
  --es-shadow-sm:   0 12px 28px -16px rgba(27,33,29,.28);
  --es-ease:        cubic-bezier(.16,.84,.32,1);
  --es-ease-soft:   cubic-bezier(.22,.61,.36,1);
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

html{ scroll-behavior: smooth; }
#ahsap-sandalyeler, #metal-sandalyeler, #bencler{ scroll-margin-top: 6.5rem; }

html{ overflow-x: hidden; }
body{
  font-family: "Inter", sans-serif;
  color: var(--es-ink);
  background: var(--es-paper);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

.es-serif{ font-family: "Cormorant", serif; }

/* ---------- Reveal-on-scroll ---------- */
[data-reveal]{
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .9s var(--es-ease), transform .9s var(--es-ease);
  transition-delay: var(--es-delay, 0ms);
}
[data-reveal].is-visible{ opacity: 1; transform: translateY(0); }
[data-reveal="scale"]{ transform: translateY(16px) scale(.96); }
[data-reveal="scale"].is-visible{ transform: translateY(0) scale(1); }
[data-reveal="left"]{ transform: translateX(-32px); }
[data-reveal="left"].is-visible{ transform: translateX(0); }
[data-reveal="right"]{ transform: translateX(32px); }
[data-reveal="right"].is-visible{ transform: translateX(0); }

/* ---------- Navbar ---------- */
.es-nav{
  position: sticky !important; top: 0; z-index: 1000;
  background: rgba(27,44,35,.98) !important;
  border-bottom: 1px solid rgba(255,255,255,.06);
  transition: background .4s var(--es-ease), box-shadow .4s var(--es-ease), padding .3s var(--es-ease);
  padding-top: .55rem !important; padding-bottom: .55rem !important;
}
.es-nav.is-scrolled{
  background: rgba(23,37,30,.98) !important;
  box-shadow: var(--es-shadow-sm);
  padding-top: .3rem !important; padding-bottom: .3rem !important;
}
.es-nav .nav-link{
  position: relative;
  font-weight: 500;
  letter-spacing: .02em;
  transition: color .25s var(--es-ease-soft);
}
.es-nav .nav-link::after{
  content:""; position:absolute; left:0; right:0; bottom:-4px; height:1px;
  background: var(--es-gold);
  transform: scaleX(0); transform-origin: left;
  transition: transform .35s var(--es-ease-soft);
}
.es-nav .nav-link:hover::after,
.es-nav .nav-link.active::after{ transform: scaleX(1); }
.es-nav .btn-secondary{
  background: var(--es-gold); border-color: var(--es-gold);
  transition: transform .3s var(--es-ease-soft), box-shadow .3s var(--es-ease-soft), background .3s;
}
.es-nav .btn-secondary:hover{
  background: var(--es-gold-deep); border-color: var(--es-gold-deep);
  transform: translateY(-2px);
  box-shadow: 0 10px 24px -10px rgba(169,117,47,.65);
}

/* ---------- Buttons, generally ---------- */
.btn, .product-item, a{ cursor: pointer; }
.btn{
  transition: transform .3s var(--es-ease-soft), box-shadow .3s var(--es-ease-soft), background-color .3s, color .3s, border-color .3s;
}
.btn:hover{ transform: translateY(-2px); }
.btn.btn-outline-es{
  border: 1px solid var(--es-forest); color: var(--es-forest); background: transparent;
}
.btn.btn-outline-es:hover{ background: var(--es-forest); color: var(--es-paper); }
.btn.btn-whatsapp{
  display:inline-flex; align-items:center; gap:.5rem;
  background:#25D366; border-color:#25D366; color:#fff;
}
.btn.btn-whatsapp:hover{ background:#1DA851; border-color:#1DA851; color:#fff; }

.es-map-wrap{
  overflow:hidden; border-radius:18px; border:1px solid var(--es-line);
  box-shadow: var(--es-shadow-sm); line-height:0;
}
.es-map-wrap iframe{ display:block; filter: grayscale(.15) contrast(1.02); }

/* ---------- Hero ---------- */
.es-hero{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(60% 80% at 82% 15%, var(--es-gold-soft) 0%, rgba(239,223,194,0) 60%),
    linear-gradient(180deg, var(--es-paper) 0%, var(--es-paper-alt) 100%);
  padding: 6.5rem 0 5rem;
}
.es-hero::before{
  content:"";
  position:absolute; inset:auto -10% -30% auto; width: 46vw; height: 46vw; max-width:640px; max-height:640px;
  background: radial-gradient(circle, rgba(169,117,47,.16), rgba(169,117,47,0) 70%);
  border-radius: 50%;
  animation: esFloat 12s ease-in-out infinite;
  pointer-events:none;
}
@keyframes esFloat{
  0%,100%{ transform: translate(0,0) scale(1); }
  50%{ transform: translate(-16px,20px) scale(1.05); }
}
.es-eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.75rem; letter-spacing:.18em; text-transform:uppercase;
  color: var(--es-gold-deep); font-weight:600;
  padding: .4rem .9rem; border:1px solid var(--es-line); border-radius: 999px;
  background: rgba(255,255,255,.6);
}
.es-eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:var(--es-gold); animation: esPulse 2.2s ease-in-out infinite; }
@keyframes esPulse{ 0%,100%{ opacity:1; transform:scale(1);} 50%{ opacity:.35; transform:scale(1.4);} }

.es-hero h1{
  font-family:"Cormorant", serif;
  font-weight: 600;
  font-size: clamp(2.6rem, 5vw, 4.4rem);
  line-height: 1.05;
  color: var(--es-ink);
  margin: 1.1rem 0 1.2rem;
}
.es-hero h1 em{ font-style: italic; color: var(--es-gold-deep); }
.es-hero p.lead{ color: var(--es-ink-soft); font-size: 1.1rem; max-width: 480px; }

.es-hero-stats{ display:flex; gap:2.2rem; margin-top:2.4rem; }
.es-hero-stats div strong{ display:block; font-family:"Cormorant",serif; font-size:1.9rem; color:var(--es-ink); }
.es-hero-stats div span{ font-size:.78rem; color:var(--es-ink-soft); letter-spacing:.03em; }

.es-hero-img-wrap{ position:relative; }
.es-hero-img-wrap .es-ring{
  position:absolute; inset:6% 10%;
  border: 1px dashed rgba(169,117,47,.45);
  border-radius: 50%;
  animation: esSpin 40s linear infinite;
}
@keyframes esSpin{ to{ transform: rotate(360deg); } }
.es-hero-img-wrap img.es-hero-photo{
  position:relative; z-index:2;
  max-width:88%; display:block; margin:0 auto;
  filter: drop-shadow(0 40px 45px rgba(32,26,20,.28));
  animation: esBob 6s ease-in-out infinite;
  transition: transform .5s var(--es-ease-soft);
}
@keyframes esBob{ 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-14px); } }
.es-hero-badge{
  position:absolute; z-index:3; left:-4%; bottom:8%;
  background: var(--es-forest-deep); color:#fff; border-radius: 16px;
  padding: .9rem 1.1rem; box-shadow: var(--es-shadow-sm);
  display:flex; align-items:center; gap:.7rem;
  animation: esFadeUp .9s var(--es-ease) .6s both, esBob 6s ease-in-out infinite 1s;
}
.es-hero-badge strong{ font-family:"Cormorant",serif; font-size:1.5rem; line-height:1; color: var(--es-gold-soft); }
.es-hero-badge span{ font-size:.72rem; color:#D8CFC2; display:block; }
@keyframes esFadeUp{ from{ opacity:0; transform: translateY(16px);} to{ opacity:1; transform: translateY(0);} }

/* ---------- Section heading ---------- */
.es-kicker{
  font-size:.75rem; letter-spacing:.18em; text-transform:uppercase; color: var(--es-gold-deep); font-weight:700;
}
.es-section-title{
  font-family:"Cormorant", serif; font-weight:600; font-size: clamp(1.9rem,3vw,2.6rem); color: var(--es-ink);
}

/* ---------- Category / product cards ---------- */
.es-cat-card{
  position:relative; display:block; border-radius: 20px; overflow:hidden;
  background: var(--es-card); border:1px solid var(--es-line);
  box-shadow: var(--es-shadow-sm);
  transition: transform .5s var(--es-ease-soft), box-shadow .5s var(--es-ease-soft);
  text-decoration:none;
}
.es-cat-card:hover{ transform: translateY(-8px); box-shadow: var(--es-shadow); }
.es-cat-card .es-cat-media{ overflow:hidden; width:100%; aspect-ratio: 4/3; background: var(--es-paper-alt); display:flex; align-items:center; justify-content:center; padding: 1.1rem; }
.es-cat-card .es-cat-media img{ width:100%; height:100%; object-fit: contain; object-position: center; transition: transform .8s var(--es-ease-soft); }
.es-cat-card:hover .es-cat-media img{ transform: scale(1.06); }
.es-cat-card .es-cat-body{ padding: 1.4rem 1.5rem 1.6rem; text-align:center; }
.es-cat-card .es-cat-body small{ color: var(--es-gold-deep); letter-spacing:.14em; text-transform:uppercase; font-size:.68rem; font-weight:700; }
.es-cat-card .es-cat-body h3{
  font-family:"Cormorant",serif; font-size:1.6rem; margin:.25rem 0 0; color: var(--es-ink);
  min-height: 2.6rem; display:flex; align-items:center; justify-content:center;
}
.es-cat-card .es-cat-arrow{
  position:absolute; top:1.1rem; right:1.1rem; width:38px; height:38px; border-radius:50%;
  background: rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center;
  transform: translateY(-6px) scale(.85); opacity:0;
  transition: all .4s var(--es-ease-soft);
}
.es-cat-card:hover .es-cat-arrow{ transform: translateY(0) scale(1); opacity:1; }

/* ---------- Feature list icons ---------- */
.es-feature{
  transition: transform .4s var(--es-ease-soft);
}
.es-feature:hover{ transform: translateY(-4px); }
.es-feature .icon{
  width:56px; height:56px; border-radius:16px;
  background: var(--es-gold-soft);
  display:flex; align-items:center; justify-content:center;
  transition: transform .45s var(--es-ease-soft), background .45s;
}
.es-feature:hover .icon{ transform: rotate(-8deg) scale(1.06); background: var(--es-gold); }
.es-feature .icon img{ filter: brightness(0) saturate(100%); opacity:.75; width:24px; }

/* ---------- Popular product small cards ---------- */
.es-product-sm{
  border-radius: 18px; overflow:hidden; background: var(--es-card);
  border:1px solid var(--es-line); box-shadow: var(--es-shadow-sm);
  transition: transform .45s var(--es-ease-soft), box-shadow .45s var(--es-ease-soft);
}
.es-product-sm:hover{ transform: translateY(-6px); box-shadow: var(--es-shadow); }
.es-product-sm .thumbnail{ overflow:hidden; width:100%; aspect-ratio: 1/1; background: var(--es-paper-alt); display:flex; align-items:center; justify-content:center; padding: .8rem; }
.es-product-sm .thumbnail img{ width:100%; height:100%; object-fit:contain; object-position:center; transition: transform .7s var(--es-ease-soft); }
.es-product-sm:hover .thumbnail img{ transform: scale(1.05); }
.es-product-sm .es-body{ padding: 1.1rem 1.25rem 1.3rem; }
.es-product-sm h3{ font-family:"Cormorant",serif; font-size:1.4rem; margin-bottom:.35rem; }
.es-product-sm a.es-link{ color: var(--es-gold-deep); font-weight:600; font-size:.85rem; text-decoration:none; display:inline-flex; align-items:center; gap:.35rem; }
.es-product-sm a.es-link svg{ transition: transform .3s var(--es-ease-soft); }
.es-product-sm a.es-link:hover svg{ transform: translateX(4px); }

/* ---------- Stats / counters ---------- */
.es-stats-band{
  background: linear-gradient(155deg, var(--es-forest) 0%, var(--es-forest-deep) 100%); color: var(--es-paper);
  border-radius: 28px; padding: 3.2rem 2rem; position:relative; overflow:hidden;
}
.es-stats-band::after{
  content:""; position:absolute; inset:0;
  background: radial-gradient(50% 60% at 20% 10%, rgba(185,138,62,.28), transparent 70%);
  pointer-events:none;
}
.es-stat strong{ font-family:"Cormorant",serif; font-size: clamp(2.2rem,4vw,3rem); color: var(--es-gold-soft); display:block; }
.es-stat span{ font-size:.8rem; letter-spacing:.05em; color:#CDC3B4; }

/* ---------- Shop grid: reskin existing .product-item cards site-wide ---------- */
.product-section .product-item:before{
  background: var(--es-paper-alt);
  border-radius: 16px;
}
.product-section .product-item .icon-cross{
  background: var(--es-forest-deep);
}
.product-section .product-item h3.product-title{
  font-family:"Cormorant", serif; font-size: 1.2rem; font-weight:600; margin-top:.25rem;
}
.product-section .product-item strong.product-price{
  color: var(--es-gold-deep) !important;
}
/* Auto scroll-reveal for any product grid column that wasn't hand-annotated with data-reveal */
.product-section .row > div:not([data-reveal]){
  opacity: 0;
  transform: translateY(24px) scale(.97);
  transition: opacity .7s var(--es-ease), transform .7s var(--es-ease);
}
.product-section .row > div:not([data-reveal]).is-visible{
  opacity: 1; transform: none;
}

/* Full-width category dividers inside the shop grid (bare col-12 only,
   not the homepage's col-12 col-md-4 collection cards) */
.product-section .row > div.col-12:not(.col-md-4){
  padding-top: 1.5rem;
  border-top: 1px solid var(--es-line);
  margin-bottom: .5rem;
}
.product-section .row > div.col-12:not(.col-md-4):first-child{
  padding-top: 0; border-top: none;
}

/* ---------- Contact form ---------- */
.es-form .form-control{
  border: 1px solid var(--es-line);
  border-radius: 10px;
  padding: .65rem .9rem;
  background: var(--es-card);
  transition: border-color .25s var(--es-ease-soft), box-shadow .25s var(--es-ease-soft);
}
.es-form .form-control:focus{
  border-color: var(--es-gold);
  box-shadow: 0 0 0 .2rem rgba(185,138,62,.18);
}
.es-form label{ font-weight:600; font-size:.85rem; letter-spacing:.02em; }
.es-form button[type="submit"]{
  border-radius: 10px; padding: .7rem 1.8rem;
  background: var(--es-forest); border-color: var(--es-forest); color:#fff;
  transition: transform .3s var(--es-ease-soft), box-shadow .3s var(--es-ease-soft), background .3s;
}
.es-form button[type="submit"]:hover{
  background: var(--es-forest-deep); border-color: var(--es-forest-deep);
  transform: translateY(-2px); box-shadow: var(--es-shadow-sm);
}
/* ---------- Contact info cards (address / email / phone) ---------- */
.es-info-card{
  height:100%; text-align:center;
  padding: 2.1rem 1.4rem 1.9rem;
  background: var(--es-card); border:1px solid var(--es-line); border-radius: 18px;
  box-shadow: var(--es-shadow-sm);
  transition: transform .35s var(--es-ease-soft), box-shadow .35s var(--es-ease-soft);
}
.es-info-card:hover{ transform: translateY(-6px); box-shadow: var(--es-shadow); }
.es-info-icon{
  width:56px; height:56px; margin:0 auto 1.1rem; border-radius:50%;
  background: var(--es-gold-soft); color: var(--es-gold-deep);
  display:flex; align-items:center; justify-content:center;
  transition: transform .4s var(--es-ease-soft), background .4s;
}
.es-info-card:hover .es-info-icon{ transform: rotate(-8deg) scale(1.06); background: var(--es-gold); color:#fff; }
.es-info-card h3{
  font-family:"Cormorant", serif; font-weight:600; font-size:1.3rem;
  color: var(--es-ink); margin-bottom:.5rem;
}
.es-info-card p{ color: var(--es-ink-soft); font-size:.92rem; line-height:1.5; }
.es-info-card p a{ color: var(--es-ink-soft); text-decoration:none; transition: color .25s var(--es-ease-soft); }
.es-info-card p a:hover{ color: var(--es-gold-deep); }

/* ---------- Footer polish ---------- */
.footer-section{ position:relative; }
.footer-section a{ transition: color .25s var(--es-ease-soft), padding-left .25s var(--es-ease-soft); }
.footer-section .links-wrap a:hover{ color: var(--es-gold); padding-left:4px; }

/* ---------- Misc ---------- */
::selection{ background: var(--es-gold-soft); color: var(--es-ink); }

@media (max-width: 767px){
  .es-hero{ padding: 3.5rem 0 3rem; text-align:center; }
  .es-hero-stats{ justify-content:center; }
  .es-hero-badge{ left:2%; }
}

/* ---------- Product photo lightbox ---------- */
body.es-lightbox-open{ overflow:hidden; }
.es-lightbox{
  position:fixed; inset:0; z-index:4000;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background: rgba(15,12,9,.94);
  opacity:0; visibility:hidden;
  transition: opacity .35s var(--es-ease), visibility 0s linear .35s;
  padding: 2rem;
}
.es-lightbox.is-open{
  opacity:1; visibility:visible;
  transition: opacity .35s var(--es-ease);
}
.es-lightbox-stage{
  position:relative; width:100%; max-width:980px; flex:1 1 auto;
  display:flex; align-items:center; justify-content:center; min-height:0;
}
.es-lightbox-img{
  max-width:100%; max-height:70vh; object-fit:contain;
  border-radius:12px; background: var(--es-paper-alt);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.6);
  transform: scale(.97); transition: transform .35s var(--es-ease);
}
.es-lightbox.is-open .es-lightbox-img{ transform: scale(1); }
.es-lightbox-close, .es-lightbox-nav{
  position:absolute; z-index:2; display:flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:50%; border:1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08); color:#fff; cursor:pointer;
  transition: background .25s var(--es-ease-soft), border-color .25s var(--es-ease-soft), transform .25s var(--es-ease-soft);
}
.es-lightbox-close:hover, .es-lightbox-nav:hover{
  background: var(--es-gold); border-color: var(--es-gold); transform: scale(1.06);
}
.es-lightbox-close{ top:1.25rem; right:1.25rem; }
.es-lightbox-nav{ top:50%; margin-top:-23px; }
.es-lightbox-prev{ left:1.25rem; }
.es-lightbox-next{ right:1.25rem; }
.es-lightbox-caption{ text-align:center; color:#fff; margin-top:1.1rem; }
.es-lightbox-title{ font-family:"Cormorant",serif; font-size:1.6rem; margin:0; color:#fff; }
.es-lightbox-counter{ display:block; font-size:.78rem; color:#C9C2B6; letter-spacing:.06em; margin-top:.25rem; }
.es-lightbox-thumbs{
  display:flex; gap:.6rem; margin-top:1.1rem; max-width:100%; overflow-x:auto; padding-bottom:.3rem;
}
.es-lightbox-thumbs img{
  width:58px; height:58px; object-fit:cover; border-radius:8px; cursor:pointer;
  border:2px solid transparent; opacity:.55; flex:0 0 auto;
  transition: opacity .25s var(--es-ease-soft), border-color .25s var(--es-ease-soft);
}
.es-lightbox-thumbs img:hover{ opacity:.85; }
.es-lightbox-thumbs img.is-active{ opacity:1; border-color: var(--es-gold); }
.es-zoomable{ cursor: zoom-in; }

@media (max-width: 600px){
  .es-lightbox{ padding:1rem; }
  .es-lightbox-close, .es-lightbox-nav{ width:40px; height:40px; }
  .es-lightbox-close{ top:.75rem; right:.75rem; }
  .es-lightbox-prev{ left:.5rem; }
  .es-lightbox-next{ right:.5rem; }
  .es-lightbox-title{ font-size:1.3rem; }
}