/*
Theme Name: Topoli Blocks
Theme URI: https://example.com/
Author: OpenAI
Description: Block-editable Topoli Persian & Mediterranean Kitchen site generated from the technical handoff. The homepage content is stored as Gutenberg blocks; the theme supplies the visual styling only.
Version: 1.0.0
Text Domain: topoli-blocks
*/

:root{
  --paper:#FCFAF4;
  --panel:#F1E9DA;
  --panel-2:#EFE2CB;
  --ink:#0d0d0d;
  --ink-soft:#43403a;
  --gray:#8a8276;
  --line:#ddd2bf;
  --pom:#9a3324;
  --pom-d:#7a2618;
  --gold:#E0A948;
  --flourish:#bfb29a;
  --shadow:0 18px 50px rgba(59,39,26,.16);
  --radius:22px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"EB Garamond", Georgia, serif;
  font-size:20px;
  line-height:1.55;
}
body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
  max-width:1180px;
}
.wp-site-blocks, .topoli-main{margin:0;padding:0}
.topoli-site{margin:0!important;max-width:none!important;background:var(--paper)}
.topoli-site a{color:inherit}

.topoli-nav{
  position:sticky;
  top:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:12px clamp(18px,4vw,52px);
  background:rgba(252,250,244,.94);
  backdrop-filter:saturate(1.1) blur(10px);
  border-bottom:1px solid rgba(154,51,36,.18);
  box-shadow:0 8px 24px rgba(0,0,0,.05);
}
.topoli-wordmark{
  margin:0!important;
  font-size:clamp(30px,4vw,48px);
  line-height:1;
  letter-spacing:.1em;
  font-weight:700;
  color:var(--pom);
}
.topoli-nav-links{gap:8px!important;margin:0!important}
.topoli-nav-links .wp-block-button__link{
  border-radius:999px;
  background:transparent;
  color:var(--ink);
  padding:7px 14px;
  font-size:18px;
  border:1px solid transparent;
  text-decoration:none;
}
.topoli-nav-links .topoli-nav-phone .wp-block-button__link{
  background:var(--pom);
  color:#fff;
  border-color:var(--pom);
}
.topoli-nav-links .wp-block-button__link:hover{
  border-color:var(--gold);
  background:#fff7e7;
}

.topoli-hero{
  margin:0!important;
  position:relative;
  min-height:760px;
  overflow:hidden;
}
.topoli-hero .wp-block-cover__image-background{
  filter:saturate(.95) contrast(1.03);
}
.topoli-hero .wp-block-cover__background{
  background:linear-gradient(180deg,rgba(0,0,0,.46),rgba(0,0,0,.32) 45%,rgba(0,0,0,.58))!important;
}
.hero-content{
  max-width:960px!important;
  margin:auto!important;
  padding:clamp(70px,10vw,130px) 20px!important;
  color:#fff;
  text-shadow:0 2px 20px rgba(0,0,0,.46);
}
.hero-title{
  margin:0!important;
  font-size:clamp(74px,14vw,172px);
  line-height:.82;
  letter-spacing:.08em;
  font-weight:700;
}
.hero-kicker{
  margin:22px 0 0!important;
  font-family:"Great Vibes", cursive;
  color:#ffe7ab;
  font-size:clamp(42px,7vw,82px);
  line-height:1;
}
.hero-copy{
  max-width:760px;
  margin:26px auto 0!important;
  font-size:clamp(21px,2.5vw,31px);
}
.hero-buttons{margin-top:34px!important;gap:12px!important}

.wp-block-button .wp-block-button__link,
.btn-pom .wp-block-button__link,
.btn-ghost .wp-block-button__link{
  border-radius:999px;
  padding:12px 22px;
  font-size:19px;
  line-height:1;
  text-decoration:none;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.btn-pom .wp-block-button__link{
  background:var(--pom);
  color:#fff;
  border:1px solid var(--pom);
}
.btn-ghost .wp-block-button__link{
  background:rgba(255,255,255,.90);
  color:var(--pom-d);
  border:1px solid rgba(154,51,36,.25);
}
.btn-pom .wp-block-button__link:hover{background:var(--pom-d)}
.btn-ghost .wp-block-button__link:hover{background:#fff}

.dish-photo-note{
  max-width:none!important;
  background:var(--panel);
  border-top:1px solid var(--gold);
  border-bottom:1px solid var(--gold);
  margin:0!important;
  padding:13px 20px!important;
  text-align:center;
  color:#5b3b2d;
}
.dish-photo-note p{margin:0!important;font-size:17px}

.topoli-section{
  max-width:none!important;
  margin:0!important;
  padding:clamp(54px,8vw,92px) clamp(18px,4vw,50px)!important;
  position:relative;
}
.topoli-section:nth-of-type(even){background:rgba(241,233,218,.42)}
.section-head{
  max-width:980px!important;
  margin:0 auto 38px!important;
  text-align:center;
}
.section-title{
  color:var(--pom);
  font-size:clamp(42px,6vw,72px);
  line-height:1;
  margin:0!important;
  letter-spacing:.02em;
}
.topoli-divider,
.cat-divider{
  border:0!important;
  width:min(220px,60vw);
  height:2px!important;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  margin:18px auto 0!important;
}

.about-columns,
.order-columns,
.visit-columns{
  max-width:1180px!important;
  margin:0 auto!important;
  gap:30px!important;
}
.about-copy p{font-size:23px}
.about-card,
.order-card,
.visit-card,
.parking-guide{
  background:rgba(255,255,255,.62);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:28px;
  box-shadow:var(--shadow);
}
.about-card-title,
.card-title{
  color:var(--pom);
  font-size:30px;
  line-height:1.1;
  margin-top:0!important;
}
.parking-copy{
  background:#fff7e7;
  border-left:5px solid var(--gold);
  padding:16px 18px;
  border-radius:14px;
}

.dish-grid{
  max-width:1180px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.dish-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  padding:0!important;
}
.dish-card .wp-block-image{
  margin:0!important;
}
.dish-card img{
  display:block;
  width:100%;
  aspect-ratio:5/4;
  object-fit:cover;
}
.dish-title{
  color:var(--pom);
  font-size:29px;
  line-height:1.1;
  margin:20px 22px 6px!important;
}
.dish-desc{
  margin:0 22px 24px!important;
  color:var(--ink-soft);
}

.topoli-menu{
  background:var(--paper);
}
.topoli-menu > .wp-block-group__inner-container{max-width:1180px}
.cat{
  max-width:1180px!important;
  margin:0 auto 42px!important;
  background:rgba(255,255,255,.52);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:28px!important;
  box-shadow:0 10px 36px rgba(59,39,26,.08);
}
.cat-name{
  color:var(--pom);
  font-size:clamp(34px,4.5vw,52px);
  margin:0!important;
}
.mi-row{
  display:grid!important;
  grid-template-columns:112px 1fr;
  gap:18px;
  align-items:center;
  padding:17px 0!important;
  border-bottom:1px dotted rgba(154,51,36,.25);
}
.mi-row:last-child{border-bottom:0}
.mi-row > .wp-block-image{
  margin:0!important;
}
.mi-row img{
  width:112px;
  height:90px;
  object-fit:cover;
  border-radius:16px;
  border:1px solid var(--line);
  box-shadow:0 8px 18px rgba(59,39,26,.12);
}
.mi-text{margin:0!important;padding:0!important}
.mi-line{
  display:flex!important;
  justify-content:space-between;
  gap:16px;
  align-items:baseline;
  margin:0!important;
  padding:0!important;
}
.mi-name{
  color:var(--ink);
  font-size:25px;
  line-height:1.08;
  margin:0!important;
}
.mi-price{
  color:var(--pom);
  font-weight:700;
  white-space:nowrap;
  margin:0!important;
  font-size:21px;
}
.mi-desc{
  color:var(--ink-soft);
  margin:6px 0 0!important;
  font-size:18px;
}
.cat-foot{
  margin:20px 0 0!important;
  font-style:italic;
  color:#6e5d51;
  background:#fff7e7;
  border-radius:14px;
  padding:12px 16px;
}
.topoli-menu .cat:nth-last-child(-n+2) .mi-row{
  grid-template-columns:1fr;
}

.topoli-order{
  background:linear-gradient(135deg,#fbf4e7,#eee0c9);
}
.order-card-dark{
  background:var(--pom);
  color:#fff;
}
.order-card-dark .card-title{color:#ffe7ab}
.topoli-events{
  background:var(--panel);
  text-align:center;
}
.events-copy{
  max-width:900px;
  margin-left:auto!important;
  margin-right:auto!important;
  font-size:24px;
}
.events-buttons{margin-top:26px!important}

.topoli-visit{
  background:var(--paper);
}
.visit-card + .visit-card{margin-top:22px!important}
.parking-guide{margin-top:22px!important}
.parking-guide .wp-block-image{margin:14px 0 0!important}
.parking-guide img{
  width:100%;
  height:auto;
  border-radius:18px;
  border:1px solid var(--line);
  box-shadow:0 10px 28px rgba(59,39,26,.12);
}
.parking-mobile{display:none}

.topoli-footer{
  max-width:none!important;
  margin:0!important;
  background:#241f19;
  color:#f7eddd;
  padding:38px 20px!important;
}
.footer-mark{
  margin:0!important;
  font-size:42px;
  letter-spacing:.12em;
  color:#ffe7ab;
}
.allergen{
  max-width:950px;
  margin:14px auto!important;
  color:#cfc2b0;
  font-size:16px;
}
.copyright{
  color:#b9aa98;
  font-size:17px;
}

.topoli-lightbox{
  position:fixed;
  inset:0;
  z-index:99999;
  background:rgba(0,0,0,.86);
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.topoli-lightbox.is-open{display:flex}
.topoli-lightbox-inner{
  max-width:min(980px,94vw);
  color:#fff;
  text-align:center;
}
.topoli-lightbox img{
  max-width:100%;
  max-height:78vh;
  border-radius:20px;
  box-shadow:0 24px 80px rgba(0,0,0,.45);
}
.topoli-lightbox button{
  appearance:none;
  border:0;
  border-radius:999px;
  background:#fff;
  color:#000;
  padding:10px 16px;
  margin-top:14px;
  cursor:pointer;
}

@media (max-width:900px){
  .topoli-nav{flex-direction:column;gap:10px}
  .dish-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-columns,.order-columns,.visit-columns{display:block!important}
  .about-side,.visit-right{margin-top:24px}
}
@media (max-width:620px){
  body{font-size:18px}
  .topoli-nav{align-items:flex-start}
  .topoli-nav-links{justify-content:flex-start!important}
  .topoli-nav-links .wp-block-button__link{font-size:16px;padding:6px 10px}
  .topoli-section{padding:44px 16px!important}
  .dish-grid{grid-template-columns:1fr}
  .cat{padding:20px!important}
  .mi-row{grid-template-columns:92px 1fr;gap:12px}
  .mi-row img{width:92px;height:74px;border-radius:12px}
  .mi-line{display:block!important}
  .mi-price{display:block;margin-top:4px!important}
  .parking-desktop{display:none}
  .parking-mobile{display:block}
}
