html {
    scroll-behavior: smooth;
}

@import url('https://fonts.googleapis.com/css2?family=GFS+Didot&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,100..900;1,100..900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&display=swap');

body {
    font-family: 'Poppins', sans-serif,;
}

/* Top Bar */
.top-bar {
    background: #267287;
    color: #fff;
    font-size: 20px;
    font-family: 'raleway', sans-serif;
    padding: 8px 40px;
}

/* Logo */
.brand-logo-img {
    max-width: 200px;
    height: auto;
}

/* Navigation */
.nav-bar {
    background: #144451;
    font-family: 'gps didot', serif;
}

.nav-bar a {
    color: #fff !important;
    margin: 0 12px;
    font-weight: 500;
}

/* HERO SECTION */
.baraf-hero {
    padding: 80px 0;
    background: #fff;
}

/* LEFT CONTENT */
.hero-content {
    padding-left: 90px;
    padding-right: 40px;
}

.hero-brand {
    font-size: 22px;
    letter-spacing: 2px;
    display: block;
    margin-bottom: 10px;
    font-family: 'GPS+Didot', serif;
}

.hero-title {
    font-size: 52px;
    line-height: 1.1;
    margin-bottom: 20px;
    font-family: 'Noto+Serif:ital', serif;
    font-weight: 900;
}

.hero-text {
    font-size: 14px;
    line-height: 1.8;
    max-width: 520px;
    margin-bottom: 30px;
    color: #333;
}

.hero-btn {
    background: #FFB300;
    border: none;
    padding: 12px 28px;
    font-weight: 400;
    border-radius: 6px;
    font-family: 'GPS+Didot', serif;
}

/* RIGHT IMAGE FULL WIDTH */
.hero-image-wrap {
    position: relative;
    height: 100%;
}

/* Image container */
.hero-image-inner {
    position: relative;
    margin-left: 40px;
    border-radius: 30px 0 0 30px;
    overflow: hidden;
    z-index: 2;
}

/* Image itself */
.hero-image-inner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Desktop height balance */
@media (min-width: 992px) {
    .baraf-hero {
        min-height: 90vh;
        display: flex;
        align-items: center;
    }
}

/* Mobile stacking */
@media (max-width: 991px) {
    .hero-content {
        padding: 40px 20px;
    }

    .hero-image-inner {
        margin: 20px;
        border-radius: 20px;
    }

    .hero-image-wrap::before {
        display: none;
    }
}

/* scrolling effect */
.scrolling-container {
    background-color: #144451;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    user-select: none;
    padding: 1rem 0;
}

.scrolling-text {
    display: inline-block;
    font-weight: 700;
    font-size: 2rem;
    color: #07CEF9;
    letter-spacing: 0.15em;
    /* Repeat text multiple times */
    white-space: nowrap;
    animation: scroll-left 40s linear infinite;
}

/* Keyframes to scroll from 0 to full width negative (approximate) */
@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* icons  */
.hugeicons--serving-food {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23FFB10B' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M4 14h18M5 22l.93-.93c.53-.53.794-.794 1.127-.944s.706-.174 1.452-.22l3.253-.204c1.598-.1 2.398-.15 3.101-.487c.703-.338 1.242-.93 2.32-2.116L20 14h-3.5l-1.793 1.793c-.12.12-.179.179-.24.231a2 2 0 0 1-1.133.47c-.081.006-.165.006-.334.006M2 19l3.078-3.078c.739-.739 1.108-1.108 1.544-1.366a4 4 0 0 1 1.039-.43C8.15 14 8.673 14 9.718 14h.782c.465 0 .697 0 .89.038a2 2 0 0 1 1.572 1.572c.038.193.038.425.038.89m0 0H9.5m-4.5-5a8 8 0 0 1 8-8m0 0a8 8 0 0 1 8 8m-8-8V2'/%3E%3C/svg%3E");
}

.fontisto--cocktail {
    display: inline-block;
    width: 26px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 24'%3E%3Cpath fill='%23FFB10B' d='M23.812.678c-.054-.034-.107-.06-.16-.087a4.5 4.5 0 0 0-2.105-.516h-.008a4.6 4.6 0 0 0-3.965 2.278l-.012.022a4.4 4.4 0 0 0-.582 1.847l-.001.017h-9.6L6.305 1.65A2.664 2.664 0 0 0 3.229.071l.018-.004L.001.805l.201.886L3.448.953a1.76 1.76 0 0 1 2.014 1.035L5.466 2l.932 2.24H.302l10.193 10.193v7.463c-2.367.168-4 .952-4 1.925v.181h9.824v-.181c0-.972-1.636-1.76-4-1.925v-7.463l6.283-6.283c.197.167.417.322.649.458l.022.012A4.575 4.575 0 0 0 23.841.692L23.819.68zm.999 3.507l-2.494.007l1.241-2.16a3.3 3.3 0 0 1 1.251 2.135zm-2.038-2.609l-1.241 2.166l-1.254-2.153a3.3 3.3 0 0 1 1.264-.248c.443 0 .866.086 1.253.243zm-4.111 1.429c.218-.379.496-.698.825-.955l.007-.005l1.254 2.153l-2.488.007c.056-.449.198-.855.41-1.216zM3.359 5.506H6.92l.49 1.187H4.547zm14.894 1.188h-.813V6.7H8.387l-.49-1.187h11.534zm2.045 1.026l1.241-2.166l1.254 2.153c-.373.158-.807.25-1.262.25c-.444 0-.868-.087-1.255-.246zm4.111-1.422a3.3 3.3 0 0 1-.824.955l-.007.005l-1.254-2.153l2.488-.006a3.4 3.4 0 0 1-.411 1.214z'/%3E%3C/svg%3E");
}

.ph--disco-ball-duotone {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cg fill='%23FFB10B'%3E%3Cpath d='M192 152a80 80 0 0 1-80 80s32-24 32-80Zm-80-80s-32 24-32 80h64c0-56-32-80-32-80' opacity='0.2'/%3E%3Cpath d='M120 64.37V16a8 8 0 0 0-16 0v48.37a88 88 0 1 0 16 0M183.54 144h-31.77c-1.51-28.36-10.79-48.36-19.44-61.06A72.16 72.16 0 0 1 183.54 144m-95.3 16h47.52c-2 33.52-16.13 52.95-23.76 61.08c-7.64-8.15-21.77-27.57-23.76-61.08m0-16c2-33.52 16.13-52.95 23.76-61.08c7.64 8.15 21.77 27.57 23.76 61.08Zm3.43-61.06C83 95.64 73.74 115.64 72.23 144H40.46a72.16 72.16 0 0 1 51.21-61.06M40.46 160h31.77c1.51 28.36 10.79 48.36 19.44 61.06A72.16 72.16 0 0 1 40.46 160m91.87 61.06c8.65-12.7 17.93-32.7 19.44-61.06h31.77a72.16 72.16 0 0 1-51.21 61.06M256 88a8 8 0 0 1-8 8h-8v8a8 8 0 0 1-16 0v-8h-8a8 8 0 0 1 0-16h8v-8a8 8 0 0 1 16 0v8h8a8 8 0 0 1 8 8M152 40a8 8 0 0 1 8-8h16V16a8 8 0 0 1 16 0v16h16a8 8 0 0 1 0 16h-16v16a8 8 0 0 1-16 0V48h-16a8 8 0 0 1-8-8'/%3E%3C/g%3E%3C/svg%3E");
}

.streamline-freehand--modern-music-bass-guitar {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23FFB10B' fill-rule='evenodd' clip-rule='evenodd'%3E%3Cpath d='M11.79 10.803c-.119-.47-.529.479.87-2.188c.23-.46.47-1.269.55-1.229a1.6 1.6 0 0 0 2.067-.91a4 4 0 0 0 1.619.56a.33.33 0 0 0 .44-.12c.289-.529-1.06-1.078-1.58-1.298c-.08 0-.12.16.47-1.129a3.7 3.7 0 0 0 1.679.61a.324.324 0 0 0 .31-.57a3 3 0 0 0-.46-.49c-.12-.08-.86-.32-1-.38c-.289 0-.15.06.16-.848a1.55 1.55 0 0 0-.07-1.589a1.9 1.9 0 0 0-1.568-.32l-1.268.14c-2.348.44-1.449.13-1.868.2c-.18 0-.73.81-.84 1a2.93 2.93 0 0 0-1.738-1.12a.29.29 0 0 0-.35.2c0 .05 0 .14.08.31c.3.73.8.889 1.619 1.169a6.5 6.5 0 0 0-.67 1.079a5.6 5.6 0 0 0-.889-.74c-.4-.18-.999-.42-1.079 0c0 .08 0 .92 1.719 1.489a1.07 1.07 0 0 0 .39 1.069c.11.09.249.41.399.38a22.5 22.5 0 0 1-1.948 3.126c-.22-.43-.82.08-1.229.34c-1.448.999-6.833 4.485-7.472 5.934a1.1 1.1 0 0 0 .57 1.548c1.188.58 5.204.07 5.653.07c.92 0 .41.46.69 1.279c.999 2.797 2.857 3.866 3.806 2.847s.949-6.384.939-7.992c.096-.806.096-1.621 0-2.427m-.449-4.096c.69-1.399-.55-1.329-.669-1.858c-.12-.53 1.249-2.438 1.618-2.927c.16.31.44.11 1 0c.559-.11 2.747-.51 3.056-.16s-1.838 4.275-1.978 4.435a.64.64 0 0 1-.859.26a2.5 2.5 0 0 0-.32-.15c-.739-.23-1.098 1.149-1.448 1.838c-2.088 3.996-2.997 5.994-3.896 5.595c-.9-.4 2.308-4.586 3.496-7.033m-.26 6.493c0 1.179-.15 5.524-.719 6.993c-.1.26-.22.5-.52.38a4.08 4.08 0 0 1-1.777-2.548c-.28-.819-.09-1.928-1.509-1.998c-.2 0-5.344.51-5.534 0c-.29-.779 6.843-5.934 6.923-5.994c.64-.44.939-1.129 0 .54a8.6 8.6 0 0 0-1.299 2.887c-.06 1.269 1.359 1.808 2.438.999a9.4 9.4 0 0 0 2.097-3.107c.03.68-.09 1.289-.1 1.848'/%3E%3Cpath d='M23.998 17.526c-.1-4.066.31-6.214-2.377-6.883c.28-1.609.15-2.608-1.549-2.698c-.869 0-1.158.51-1.338 1.379c0 0-.1.64-.13.999c-1 0-5.385.13-5.434.13a.29.29 0 0 0 .07.57c.17 0 6.752-.09 8.5.629a1.45 1.45 0 0 1 1 1.178a62.6 62.6 0 0 1 .08 8.991a4.8 4.8 0 0 1-1.409.37c-.78.1-6.184.07-6.383.07q-1.16.01-2.308-.14a.32.32 0 0 0-.4.49c.46.479 8.681.569 9.2.529c2.308-.22 2.299-.77 2.398-1.808c.1-1.04.08-3.087.08-3.806m-4.735-7.163c.13-.33.17-1.429.74-1.329c.869 0 .909.38.949 1.499a16 16 0 0 0-1.689-.17'/%3E%3Cpath d='M18.944 20.413a4.4 4.4 0 0 0 2.637-2.997a3.415 3.415 0 0 0-2.528-4.276c-1.838-.37-4.245.24-5.124 2.278c-1.499 3.426 1.718 6.184 5.014 4.995m-4.236-4.725c.79-2.188 3.886-2.438 5.105-1.429a2.68 2.68 0 0 1 .839 2.877c-1.149 4.036-7.463 2.787-5.944-1.449'/%3E%3Cpath d='M18.824 17.226c.44-1.349-.77-2.278-1.279-2.128a1.82 1.82 0 0 0-1.868 1.658a1.598 1.598 0 0 0 3.147.47m-2.118-.61c.29-1.418 1.758-.839 1.259.28a.649.649 0 0 1-1.26-.28'/%3E%3C/g%3E%3C/svg%3E");
}


/* Features */


.feature-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #FFE600;
}

.features-strip {
    position: relative;
    background: url("assets/foodontable.png") center/cover no-repeat;
    padding: 60px 0;
}

.features-strip::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.65);
}

.feature-box {
    position: relative;
    z-index: 1;
    padding: 0 20px;
}

.feature-box h6 {
    font-weight: 600;
    margin-bottom: 6px;
    color: #FFE600;
}

.feature-box p {
    font-size: 13px;
    line-height: 1.5;
    opacity: 0.85;
}

/* signature dish  */
.popular-food {
    padding: 70px 0;
    background: #fff;
    font-family: 'GFS Didot', serif;
}

.section-title span {
    color: #f5a623;
}

.food-card {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: 0.3s;
}

.food-card.active {
    transform: translateY(-20px);
}

.food-card img {
    width: 100%;
    height: 350px;
    object-fit: cover;
}

.food-info {
    padding: 18px;
}

.rating {
    color: #f5a623;
    font-size: 14px;
    margin: 6px 0;
}

.story-section {
    padding: 70px 0;
    background-color: #267287;
}

/* Card container */
.story-card {
    background: #fff;
    padding: 50px;
    border-radius: 10px;
    max-width: 1050px;
    /* makes it visually smaller */
    margin: auto;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
}

/* Image */
.story-img {
    border-radius: 8px;
    width: 100%;
    object-fit: cover;
}

/* Pop-up Animation */
.animate-story {
    opacity: 0;
    transform: scale(0.95) translateY(40px);
    transition: all 0.7s ease;
}

.animate-story.show {
    opacity: 1;
    transform: scale(1) translateY(0);
}

/* gallery */
.gallery-section {
    padding: 80px 0;
    background: #fff;
    font-family: 'gps didot', serif;
}

.gallery-subtitle {
    letter-spacing: 3px;
    font-size: 11px;
    color: #777;
}

.gallery-title {
    font-family: 'gps didot', serif;
    font-weight: 500;
    font-size: 40px;
}

.gallery-card {
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    text-align: center;
}

.gallery-card img {
    width: 100%;
    height: 350px;
    object-fit: cover;
}

.gallery-card span {
    display: block;
    padding: 12px;
    font-size: 16px;
    font-weight: 500;
    text-align: left;
}

/* VIDEO SECTION */
.baraf-video-section {
    position: relative;
    width: 100%;
    height: 70vh;
    overflow: hidden;
}

.baraf-video-section video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover;
}

/* Dark overlay */
.baraf-video-section::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1;
}

/* Overlay content */
.video-overlay-content {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    font-family: 'gps didot', serif;
}

.video-tag {
    font-size: 12px;
    letter-spacing: 2px;
    border-bottom: 2px solid #FA0453;
    margin-bottom: 12px;
}

.video-overlay-content h2 {
    font-size: 42px;
    font-weight: 600;
}

.video-overlay-content p {
    font-size: 16px;
    opacity: 0.9;
}


/* SECTION */
.blog-section {
    padding: 80px 0;
}

/* BLOG TAG */
.blog-tag {
    font-family: 'raleway', sans-serif;
    font-size: 14px;
    letter-spacing: 1px;
    color: #000;
    border-bottom: 2px solid #FA0453;
    border-top: 2px solid #FA0453;
    display: inline-block;
    margin-bottom: 10px;
}

/* TITLE */
.blog-title {
    font-size: 36px;
    font-weight: 500;
    font-family: 'gps didot', serif;
}

/* BLOG CARD */
.blog-card {
    border-radius: 16px;
    font-family: 'gps didot', serif;
    overflow: hidden;
    border: 1px solid #FA0453;
    transition: 0.3s ease;
    background: #fff;
}

.blog-card:hover {
    box-shadow: 0 12px 30px rgba(250, 4, 83, 0.15);
    transform: translateY(-5px);
}

/* IMAGE */
.blog-img img {
    width: 100%;
    height: auto;
    display: block;
}

/* CONTENT */
.blog-content {
    padding: 22px;
}

.blog-meta {
    font-size: 13px;
    font-weight: 600;
    color: #000;
    margin-bottom: 8px;
}

.blog-meta span {
    margin-left: 20px;
    font-weight: 400;
}

.blog-name {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
}

.blog-desc {
    font-size: 14px;
    line-height: 1.6;
    color: #555;
}

.read-more {
    font-size: 14px;
    font-weight: 500;
    color: #000;
    text-decoration: none;
}

.read-more:hover {
    text-decoration: underline;
}

/* RESERVATION SECTION */
.reservation-section {
    background: url('assets/reservation.png') center/cover no-repeat;
    position: relative;
    padding: 70px 0;
    color: #fff;
}

.reservation-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
}

.reservation-content {
    position: relative;
    z-index: 2;
}

.reservation-label {
    font-size: 13px;
    letter-spacing: 2px;
    opacity: 0.9;
}

.reservation-title {
    font-size: 40px;
    font-weight: 600;
    margin: 10px 0;
}

.reservation-desc {
    font-size: 16px;
    max-width: 520px;
    margin-bottom: 25px;
}

.btn-reserve {
    background: transparent;
    color: #FFE600;
    border-radius: 4px;
    padding: 10px 22px;
    font-weight: 500;
    border: 1px solid #FFB10B;
}

.btn-link-custom {
    color: #fff;
    text-decoration: underline;
    margin-left: 25px;
    font-weight: 500;
}

/* INSTAGRAM SECTION */
.instagram-section {
    padding: 70px 0;
}

.instagram-handle {
    font-size: 32px;
    font-weight: 500;
    margin-bottom: 40px;
    font-family: 'gps didot', serif;
}

.instagram-grid img {
    width: 100%;
    border-radius: 6px;
    transition: 0.3s ease;
}

.instagram-grid img:hover {
    transform: scale(1.05);
}

/* FOOTER */
.baraf-footer {
    background: #267287;
    color: #ccc;
    padding: 70px 0 50px;
}

.footer-logo {
    max-width: 150px;
    height: auto;
}

.footer-title {
    font-size: 16px;
    margin-bottom: 15px;
    color: #fff;
}

.footer-text {
    font-size: 14px;
    line-height: 1.7;
    color: #fff;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 8px;
}

.footer-links a {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    transition: 0.3s;
}

.footer-links a:hover {
    color: #FA0453;
}

/* BOTTOM FOOTER */
.baraf-bottom-footer {
    background: #144451;
    color: #fff;
    font-size: 13px;
    padding: 15px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

/* GLOBAL SCROLL ANIMATION */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s ease;
}

.reveal.show {
    opacity: 1;
    transform: translateY(0);
}

.reveal-left {
    transform: translateX(-50px);
}

.reveal-right {
    transform: translateX(50px);
}

.reveal-left.show,
.reveal-right.show {
    transform: translateX(0);
}