.cuisine-hero {
border-bottom: 1px solid var(--color-border);
}
.cuisine-hero-grid {
grid-auto-rows: minmax(0, 1fr);
}
.cuisine-hero-main-image::before {
background-image: url("/assets/images/woodfired-grill-feast.webp");
background-size: cover;
background-position: center;
}
.cuisine-section-header {
max-width: 54rem;
margin-inline: auto;
margin-bottom: var(--space-8);
}
.cuisine-layout-grid {
display: grid;
gap: var(--space-6);
}
@media (min-width: 1024px) {
.cuisine-layout-grid {
grid-template-columns: minmax(0, 3fr) minmax(0, 2.4fr);
}
}
.cuisine-feature-inner {
display: grid;
gap: var(--space-5);
}
@media (min-width: 960px) {
.cuisine-feature-inner {
grid-template-columns: minmax(0, 3fr) minmax(0, 2.4fr);
align-items: stretch;
}
}
.cuisine-feature-copy {
display: flex;
flex-direction: column;
gap: var(--space-4);
}
.cuisine-feature-media {
border-radius: var(--radius-lg);
overflow: hidden;
border: 1px solid var(--color-border);
background: #020617;
}
.cuisine-feature-media img {
width: 100%;
height: 100%;
object-fit: cover;
}
.cuisine-feature-alt .cuisine-feature-inner {
align-items: flex-start;
}
.cuisine-feature-aside {
display: flex;
flex-direction: column;
justify-content: space-between;
gap: var(--space-4);
}
.cuisine-note {
font-size: 0.9rem;
color: var(--color-text-muted);
}
.cuisine-actions {
display: flex;
flex-wrap: wrap;
gap: var(--space-3);
}
.cuisine-list {
display: flex;
flex-direction: column;
gap: var(--space-2);
font-size: 0.95rem;
}
.cuisine-list li {
display: flex;
align-items: flex-start;
gap: var(--space-2);
color: var(--color-text-muted);
}
.cuisine-dot {
width: 8px;
height: 8px;
border-radius: 999px;
background: radial-gradient(circle, var(--color-primary), #b45309);
box-shadow: 0 0 10px rgba(217, 119, 6, 0.7);
margin-top: 6px;
}
.cuisine-meta-row {
display: flex;
flex-wrap: wrap;
gap: var(--space-3);
align-items: center;
}
.cuisine-media-card {
display: flex;
padding: 0;
overflow: hidden;
}
.cuisine-media-card img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: var(--radius-lg);
}
.cuisine-split {
align-items: stretch;
}
.cuisine-stack-inner {
display: flex;
flex-direction: column;
gap: var(--space-6);
}
.cuisine-stack-item {
border-radius: var(--radius-lg);
border: 1px solid var(--color-border);
background: linear-gradient(160deg, #020617, #111827);
padding: var(--space-5);
}
.cuisine-stack-header {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: var(--space-3);
margin-bottom: var(--space-3);
}
.cuisine-inline-media {
border-radius: var(--radius-md);
overflow: hidden;
border: 1px solid var(--color-border);
margin-block: var(--space-3);
}
.cuisine-inline-media img {
width: 100%;
height: 100%;
object-fit: cover;
}
.cuisine-wine {
border-top: 1px solid var(--color-border);
border-bottom: 1px solid var(--color-border);
}
.cuisine-atmosphere .cuisine-inline-media img {
max-height: 260px;
}
.allergen-grid {
align-items: stretch;
}
.cuisine-aside {
max-width: 420px;
}
@media (max-width: 960px) {
.cuisine-aside {
max-width: 100%;
}
}
.cuisine-legal-links {
display: flex;
flex-wrap: wrap;
gap: var(--space-3);
font-size: 0.85rem;
}
.cuisine-legal-links a {
color: var(--color-text-muted);
}
.cuisine-final-inner {
display: flex;
flex-direction: column;
gap: var(--space-5);
}
@media (min-width: 900px) {
.cuisine-final-inner {
flex-direction: row;
align-items: center;
justify-content: space-between;
}
}
.cuisine-final-actions {
display: flex;
flex-wrap: wrap;
gap: var(--space-3);
}
.cuisine-final-cta {
padding-bottom: var(--space-20);
}
.cuisine-grid {
border-bottom: 1px solid var(--color-border);
}
@media (max-width: 768px) {
.cuisine-media-card {
min-height: 220px;
}
}
Document