/* ===================================================================
   Lina Butik — v2 rafine tasarım katmanı (store.css'ten sonra yüklenir)
   =================================================================== */
::selection { background: #ead8c8; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.eyebrow { font-weight: 500; }

/* ---------- Header: ortada logo, altta menü ---------- */
.header-row { display: grid; grid-template-columns: 1fr auto 1fr; }
.header-left { display: flex; align-items: center; }
.header .logo { margin: 0; justify-self: center; }
.header-icons { justify-self: end; }
.header-search { position: relative; display: none; align-items: center; }
.header-search svg { position: absolute; left: 14px; width: 18px; height: 18px; color: var(--muted); pointer-events: none; }
.header-search input { width: 260px; height: 40px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); padding: 0 16px 0 42px; outline: none; font-size: 13.5px; transition: border-color .2s, width .3s; }
.header-search input:focus { border-color: var(--ink); width: 300px; }
.cart-btn { width: auto; min-width: 42px; padding: 0 10px; border-radius: 999px; gap: 8px; display: inline-flex; align-items: center; }
.cart-label { font-size: 14px; font-weight: 500; }
.nav-row { border-top: 1px solid var(--line); }
.nav-row .main-nav { display: flex; justify-content: center; gap: 34px; height: 48px; align-items: center; margin: 0 auto; }
.nav-row .main-nav a { font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--ink-2); }
.nav-row .main-nav a:hover, .nav-row .main-nav a.active { color: var(--ink); }
.nav-row .main-nav a.sale { color: var(--sale); }

/* ---------- Hero sayaç + yazı animasyonu ---------- */
.hero-count { position: absolute; z-index: 3; right: 16px; bottom: 18px; color: rgba(255,255,255,.75); font-size: 12px; letter-spacing: .2em; }
.hero-count b { color: #fff; font-weight: 500; }
.hero-slide .hero-text > * { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .8s ease; }
.hero-slide.active .hero-text > * { opacity: 1; transform: none; }
.hero-slide.active .hero-text > :nth-child(2) { transition-delay: .12s; }
.hero-slide.active .hero-text > :nth-child(3) { transition-delay: .24s; }
.hero-slide.active .hero-text > :nth-child(4) { transition-delay: .36s; }

/* ---------- Kayan şerit ---------- */
.marquee { background: var(--sand); border-bottom: 1px solid var(--line); overflow: hidden; white-space: nowrap; }
.marquee-track { display: inline-flex; align-items: center; gap: 22px; padding: 13px 0; animation: marquee 38s linear infinite; }
.marquee span { font-family: var(--serif); font-style: italic; font-size: 18px; color: var(--ink-2); }
.marquee i { font-style: normal; color: var(--accent-2); font-size: 11px; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- Ürün kartı ---------- */
.card-img.has-hover .img-hover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .5s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
@media (hover: hover) { .card:hover .card-img.has-hover .img-hover { opacity: 1; } }
.card-meta { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.card-rating { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; color: var(--ink-2); font-weight: 500; }
.card-rating svg { width: 13px; height: 13px; color: var(--gold); }
.card-title { font-weight: 400; }
.qa-single { width: 100%; height: 38px !important; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-weight: 500; }
.qa-single svg { width: 16px; height: 16px; }

/* ---------- Yıldızlar (tek eleman, yüzdeye göre dolar) ---------- */
.stars { --r: 100%; display: inline-block; width: 88px; height: 16px; flex: none; background: linear-gradient(90deg, var(--gold) var(--r), #ddd3c4 var(--r)); -webkit-mask: var(--star-mask) no-repeat 0 0 / 100% 100%; mask: var(--star-mask) no-repeat 0 0 / 100% 100%; }
:root { --star-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 20'%3E%3Cpath d='M10 1.5l2.4 5.1 5.5.7-4 3.8 1 5.5L10 13.9l-4.9 2.7 1-5.5-4-3.8 5.5-.7zM32 1.5l2.4 5.1 5.5.7-4 3.8 1 5.5L32 13.9l-4.9 2.7 1-5.5-4-3.8 5.5-.7zM54 1.5l2.4 5.1 5.5.7-4 3.8 1 5.5L54 13.9l-4.9 2.7 1-5.5-4-3.8 5.5-.7zM76 1.5l2.4 5.1 5.5.7-4 3.8 1 5.5L76 13.9l-4.9 2.7 1-5.5-4-3.8 5.5-.7zM98 1.5l2.4 5.1 5.5.7-4 3.8 1 5.5L98 13.9l-4.9 2.7 1-5.5-4-3.8 5.5-.7z'/%3E%3C/svg%3E"); }
.stars-line { display: inline-flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--ink-2); margin-bottom: 14px; }
.stars-line:hover span:last-child { text-decoration: underline; }

/* ---------- Sezonun parçası ---------- */
.spotlight { display: grid; gap: 22px; margin-top: 48px; }
.spot-img { position: relative; display: block; border-radius: 20px; overflow: hidden; aspect-ratio: 4/5; background: var(--sand); }
.spot-img img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; transition: transform 1.2s cubic-bezier(.2,.8,.2,1); }
.spot-img:hover img { transform: scale(1.04); }
.spot-badge { position: absolute; top: 16px; left: 16px; display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,.92); border-radius: 999px; padding: 6px 14px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.spot-badge svg { width: 15px; height: 15px; color: var(--accent); }
.spot-text h2 { font-size: clamp(34px, 7vw, 56px); margin: 6px 0 12px; }
.spot-text > p { color: var(--ink-2); font-size: 15.5px; max-width: 52ch; }
.spot-facts { list-style: none; padding: 0; margin: 20px 0; border-top: 1px solid var(--line); }
.spot-facts li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.spot-facts b { font-weight: 500; }
.spot-facts span { color: var(--ink-2); text-align: right; }
.spot-buy { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.spot-buy > b { font-size: 28px; font-weight: 500; }
.spot-buy .btn svg { width: 18px; height: 18px; }
.spot-thumbs { display: none; gap: 12px; margin-top: 26px; }
.spot-thumbs img { width: 110px; aspect-ratio: 2/3; object-fit: cover; border-radius: 12px; }

/* ---------- Yorum kartları (ana sayfa) ---------- */
.center-head { justify-content: center; text-align: center; }
.review-cards { display: grid; gap: 14px; }
.review-card { margin: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.review-card blockquote { margin: 0; font-family: var(--serif); font-size: 21px; line-height: 1.35; color: var(--ink); }
.review-card figcaption { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.review-card figcaption img { width: 44px; height: 58px; object-fit: cover; border-radius: 8px; }
.review-card figcaption div { display: flex; flex-direction: column; line-height: 1.35; font-size: 13.5px; }
.review-card small { color: var(--muted); }
.review-card em { font-style: normal; color: var(--ok); }

/* ---------- Lookbook şeridi ---------- */
.lookbook { padding: 56px 0 8px; }
.lookbook-head { display: grid; gap: 8px; margin-bottom: 20px; }
.lookbook-head p { color: var(--ink-2); margin: 0; max-width: 46ch; }
.lookbook-strip { display: grid; grid-auto-flow: column; grid-auto-columns: 44%; overflow-x: auto; scrollbar-width: none; gap: 4px; }
.lookbook-strip::-webkit-scrollbar { display: none; }
.lookbook-strip a { position: relative; aspect-ratio: 4/5; overflow: hidden; }
.lookbook-strip img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .8s; }
.lookbook-strip span { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(29,27,25,.35); color: #fff; opacity: 0; transition: opacity .3s; }
.lookbook-strip span svg { width: 30px; height: 30px; }
.lookbook-strip a:hover span { opacity: 1; }
.lookbook-strip a:hover img { transform: scale(1.06); }

/* ---------- Ürün detay galerisi ---------- */
.pdp-gallery { position: relative; }
.pdp-thumbs { display: none; }
.pdp-stage { position: relative; }
.pdp-slides { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; aspect-ratio: 832/1216; background: var(--sand); }
.pdp-slides::-webkit-scrollbar { display: none; }
.pdp-slide { flex: 0 0 100%; scroll-snap-align: start; position: relative; overflow: hidden; }
.pdp-slide img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease-out; }
.pdp-slide.zooming img { transform: scale(1.8); }
.pdp-stage .card-badges { top: 14px; left: 14px; }
.pdp-dots { position: absolute; left: 0; right: 0; bottom: 14px; display: flex; justify-content: center; gap: 6px; }
.pdp-dots i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.55); transition: all .3s; }
.pdp-dots i.on { background: #fff; width: 22px; border-radius: 4px; }
.fit-hint { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; color: var(--ink-2); background: var(--sand); border-radius: 10px; padding: 10px 12px; margin: 10px 0 0; }
.fit-hint svg { width: 17px; height: 17px; color: var(--accent); margin-top: 2px; }
.one-size { display: flex; align-items: center; gap: 8px; font-size: 14px; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--sand); }
.one-size svg { width: 17px; height: 17px; color: var(--ok); }
.fav-inline { width: 54px; padding: 0; flex: none; }
.fav-inline.on svg { fill: var(--sale); stroke: var(--sale); }
.size-opt span { min-width: 58px; }

/* ---------- Değerlendirmeler ---------- */
.reviews-layout { display: grid; gap: 22px; }
.review-summary { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 20px; display: grid; gap: 16px; align-self: start; }
.big-rating { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: center; }
.big-rating b { grid-row: span 2; font-family: var(--serif); font-size: 58px; line-height: 1; font-weight: 600; }
.big-rating small { color: var(--muted); font-size: 13px; }
.rating-bars { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.rating-bars li { display: grid; grid-template-columns: 34px 1fr 26px; align-items: center; gap: 10px; font-size: 13px; }
.rating-bars span { display: inline-flex; align-items: center; gap: 3px; }
.rating-bars svg { width: 12px; height: 12px; color: var(--gold); }
.rating-bars i { height: 6px; background: var(--sand-2); border-radius: 3px; overflow: hidden; }
.rating-bars em { display: block; height: 100%; background: var(--gold); border-radius: 3px; }
.rating-bars small { color: var(--muted); text-align: right; }
.fit-scale { position: relative; height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--sand-2), #cdbfab, var(--sand-2)); margin: 12px 0 6px; }
.fit-scale i { position: absolute; top: 50%; width: 16px; height: 16px; border-radius: 50%; background: var(--ink); border: 3px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.3); transform: translate(-50%, -50%); }
.fit-legend { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); }
.review-list { display: grid; gap: 12px; align-content: start; }
.review { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 18px; }
.review-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.review-head div { flex: 1; display: flex; flex-direction: column; line-height: 1.3; font-size: 14px; min-width: 0; }
.review-head small { color: var(--muted); font-size: 12.5px; }
.review-head em { font-style: normal; color: var(--ok); }
.avatar-letter { width: 38px; height: 38px; border-radius: 50%; background: var(--sand); color: var(--accent); display: grid; place-items: center; font-family: var(--serif); font-size: 19px; font-weight: 600; flex: none; }
.review p { margin: 0; color: var(--ink-2); font-size: 14.5px; }
.review-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.review-tags span { font-size: 12px; background: var(--sand); padding: 4px 10px; border-radius: 999px; color: var(--ink-2); }
.review-form { display: grid; gap: 12px; }
.star-input { display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; gap: 4px; }
.star-input input { position: absolute; opacity: 0; }
.star-input label { cursor: pointer; color: #d9cfbf; transition: color .15s, transform .15s; }
.star-input label svg { width: 34px; height: 34px; }
.star-input label:hover, .star-input label:hover ~ label, .star-input input:checked ~ label { color: var(--gold); }
.star-input label:hover { transform: scale(1.1); }
.seg { display: flex; border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; height: 48px; }
.seg label { flex: 1; display: grid; cursor: pointer; }
.seg input { position: absolute; opacity: 0; }
.seg span { display: grid; place-items: center; font-size: 14px; border-right: 1px solid var(--line); }
.seg label:last-child span { border-right: 0; }
.seg input:checked + span { background: var(--ink); color: #fff; }

/* ---------- Ufak rötuşlar ---------- */
.newsletter input[type=checkbox], .check input { accent-color: var(--accent); }
.footer .check input { width: 16px; height: 16px; }

@media (min-width: 640px) {
  .review-cards { grid-template-columns: repeat(3, 1fr); }
  .lookbook-strip { grid-auto-columns: calc(100% / 3); }
  .hero-count { right: 32px; }
}
@media (min-width: 1024px) {
  .header-search { display: flex !important; }
  :root { --header-h: 72px; }
  .spotlight { grid-template-columns: 1.05fr 1fr; gap: 64px; align-items: center; margin-top: 90px; }
  .spot-img { aspect-ratio: 5/6; }
  .spot-thumbs { display: flex; }
  .lookbook { padding-top: 90px; }
  .lookbook-head { grid-template-columns: 1fr auto; align-items: end; }
  .lookbook-strip { grid-auto-flow: row; grid-template-columns: repeat(6, 1fr); overflow: visible; }
  .pdp { grid-template-columns: 1.15fr 1fr; }
  .pdp-gallery { display: grid; grid-template-columns: 84px 1fr; gap: 14px; margin: 0; position: sticky; top: calc(var(--header-h) + 64px); }
  .pdp-thumbs { display: flex; flex-direction: column; gap: 10px; }
  .pdp-thumbs button { border-radius: 10px; overflow: hidden; border: 2px solid transparent; opacity: .6; transition: all .2s; aspect-ratio: 832/1216; }
  .pdp-thumbs button.active, .pdp-thumbs button:hover { border-color: var(--ink); opacity: 1; }
  .pdp-thumbs img { width: 100%; height: 100%; object-fit: cover; }
  .pdp-slides { border-radius: 20px; overflow: hidden; cursor: zoom-in; }
  .pdp-dots { display: none; }
  .reviews-layout { grid-template-columns: 320px 1fr; gap: 36px; }
  .review-summary { position: sticky; top: calc(var(--header-h) + 70px); }
  .review-list { grid-template-columns: 1fr 1fr; }
  .filters, .summary, .legal-nav { top: calc(var(--header-h) + 70px); }
}