/*
Theme Name: Bắc Phượng Sơn
Description: Giao diện tối ưu cho Gang thép Bắc Phượng Sơn
Author: Bắc Phượng Sơn
Template: flatsome
Version: 4.0.0
*/
:root{--bps-red:#b5121b;--bps-red-dark:#850c13;--bps-ink:#17212b;--bps-slate:#56616d;--bps-soft:#f4f6f8;--bps-line:#e3e7eb;--bps-radius:14px;--bps-shadow:0 12px 32px rgba(23,33,43,.10)}
html{scroll-behavior:smooth}body{color:var(--bps-slate);font-family:Roboto,Arial,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{color:var(--bps-ink);font-weight:700;letter-spacing:-.02em;line-height:1.3;text-transform:none}a{transition:color .2s ease,background-color .2s ease,transform .2s ease,box-shadow .2s ease}
#header .header-main{background:rgba(255,255,255,.98)}#header .header-main .header-inner{min-height:88px}#header .header-bottom{background:var(--bps-ink);border:0;box-shadow:0 7px 24px rgba(23,33,43,.16)}
#header .header-bottom-nav>li>a{color:rgba(255,255,255,.88);min-height:54px}#header .header-bottom-nav>li>a:hover,#header .header-bottom-nav>li.active>a{color:#fff}
#header .header-bottom-nav>li.active>a:after{background:var(--bps-red);bottom:0;content:'';height:3px;left:12px;position:absolute;right:12px}#header .logo img{object-fit:contain}
#header .button.alert{background:var(--bps-red);border:0;border-radius:999px;box-shadow:0 6px 18px rgba(181,18,27,.22);min-height:40px;padding:0 17px}#header .button.alert:hover{background:var(--bps-red-dark);transform:translateY(-2px)}
.banner{overflow:hidden}.banner .bg{transform:scale(1.001);transition:transform 1s ease}.banner:hover .bg{transform:scale(1.025)}.section{padding-left:15px;padding-right:15px}.section-title-container{margin-bottom:28px}
.section-title{border:0;color:var(--bps-ink);font-size:25px;letter-spacing:-.015em;text-transform:none}.section-title b{display:none}.section-title span{border:0;margin:0;padding:0 0 12px;position:relative}.section-title span:after{background:var(--bps-red);border-radius:3px;bottom:0;content:'';height:4px;left:0;position:absolute;width:54px}.section-title-center span:after{left:50%;transform:translateX(-50%)}
.banner.has-hover{border-radius:var(--bps-radius);box-shadow:0 5px 18px rgba(23,33,43,.08);transition:transform .25s ease,box-shadow .25s ease}.banner.has-hover:hover{box-shadow:var(--bps-shadow);transform:translateY(-5px)}.banner.has-hover h2{font-size:17px;letter-spacing:0;text-shadow:0 2px 8px rgba(0,0,0,.35)}
.box,.product-small,.post-item .col-inner{background:#fff;border:1px solid var(--bps-line);border-radius:var(--bps-radius);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}.box:hover,.product-small:hover,.post-item .col-inner:hover{box-shadow:var(--bps-shadow);transform:translateY(-4px)}
input[type=text],input[type=email],input[type=tel],textarea,select{background:#fff;border:1px solid #d8dde2;border-radius:8px;box-shadow:none;min-height:46px}input:focus,textarea:focus,select:focus{border-color:var(--bps-red);box-shadow:0 0 0 3px rgba(181,18,27,.10)}
.button,button,input[type=submit]{border-radius:8px;font-weight:700}.button.alert,input[type=submit]{background-color:var(--bps-red)}.button.alert:hover,input[type=submit]:hover{background-color:var(--bps-red-dark)}
#footer,.footer-wrapper{background:var(--bps-ink)}.footer-wrapper h3{color:#fff;font-size:18px}.footer-wrapper,.footer-wrapper p,.footer-wrapper li,.footer-wrapper a{color:rgba(255,255,255,.74)}.footer-wrapper a:hover{color:#fff}:focus-visible{outline:3px solid rgba(181,18,27,.45);outline-offset:3px}
@media(max-width:849px){#header .header-main .header-inner{min-height:68px}#header .logo img{max-height:58px}.section{padding-left:8px;padding-right:8px}.section-title{font-size:20px}.section-title-container{margin-bottom:20px}.banner.has-hover{border-radius:10px}.banner.has-hover h2{font-size:17px!important;line-height:1.25}.footer-wrapper{text-align:left}}
@media(max-width:549px){body{font-size:15px}h1{font-size:25px!important}h2{font-size:21px!important}.section-title{font-size:19px!important}.row{margin-left:-7px;margin-right:-7px}.col{padding-left:7px;padding-right:7px}.button.expand{width:100%}.post-item{padding-bottom:18px}}

/* Header color hierarchy and prominent product catalogue */
#header .header-main{background:linear-gradient(180deg,#fff 0%,#f8fafb 100%);border-bottom:1px solid #e7eaee}
#header .header-main .nav>li>a{color:#34414e}
#header .header-main .nav>li>a:hover{color:var(--bps-red)}
#header .header-bottom{background:linear-gradient(90deg,#980c15 0%,#c8101e 52%,#980c15 100%)}
#header .header-bottom .header-bottom-nav.nav-center>li>a{padding-left:13px;padding-right:13px}
#mega-menu-wrap{position:relative;width:245px}
#mega-menu-title{align-items:center;background:linear-gradient(135deg,#8f0911 0%,#70070d 100%);border-radius:9px 9px 0 0;box-shadow:0 8px 20px rgba(94,5,10,.3);color:#fff;cursor:pointer;display:flex;height:54px;padding:0 20px;transition:background .2s ease,box-shadow .2s ease,transform .2s ease}
#mega-menu-title .icon-menu{font-size:19px;margin-right:11px}
#mega-menu-title:after{border-bottom:2px solid #fff;border-right:2px solid #fff;content:'';height:7px;margin-left:auto;opacity:.9;transform:rotate(45deg) translateY(-2px);width:7px}
#mega-menu-wrap:hover #mega-menu-title{background:linear-gradient(135deg,#a90d17 0%,#7d080f 100%);box-shadow:0 10px 26px rgba(94,5,10,.4);transform:translateY(-1px)}
#mega-menu-wrap{background:transparent!important}
#mega_menu{border:0;border-radius:0 0 10px 10px;box-shadow:0 18px 36px rgba(17,28,39,.18);overflow:visible}
#mega_menu>li>a{border-bottom:1px solid #edf0f2;color:#34414e;padding:12px 17px}
#mega_menu>li:last-child>a{border-bottom:0}
#mega_menu>li:hover>a{background:#fff3f3;color:var(--bps-red);padding-left:22px}
#mega_menu .sub-menu{border:0;border-left:3px solid var(--bps-red);box-shadow:0 14px 32px rgba(17,28,39,.16)}
@media(max-width:849px){#header .header-main{background:#fff}#mega-menu-wrap{width:100%}}

/* Balanced single-line desktop header */
@media(min-width:850px){
  #header .header-main .header-inner{min-height:92px}
  #header .header-main .logo img{max-height:78px;width:auto}
  #header .header-main .search-form-categories{display:none}
  #header .header-main li.header-search-form{flex:0 0 300px;max-width:300px;width:300px}
  #header .header-main .searchform-wrapper{width:100%}
  #header .header-main .searchform{background:#fff;border:1px solid #dce2e7;border-radius:10px;box-shadow:0 8px 24px rgba(17,28,39,.08);overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
  #header .header-main .searchform:focus-within{border-color:#c91721;box-shadow:0 10px 28px rgba(181,18,27,.14);transform:translateY(-1px)}
  #header .header-main .searchform input{background:transparent;border:0;box-shadow:none;color:#17212b;font-size:14px;min-height:46px;padding-left:18px}
  #header .header-main .searchform input::placeholder{color:#8b949d}
  #header .header-main .searchform .flex-col:last-of-type{margin-left:0}
  #header .header-main .searchform .button{background:linear-gradient(135deg,#d11823,#a70d16);border:0;border-radius:8px!important;color:#fff!important;height:38px;margin-right:4px;min-height:38px;width:42px}
  #header .header-main .searchform .button i{color:#fff!important}
  #header .header-main .searchform .button:hover{background:linear-gradient(135deg,#e51b27,#b5121b);box-shadow:0 5px 14px rgba(181,18,27,.25)}
  #header .header-main .header-button{margin:0}
  #header .header-main .header-button .button{align-items:center;border-radius:9px!important;box-shadow:none;display:grid;gap:0 10px;grid-template-columns:26px auto;grid-template-rows:auto auto;margin:0;min-height:52px;padding:7px 17px;text-align:left}
  #header .header-main .header-button .button:before{content:'\e600';font-family:'fl-icons';font-size:19px;grid-row:1/3}
  #header .header-main .header-button .button span{font-size:14px;grid-column:2;line-height:1.1}
  #header .header-main .header-button .button span:before{display:block;font-size:9px;font-weight:500;letter-spacing:.09em;margin-bottom:4px;opacity:.78;text-transform:uppercase}
  #header .header-main .header-button-1 .button{background:linear-gradient(135deg,#d11823,#a70d16);border:1px solid #b5121b;color:#fff;box-shadow:0 8px 20px rgba(181,18,27,.2)}
  #header .header-main .header-button-1 .button span:before{content:'Hotline tư vấn'}
  #header .header-main .header-button-2 .button{background:#fff;border:1px solid #d9dfe4;color:#a70d16;box-shadow:0 8px 20px rgba(17,28,39,.07)}
  #header .header-main .header-button-2 .button span:before{content:'Kinh doanh'}
  #header .header-main .header-button .button:hover{background:#17212b;border-color:#17212b;color:#fff;transform:translateY(-2px)}
  #header .header-bottom .header-inner{align-items:center;display:grid;gap:24px;grid-template-columns:245px minmax(0,1fr);height:64px;min-height:64px}
  #header .header-bottom-nav.nav-left{align-items:center;display:flex;height:64px;justify-content:flex-start;margin:0;position:static;width:245px}
  #header .header-bottom-nav.nav-center{align-items:center;display:flex;flex-wrap:nowrap;height:64px;justify-content:flex-start;margin:0;max-width:none;position:static;transform:none;width:100%}
  #header .header-bottom-nav.nav-center>li{flex:0 0 auto;margin:0 5px}
  #header .header-bottom-nav.nav-center>li>a{font-size:14px;min-height:64px;padding:10px 7px;white-space:nowrap}
  #header .header-bottom-nav.nav-right{display:none}
  #mega-menu-title{border-radius:7px;height:52px;padding:0 18px;width:245px}
  #mega-menu-wrap{height:52px;width:245px}
  #header .header-bottom-nav>li.active>a:after{bottom:0;left:7px;right:7px}
  #header .stuck .header-main,#header.stuck .header-main{height:82px!important}
  #header .stuck .header-main .header-inner,#header.stuck .header-main .header-inner{height:82px!important;min-height:82px!important}
  #header .stuck .header-main .logo,#header.stuck .header-main .logo{align-items:center;display:flex;height:72px!important;margin-bottom:0!important;margin-top:0!important}
  #header .stuck .header-main .logo a,#header.stuck .header-main .logo a{align-items:center;display:flex;height:72px;justify-content:flex-start}
  #header .stuck .header-main .logo img,#header.stuck .header-main .logo img{display:block!important;margin:0!important;max-height:62px!important;transform:none!important;width:auto!important}
}
@media(min-width:850px) and (max-width:1099px){
  #header .header-bottom .header-inner{gap:14px;grid-template-columns:220px minmax(0,1fr)}
  #mega-menu-wrap,#mega-menu-title,#header .header-bottom-nav.nav-left{width:220px}
  #header .header-bottom-nav.nav-center>li{margin:0 2px}
  #header .header-bottom-nav.nav-center>li>a{font-size:12.5px;padding-left:4px;padding-right:4px}
}

/* Marketing homepage v2 */
.home #main{background:#fff}.home .page-wrapper{padding-top:0}.bps-marketing-hero{background-color:#17212b;background-image:url('/wp-content/uploads/2026/07/bps-hero-industrial-v2.png');background-position:center;background-size:cover;color:#fff;isolation:isolate;min-height:620px;overflow:hidden;position:relative}.bps-hero-shade{background:linear-gradient(90deg,rgba(10,18,26,.94) 0%,rgba(10,18,26,.82) 34%,rgba(10,18,26,.25) 66%,rgba(10,18,26,.08) 100%);inset:0;position:absolute;z-index:-1}.bps-hero-inner{margin:0 auto;max-width:1080px;padding:105px 15px 90px}.bps-eyebrow{color:#ffcb52;font-size:13px;font-weight:700;letter-spacing:.16em;margin:0 0 18px;text-transform:uppercase}.bps-marketing-hero h1{color:#fff;font-size:58px!important;letter-spacing:-.035em;line-height:1.08;margin:0 0 22px;max-width:690px;text-shadow:0 5px 24px rgba(0,0,0,.24)}.bps-hero-copy{color:rgba(255,255,255,.82);font-size:19px;line-height:1.65;margin:0 0 32px;max-width:610px}.bps-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:27px}.bps-btn{align-items:center;border:1px solid transparent;border-radius:8px;display:inline-flex;font-size:15px;font-weight:700;gap:9px;justify-content:center;min-height:52px;padding:0 24px}.bps-btn-primary{background:#d11823;color:#fff;box-shadow:0 12px 26px rgba(209,24,35,.32)}.bps-btn-primary:hover{background:#eb1d2a;color:#fff;transform:translateY(-2px)}.bps-btn-ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.38);color:#fff;backdrop-filter:blur(8px)}.bps-btn-ghost:hover{background:#fff;color:#17212b}.bps-hero-points{display:flex;flex-wrap:wrap;gap:21px;color:rgba(255,255,255,.72);font-size:13px}.bps-hero-points span::first-letter{color:#ffcb52}.bps-proof{background:#fff;border-bottom:1px solid #e8ebee;box-shadow:0 12px 36px rgba(17,28,39,.07);position:relative;z-index:3}.bps-proof-grid{display:grid;grid-template-columns:repeat(4,1fr);margin:0 auto;max-width:1080px;padding:27px 15px}.bps-proof-grid>div{border-right:1px solid #e2e6e9;padding:2px 28px}.bps-proof-grid>div:first-child{padding-left:0}.bps-proof-grid>div:last-child{border:0;padding-right:0}.bps-proof strong,.bps-proof span{display:block}.bps-proof strong{color:#17212b;font-size:15px;margin-bottom:3px}.bps-proof span{color:#7a838c;font-size:12px}.bps-legacy-home>.section{padding-bottom:70px;padding-top:70px}.bps-legacy-home .box1{border:0!important;border-radius:12px;box-shadow:0 8px 28px rgba(17,28,39,.08)!important;padding:22px 12px;transition:transform .25s ease,box-shadow .25s ease}.bps-legacy-home .box1:hover{box-shadow:0 18px 38px rgba(17,28,39,.13)!important;transform:translateY(-5px)}.bps-catalogue{background:#f3f5f7!important}.bps-catalogue .banner{border:0;border-radius:12px;box-shadow:0 8px 26px rgba(17,28,39,.1)}.bps-catalogue .banner .bg{transition:transform .5s ease}.bps-catalogue .banner:hover .bg{transform:scale(1.06)}.bps-catalogue .text-box{bottom:0!important}.bps-catalogue .text-box-content{background:linear-gradient(180deg,rgba(255,255,255,.94),#fff)!important;border-top:3px solid #d11823;padding:17px 14px!important}.bps-catalogue .text-box h2{font-size:16px!important;margin:0}.bps-lead{background:linear-gradient(135deg,#fff 0%,#f4f6f8 100%)}.bps-lead .row{background:#fff;border:1px solid #e5e8eb;border-radius:18px;box-shadow:0 18px 50px rgba(17,28,39,.09);overflow:hidden;padding:42px 28px}.bps-lead h2,.bps-lead h3{color:#17212b!important;text-align:left!important}.bps-lead input[type=submit]{min-height:50px;width:100%}.bps-lead+.section{background:linear-gradient(135deg,#9d0c14,#d11823)!important;padding-bottom:34px;padding-top:34px}.bps-lead+.section .button{background:#fff!important;border-color:#fff!important;color:#a60d16!important}.bps-legacy-home .post-item .col-inner{height:100%}.bps-legacy-home .post-item .box-text{padding:20px}.bps-legacy-home .post-item .post-title{color:#17212b;font-size:17px;line-height:1.45}.bps-legacy-home .post-item .from_the_blog_excerpt{color:#68737e;font-size:14px}.home .footer-wrapper{border-top:4px solid #d11823}
@media(max-width:849px){.bps-marketing-hero{background-position:62% center;min-height:560px}.bps-hero-shade{background:linear-gradient(90deg,rgba(10,18,26,.96),rgba(10,18,26,.78) 70%,rgba(10,18,26,.35))}.bps-hero-inner{padding:80px 22px 65px}.bps-marketing-hero h1{font-size:42px!important;max-width:530px}.bps-hero-copy{font-size:17px;max-width:520px}.bps-proof-grid{grid-template-columns:repeat(2,1fr);row-gap:22px}.bps-proof-grid>div{border-right:0;padding:0 18px!important}.bps-legacy-home>.section{padding-bottom:50px;padding-top:50px}.bps-lead .row{padding:28px 12px}}
@media(max-width:549px){.bps-marketing-hero{background-position:68% center;min-height:590px}.bps-hero-shade{background:linear-gradient(90deg,rgba(9,16,23,.97) 0%,rgba(9,16,23,.84) 75%,rgba(9,16,23,.55) 100%)}.bps-hero-inner{padding:70px 20px 50px}.bps-eyebrow{font-size:11px;letter-spacing:.12em}.bps-marketing-hero h1{font-size:35px!important}.bps-hero-copy{font-size:16px;line-height:1.55}.bps-hero-actions{display:grid}.bps-btn{width:100%}.bps-hero-points{display:grid;gap:7px}.bps-proof-grid{padding:22px 14px}.bps-proof strong{font-size:13px}.bps-proof span{font-size:11px}.bps-legacy-home>.section:has(.box1){display:none}.bps-catalogue .col{flex-basis:50%!important;max-width:50%!important}.bps-catalogue .banner{height:245px!important}.bps-catalogue .text-box h2{font-size:13px!important;line-height:1.3}.bps-catalogue .text-box-content{padding:13px 8px!important}.bps-lead .row{border-radius:12px}.bps-legacy-home>.section{padding-bottom:42px;padding-top:42px}.bps-legacy-home .post-item{flex-basis:50%;max-width:50%}.bps-legacy-home .post-item:nth-of-type(n+3){display:none}.bps-legacy-home .post-item .box-text{padding:14px}.bps-legacy-home .post-item .post-title{font-size:14px}}
