/* =========================================================
   AŞÇI SAMİ GÜMÜŞ — Muğla Düğün Yemekleri
   Tasarım dili: kurumsal mavi + kırmızı, temiz beyaz zemin.
   ========================================================= */

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

:root{
  --ink:        #2A3441;
  --gray:       #6B7684;
  --white:      #FFFFFF;
  --offwhite:   #F5F7FA;
  --blue:       #1E56A8;
  --blue-dk:    #123A73;
  --blue-pale:  #EAF1FB;
  --red:        #E0342B;
  --red-dk:     #B92A22;
  --line:       rgba(30,50,80,.12);
  --shadow:     0 12px 30px rgba(18,58,115,.12);
  --radius:     8px;
  --max:        1180px;
  --font-display: "Poppins", "Segoe UI", sans-serif;
  --font-body:  "Inter", "Segoe UI", sans-serif;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  background: var(--white);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3{ font-family: var(--font-display); font-weight:700; margin:0 0 .4em; color: var(--blue-dk); }
.wrap{ max-width: var(--max); margin:0 auto; padding: 0 24px; }

/* ---------- eyebrow / labels ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:.6em;
  font-family: var(--font-display); font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; font-size:.78rem; color: var(--red);
  margin-bottom: .9em;
}
.eyebrow::before{ content:""; width:26px; height:3px; background: var(--red); border-radius:2px; }

/* ---------- top bar ---------- */
.topbar{
  background: var(--offwhite); color: var(--gray); border-bottom:1px solid var(--line);
  font-size:.85rem;
}
.topbar .wrap{ display:flex; justify-content:space-between; align-items:center; padding:9px 24px; gap:12px; flex-wrap:wrap; }
.topbar a{ color: var(--red); font-weight:700; letter-spacing:.04em; }
.topbar a:hover{ text-decoration:underline; }

/* ---------- header / nav ---------- */
header.site{
  background: var(--white); border-bottom:1px solid var(--line);
  position: sticky; top:0; z-index: 50;
}
.navrow{ display:flex; align-items:center; justify-content:space-between; padding:16px 24px; gap:20px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand-mark{
  width:46px; height:46px; border-radius:50%;
  background: var(--blue);
  display:flex; align-items:center; justify-content:center;
  color: #fff; font-family: var(--font-display); font-weight:800; font-size:1.05rem;
  flex-shrink:0;
}
.brand-text{ line-height:1.05; }
.brand-text .t1{ font-family: var(--font-display); font-size:1.12rem; font-weight:800; color: var(--blue); letter-spacing:.01em; }
.brand-text .t2{ font-size:.86rem; font-weight:800; color: var(--red); letter-spacing:.02em; }

nav.mainnav ul{ display:flex; gap:34px; }
nav.mainnav a{
  font-weight:700; font-size:.86rem; letter-spacing:.04em; text-transform:uppercase;
  color: var(--red); position:relative; padding:6px 0;
}
nav.mainnav a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background: var(--blue); transform: scaleX(0); transform-origin:left; transition: transform .25s ease;
}
nav.mainnav a:hover::after, nav.mainnav a.active::after{ transform: scaleX(1); }

.nav-cta{ display:flex; align-items:center; gap:16px; }
.tel-btn{
  display:inline-flex; align-items:center; gap:.5em;
  background: var(--blue); color:#fff; padding:10px 18px; border-radius: var(--radius);
  font-weight:700; font-size:.92rem;
  transition: background .2s ease, transform .2s ease;
}
.tel-btn:hover{ background: var(--blue-dk); transform: translateY(-1px); }

.burger{
  display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:6px;
}
.burger span{ width:24px; height:2px; background: var(--blue); display:block; }

/* ---------- hero (full-width banner + text below) ---------- */
.hero{ padding:0; border-bottom:none; }
.hero-banner{ width:100%; aspect-ratio: 16/7; overflow:hidden; background: var(--offwhite); position:relative; }
.hero-banner img{ width:100%; height:100%; object-fit:cover; }
.hero-banner .slide{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition: opacity 1s ease;
}
.hero-banner .slide.active{ opacity:1; }
.slider-dots{
  position:absolute; left:0; right:0; bottom:16px; display:flex; justify-content:center; gap:8px; z-index:2;
}
.slider-dots .dot{
  width:9px; height:9px; border-radius:50%; border:2px solid #fff; background: rgba(255,255,255,.35);
  padding:0; cursor:pointer; transition: background .2s ease, transform .2s ease;
}
.slider-dots .dot.active{ background:#fff; transform: scale(1.15); }
.hero-copy{
  max-width: 760px; margin: 0 auto; text-align:center; padding: 48px 24px 10px;
}
.hero h1{
  font-size: clamp(1.7rem, 3.4vw, 2.5rem); line-height:1.2; margin-bottom:.35em;
  color: var(--blue-dk);
}
.hero h1 .accent{ color: var(--red); }
.hero p.lead{ font-size:1.05rem; color: var(--gray); margin: 0 auto 1.6em; max-width:56ch; }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; }

/* simple page-header variant (no photo banner) used on inner pages */
.page-head{ padding: 48px 0 8px; text-align:center; }
.page-head .eyebrow{ justify-content:center; }
.page-head h1{ max-width:24ch; margin:0 auto .3em; }
.page-head p{ color: var(--gray); max-width:56ch; margin:0 auto; }

.btn{
  display:inline-flex; align-items:center; gap:.5em;
  padding:13px 26px; border-radius: var(--radius); font-weight:700; font-size:.92rem;
  letter-spacing:.02em; transition: all .2s ease; border:2px solid transparent; cursor:pointer;
}
.btn-primary{ background: var(--red); color:#fff; }
.btn-primary:hover{ background: var(--red-dk); transform: translateY(-1px); }
.btn-ghost{ border-color: var(--blue); color: var(--blue); background:transparent; }
.btn-ghost:hover{ background: var(--blue); color:#fff; }

/* ---------- section shells ---------- */
section{ padding: 60px 0; }
section.alt{ background: var(--blue); color:#fff; }
section.alt h2, section.alt h3{ color:#fff; }
section.alt .eyebrow{ color:#BBD3F2; }
section.alt .eyebrow::before{ background:#BBD3F2; }
.section-head{ max-width: 62ch; margin-bottom: 38px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head p{ color: var(--gray); font-size:1.02rem; }
section.alt .section-head p{ color: rgba(255,255,255,.82); }

/* ---------- service cards (on blue band) ---------- */
.services-band{ background: var(--blue); padding: 56px 0; }
.services-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:26px; }
.service-card{
  background:#fff; border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow);
  transition: transform .25s ease;
}
.service-card:hover{ transform: translateY(-4px); }
.service-card .thumb{ aspect-ratio: 4/3; overflow:hidden; }
.service-card .thumb img{ width:100%; height:100%; object-fit:cover; transition: transform .4s ease; }
.service-card:hover .thumb img{ transform: scale(1.05); }
.service-card .body{ padding:18px 20px 22px; }
.service-card h3{ font-size:1.12rem; margin-bottom:.35em; color: var(--red); }
.service-card a.detay{ font-weight:700; color: var(--blue); font-size:.86rem; text-transform:uppercase; letter-spacing:.04em; }
.service-card a.detay::after{ content:" →"; }

/* ---------- intro / text block ---------- */
.intro-block{ display:grid; grid-template-columns: .95fr 1.05fr; gap:48px; align-items:center; }
.intro-block .plate{ border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow); aspect-ratio: 4/3.2; }
.intro-block .plate img{ width:100%; height:100%; object-fit:cover; }
.intro-block .text p{ color: var(--gray); margin-bottom:1.1em; }

/* reversed variant used inside blue band: text left, small image right */
.intro-reverse{ display:grid; grid-template-columns: 1.15fr .85fr; gap:40px; align-items:center; }
.intro-reverse .plate{ border-radius: var(--radius); overflow:hidden; box-shadow: 0 12px 30px rgba(0,0,0,.25); aspect-ratio: 4/3.1; }
.intro-reverse .plate img{ width:100%; height:100%; object-fit:cover; }

/* ---------- category strip ---------- */
.cat-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:22px; }
.cat-card{
  background:#fff; border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow);
}
.cat-card .imgwrap{ aspect-ratio: 4/3; overflow:hidden; }
.cat-card img{ width:100%; height:100%; object-fit:cover; transition: transform .45s ease; }
.cat-card:hover img{ transform: scale(1.06); }
.cat-card .tag{ padding:16px 18px; }
.cat-card .tag .kicker{ font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color: var(--gray); font-weight:700; }
.cat-card .tag h3{ color: var(--red); font-size:1.05rem; margin:.2em 0 0; }

/* ---------- menu list (dishes) ---------- */
.dish-panel{ display:grid; grid-template-columns: .8fr 1.2fr; gap:44px; align-items:center; }
.dish-panel .plate{ border-radius: var(--radius); overflow:hidden; box-shadow: 0 12px 30px rgba(0,0,0,.25); aspect-ratio:4/3.2; }
.dish-panel .plate img{ width:100%; height:100%; object-fit:cover; }
.dish-list{ display:grid; grid-template-columns: 1fr 1fr; gap:0 32px; }
.dish-item{
  display:flex; justify-content:space-between; align-items:baseline; gap:10px;
  padding: 13px 0; border-bottom:1px dashed var(--line);
}
.dish-item .name{ font-family: var(--font-display); font-weight:700; font-size:1rem; color: var(--blue); }
.dish-item .cont{ font-size:.76rem; color: var(--gray); text-transform:uppercase; letter-spacing:.05em; white-space:nowrap; }

/* ---------- cake / pricing cards ---------- */
.pasta-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:26px; }
.pasta-card{
  background:#fff; border:1px solid var(--line); border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow);
  display:flex; flex-direction:column;
}
.pasta-card .thumb{ aspect-ratio: 4/3; overflow:hidden; }
.pasta-card .thumb img{ width:100%; height:100%; object-fit:cover; }
.pasta-card .body{ padding:20px 22px 24px; display:flex; flex-direction:column; gap:6px; flex:1; }
.pasta-card h3{ color: var(--ink); font-size:1.05rem; }
.pasta-card .price{ color: var(--red); font-family: var(--font-display); font-weight:800; font-size:1.25rem; }
.pasta-card .desc{ color: var(--gray); font-size:.92rem; margin-bottom:10px; }
.pasta-card .detay{ margin-top:auto; align-self:flex-start; font-weight:700; color: var(--blue); font-size:.85rem; text-transform:uppercase; letter-spacing:.04em; }
.pasta-card .detay::after{ content:" →"; }

/* ---------- gallery ---------- */
.gallery-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap:14px; }
.gallery-grid a{ display:block; border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow); aspect-ratio:1/1; }
.gallery-grid img{ width:100%; height:100%; object-fit:cover; transition: transform .4s ease; }
.gallery-grid a:hover img{ transform: scale(1.08); }

/* ---------- about page ---------- */
.about-hero{ display:grid; grid-template-columns: 1fr 1fr; gap:16px; margin-bottom:36px; }
.about-hero img{ border-radius: var(--radius); box-shadow: var(--shadow); aspect-ratio: 4/3; object-fit:cover; width:100%; height:100%; }
.about-text{ max-width: 74ch; margin:0 auto; }
.about-text p{ color: var(--gray); margin-bottom:1.1em; font-size:1.03rem; }

/* ---------- contact ---------- */
.contact-grid{ display:grid; grid-template-columns: .95fr 1.05fr; gap:44px; }
.contact-cards{ display:flex; flex-direction:column; gap:14px; }
.info-card{
  background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding:18px 20px;
  box-shadow: var(--shadow); display:flex; gap:16px; align-items:flex-start;
}
.info-card .ic{
  width:40px; height:40px; border-radius:50%; background: var(--blue-pale); color: var(--blue);
  display:flex; align-items:center; justify-content:center; font-weight:700; flex-shrink:0; font-family: var(--font-display);
}
.info-card h3{ font-size:.98rem; margin-bottom:.2em; color: var(--ink); }
.info-card p, .info-card a{ color: var(--gray); font-size:.94rem; }
.info-card a:hover{ color: var(--red); }
.map-frame{ border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow); border:1px solid var(--line); margin-top:14px; }
.map-frame iframe{ width:100%; height:280px; border:0; display:block; }

.form-card{ background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding:30px; box-shadow: var(--shadow); }
.form-card h3{ margin-bottom:.2em; color: var(--ink); }
.form-card .sub{ color: var(--gray); font-size:.92rem; margin-bottom:22px; }
.field{ margin-bottom:16px; }
.field label{ display:block; font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color: var(--blue); margin-bottom:6px; }
.field input, .field textarea{
  width:100%; padding:11px 14px; border-radius: var(--radius); border:1px solid var(--line);
  font-family: var(--font-body); font-size:.96rem; background: var(--offwhite); color: var(--ink);
}
.field textarea{ min-height:120px; resize:vertical; }
.field input:focus, .field textarea:focus{ outline:2px solid var(--blue); outline-offset:1px; }
.form-note{ font-size:.8rem; color: var(--gray); margin-top:10px; }

/* ---------- teklif formu (quote form) ---------- */
.quote-card{
  max-width: 820px; margin: 0 auto; background:#fff; border:1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: 34px 34px 30px;
}
.quote-block{ margin-bottom: 30px; }
.quote-h{
  font-family: var(--font-display); font-weight:700; font-size:1.02rem; color: var(--blue);
  margin-bottom: 16px; padding-bottom: 10px; border-bottom: 2px solid var(--blue-pale);
}
.dish-check-list{ display:grid; grid-template-columns: 1fr 1fr; gap:4px 24px; }
.dish-check{
  display:flex; align-items:center; gap:10px; padding:10px 4px; border-bottom:1px dashed var(--line);
  cursor:pointer; font-weight:600; color: var(--ink); font-size:.96rem;
}
.dish-check input{ width:18px; height:18px; accent-color: var(--red); cursor:pointer; flex-shrink:0; }
.dish-check:hover{ color: var(--blue); }
.quote-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:0 20px; }

/* ---------- footer ---------- */
footer.site{ background: var(--blue-dk); color: #EAF1FB; padding: 56px 0 22px; margin-top: 0; }
.footer-grid{ display:grid; grid-template-columns: 1.3fr 1fr 1fr; gap:40px; margin-bottom: 36px; }
.footer-brand .brand-text .t1{ color:#fff; }
.footer-brand .brand-text .t2{ color:#FF8478; }
.footer-brand p{ margin-top:14px; color: rgba(234,241,251,.72); font-size:.92rem; max-width: 34ch; }
footer.site h4{ font-family: var(--font-display); text-transform:uppercase; letter-spacing:.08em; font-size:.78rem; color:#FF8478; margin-bottom:16px; }
footer.site ul li{ margin-bottom:10px; }
footer.site ul a{ color: rgba(234,241,251,.85); font-size:.94rem; }
footer.site ul a:hover{ color:#fff; text-decoration:underline; }
.footer-bottom{
  border-top:1px solid rgba(234,241,251,.16); padding-top:18px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:.82rem; color: rgba(234,241,251,.6);
}

/* ---------- mobile nav ---------- */
.mobile-panel{
  display:none; position:fixed; inset:0; z-index:60; background: #fff;
  padding: 22px 24px; overflow-y:auto;
}
.mobile-panel.open{ display:block; }
.mobile-panel .close-row{ display:flex; justify-content:flex-end; margin-bottom:24px; }
.mobile-panel .close-row button{ background:none; border:0; font-size:1.6rem; color: var(--blue); cursor:pointer; }
.mobile-panel ul{ display:flex; flex-direction:column; gap:2px; }
.mobile-panel a{ display:block; padding:16px 4px; font-family: var(--font-display); font-weight:700; font-size:1.3rem; color: var(--red); border-bottom:1px solid var(--line); }
.mobile-panel .tel-btn{ margin-top:24px; width: max-content; }

/* ---------- responsive ---------- */
@media (max-width: 980px){
  nav.mainnav{ display:none; }
  .burger{ display:flex; }
  .services-grid{ grid-template-columns: 1fr 1fr; }
  .cat-grid{ grid-template-columns: 1fr 1fr; }
  .pasta-grid{ grid-template-columns: 1fr 1fr; }
  .intro-block{ grid-template-columns:1fr; }
  .intro-reverse{ grid-template-columns:1fr; }
  .intro-reverse .plate{ order:-1; }
  .dish-panel{ grid-template-columns:1fr; }
  .dish-panel .plate{ max-width:340px; margin:0 auto 20px; }
  .dish-list{ grid-template-columns: 1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .about-hero{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .hero-banner{ aspect-ratio: 4/3; }
}
@media (max-width: 620px){
  .topbar .wrap{ justify-content:center; text-align:center; }
  .services-grid{ grid-template-columns: 1fr; }
  .cat-grid{ grid-template-columns: 1fr; }
  .pasta-grid{ grid-template-columns: 1fr; }
  .gallery-grid{ grid-template-columns: repeat(2, 1fr); }
  .footer-grid{ grid-template-columns:1fr; }
  section{ padding: 44px 0; }
  .services-band{ padding: 44px 0; }
  .quote-card{ padding: 24px 20px; }
  .dish-check-list{ grid-template-columns: 1fr; }
  .quote-grid{ grid-template-columns: 1fr; }
}


/* ---------- sabit WhatsApp butonu ---------- */
.whatsapp-float{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:1000;
  width:58px;
  height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:#25D366;
  border-radius:50%;
  box-shadow:0 8px 24px rgba(0,0,0,.24);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.whatsapp-float svg{ width:31px; height:31px; display:block; }
.whatsapp-float:hover{
  color:#fff;
  background:#20bd5a;
  transform:translateY(-3px) scale(1.04);
  box-shadow:0 12px 28px rgba(0,0,0,.28);
}
.whatsapp-float:focus-visible{ outline:3px solid rgba(37,211,102,.35); outline-offset:4px; }
@media (max-width:620px){
  .whatsapp-float{ right:16px; bottom:16px; width:54px; height:54px; }
  .whatsapp-float svg{ width:29px; height:29px; }
}

/* ---------- Google yorumları ---------- */
.reviews-head{background:linear-gradient(180deg,var(--blue-pale),#fff);padding-bottom:42px}
.reviews-summary{max-width:760px;margin:28px auto 0;padding:20px 24px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;gap:18px;text-align:left}
.summary-score{font-family:var(--font-display);font-size:2.6rem;line-height:1;font-weight:800;color:var(--blue-dk)}
.stars{color:#f4b400;letter-spacing:2px;font-size:1.08rem;white-space:nowrap}
.reviews-summary strong{display:block;color:var(--ink);font-size:.92rem;margin-top:3px}
.reviews-summary .btn{margin-left:auto;white-space:nowrap}
.reviews-section{padding-top:54px}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.review-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .22s ease,box-shadow .22s ease}
.review-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(16,44,80,.14)}
.review-top{display:flex;gap:13px;align-items:center;margin-bottom:14px}
.review-avatar{width:46px;height:46px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;flex:0 0 auto}
.review-card h2{font-size:1rem;color:var(--ink);margin:0 0 2px}
.review-source{font-size:.78rem;color:var(--gray)}
.review-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;color:var(--gray);font-size:.8rem;margin-bottom:14px}
.review-meta .stars{font-size:.9rem;letter-spacing:1px}
.review-card p{color:var(--gray);font-size:.94rem;line-height:1.7;margin:0}
.review-card .review-empty{font-style:italic;color:#8b96a5}
.reviews-cta{margin-top:42px;padding:34px;background:var(--blue);border-radius:var(--radius);text-align:center;color:#fff}
.reviews-cta h2{color:#fff;margin-bottom:8px}
.reviews-cta p{color:rgba(255,255,255,.82);margin:0 auto 20px;max-width:56ch}
@media(max-width:980px){.reviews-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.reviews-summary{flex-wrap:wrap;text-align:center}.reviews-summary .btn{margin-left:0;width:100%;justify-content:center}.reviews-grid{grid-template-columns:1fr}.review-card{padding:20px}.reviews-cta{padding:28px 20px}}