/* ===========================
   الخطوط العامة
=========================== */
body {
    font-family: "Cormorant Garamond", serif;
    margin: 0;
    padding: 0;
    background: #faf7f2;
    color: #333;
}

/* ===========================
   الهيدر + الخلفية
=========================== */
.hero {
    position: relative;
    text-align: center;
    padding-top: 40px;
    padding-bottom: 120px;   /* ينزل الأكواب */
    background: url("delamo-hero.jfif") center/cover no-repeat;
    color: #fff;
}

/* محتوى الهيدر */
.hero-content img {
    display: none; /* لأن الخلفية أساسًا الخلفية */
}

.logo {
    font-family: "Playfair Display", serif;
    font-size: 65px;
    margin: 0;
    color: white;
    text-shadow: 0 0 12px rgba(0,0,0,0.4);
}

.tagline {
    font-size: 20px;
    margin-top: 10px;
    color: #ffeccc;
}

/* ===========================
   صور الأكواب – الحجم ثابت
=========================== */
.menu-showcase {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: -40px;    /* توازن مثالي بين الهيدر والصور */
}

.beverage-photo {
    width: 180px;    /* حجم ثابت بدون انفجار */
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 5px 12px rgba(0,0,0,0.2));
}

/* ===========================
   الأقسام + القوائم
=========================== */
.info-section {
    margin: 40px 20px;
}

.info-block {
    background: white;
    padding: 20px;
    border-radius: 14px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.06);
    width: 250px;
}

.info-block h3 {
    margin-top: 0;
    font-size: 22px;
    color: #4a3d32;
}

.info-block ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.info-block li {
    font-size: 18px;
    margin-bottom: 8px;
    display: flex;
    justify-content: space-between;
}

.info-block span {
    color: #8b6d4c;
    font-weight: bold;
}

/* ===========================
   الفوتر
=========================== */
footer {
    text-align: center;
    padding: 25px;
    font-size: 14px;
    color: #6a6a6a;
    margin-top: 40px;
}
.price-cal {
    display: inline-block;
    float: left; /* aligns to left in RTL layout */
    margin-right: 10px; /* spacing between name and price/cal */
    font-weight: bold;
}
.info-block li {
    overflow: hidden; /* ensures floating element doesn’t break layout */
    margin-bottom: 8px;
}