/* Theme Name: brandingvn.com */

body { font-family: "Roboto", sans-serif; }
a { text-decoration: none; }
a:hover { opacity: 0.95; }
.text-truncate2{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}


.font-script { font-family: 'Dancing Script', cursive; }

/* ---------- Scroll progress bar (pure CSS scroll-driven animation) ---------- */
.scroll-progress{
position:fixed;
top:0; left:0;
height:3px;
width:100%;
background:#a41e22;
transform-origin:left;
transform:scaleX(0);
z-index:2000;
animation: grow-progress auto linear;
animation-timeline: scroll(root);
}
@keyframes grow-progress{ from{transform:scaleX(0);} to{transform:scaleX(1);} }

/* ---------- Navbar / glassmorphism ---------- */
.site-header{
position:sticky;
top:0;
z-index:1000;
background:#fff;
backdrop-filter:blur(14px) saturate(160%);
-webkit-backdrop-filter:blur(14px) saturate(160%);
border-bottom:1px solid rgba(0,0,0,0.045);
}
.brand-logo{
	font-weight:900;
	font-size:2rem;
	color:#a41e22;
}
.nav-link-custom{
color:#33404a;
font-weight:500;
font-size:0.96rem;
position:relative;
padding:0.4rem 0 !important;
margin:0 1.1rem;
transition:color .25s ease;
}
.nav-link-custom:hover{color:#a41e22;}
.nav-link-custom.active{color:#20303d; font-weight:600;}
.nav-link-custom.active::after{
	content:"";
	position:absolute;
	left:0; right:0; bottom:3px;
	height:2px;
	background:#a41e22;
	border-radius:2px;
}
.btn-reserve{
background:#a41e22;
color:#fff;
border-radius:50px;
padding:0.6rem 1.35rem;
font-weight:600;
font-size:0.92rem;
display:inline-flex;
align-items:center;
gap:0.55rem;
border:none;
white-space:nowrap;
background-size:200% 100%;
background-image:linear-gradient(100deg,#a41e22 0%,#a41e22 45%,#c93a3e 55%,#a41e22 100%);
transition:background-position .6s ease, transform .25s ease, box-shadow .25s ease;
box-shadow:0 6px 16px rgba(164,30,34,0.0);
}
.btn-reserve:hover{
background-position:-100% 0;
color:#fff;
transform:translateY(-2px);
box-shadow:0 10px 22px rgba(164,30,34,0.28);
}
.btn-reserve i{font-size:0.95rem;}



 /* ---------- Footer ---------- */
  .sf-footer-wave{
    position:relative;
    height:90px;
    margin-top:60px;
  }
  .sf-footer-wave svg{position:absolute; bottom:0; width:100%; height:100%;}
  .sf-footer{
    background:#eef4f7;
    padding:10px 0 20px;
  }
  .sf-footer-logo{
    font-family:'Noto Serif', serif;
    font-weight:800;
    color:#8a2035;
    font-size:1.35rem;
  }
  .sf-footer p.sf-tag{
    color:#7c8a94;
    font-size:.9rem;
    margin:14px 0 18px;
    line-height:1.6;
  }
  .sf-social a{
    width:36px;height:36px;
    border-radius:50%;
    background:#1c2947;
    color:#fff;
    display:inline-flex;align-items:center;justify-content:center;
    margin-right:10px;
    transition:background .3s ease, transform .3s ease;
    text-decoration:none;
  }
  .sf-social a:hover{background:#8a2035; transform:translateY(-3px);}
  .sf-footer h5{
    color:#1c2947;
    font-weight:700;
    font-size:.92rem;
    letter-spacing:.6px;
    margin-bottom:20px;
  }
  .sf-footer ul{list-style:none; padding:0; margin:0;}
  .sf-footer ul li{margin-bottom:12px;}
  .sf-footer ul li a{
    color:#5f6e78;
    text-decoration:none;
    font-size:.92rem;
    transition:color .25s ease, padding-left .25s ease;
  }
  .sf-footer ul li a:hover{color:#8a2035; padding-left:4px;}
  .sf-contact-item{
    display:flex; gap:12px; margin-bottom:14px; align-items:flex-start;
  }
  .sf-contact-item i{
    color:#8a2035; margin-top:3px; width:16px;
  }
  .sf-contact-item span{color:#5f6e78; font-size:.92rem; line-height:1.5;}
  .sf-copyright{
    text-align:center;
    padding-top:24px;
    margin-top:10px;
    border-top:1px solid rgba(28,41,71,.08);
    color:#8896a0;
    font-size:.85rem;
  }

  @media (max-width: 991px){
    .sf-hero h1{font-size:2.3rem;}
    .sf-hero-visual{margin-top:40px; min-height:340px;}
    .sf-hero-img-wrap{width:300px;height:300px;}
    .sf-blob{width:380px;height:380px;}
    .sf-cta{padding:30px 26px;}
  }