/*
Theme Name: NX Pool & Lighting
Theme URI: https://greenwave.vn
Author: Cong ty TNHH Cong nghe Nuoc Xanh
Description: Theme WordPress cho NX Pool & Lighting - thiet bi be boi va chieu sang cong trinh. Dung cung WooCommerce, ACF, Fluent Forms, Max Mega Menu, Rank Math theo tai lieu ke hoach trien khai di kem.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: nxpl
*/

:root{
  --nxpl-primary: #0B5FA5;
  --nxpl-primary-dark: #073B68;
  --nxpl-accent: #F2B84B;
  --nxpl-text: #16324A;
  --nxpl-muted: #55707F;
  --nxpl-bg: #FFFFFF;
  --nxpl-bg-alt: #F5F8FA;
  --nxpl-line: #DCE6EC;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--nxpl-bg);
  color:var(--nxpl-text);
  font-family:'Inter', sans-serif;
  font-size:16px;
  line-height:1.65;
}
h1,h2,h3,h4{
  font-family:'Be Vietnam Pro', sans-serif;
  margin:0 0 .5em;
  color:var(--nxpl-text);
  line-height:1.2;
}
a{color:var(--nxpl-primary); text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%; height:auto; display:block;}
.nxpl-wrap{max-width:1180px; margin:0 auto; padding:0 24px;}
section{padding:72px 0;}
@media (max-width:720px){ section{padding:48px 0;} .nxpl-wrap{padding:0 18px;} }

/* Buttons */
.nxpl-btn{
  display:inline-block;
  padding:13px 24px;
  font-weight:600;
  font-size:15px;
  border:1px solid transparent;
  cursor:pointer;
  border-radius:2px;
}
.nxpl-btn-primary{background:var(--nxpl-accent); color:var(--nxpl-primary-dark);}
.nxpl-btn-primary:hover{background:#e0a83a; text-decoration:none;}
.nxpl-btn-outline{border-color:var(--nxpl-btn2-border, #fff); color:var(--nxpl-btn2-text, #fff);}
.nxpl-btn-outline:hover{background:rgba(255,255,255,.12); text-decoration:none;}
.nxpl-btn-solid{background:var(--nxpl-primary); color:#fff;}
.nxpl-btn-solid:hover{background:var(--nxpl-primary-dark); color:#fff; text-decoration:none;}

/* Header */
.nxpl-header{
  position:static;
  background:var(--nxpl-header-bg, #fff);
  border-bottom:1px solid var(--nxpl-line);
}
.nxpl-header-inner{
  max-width:1600px; margin:0 auto; padding:6px 40px;
  display:flex; align-items:center; justify-content:space-between; gap:32px;
}
.nxpl-logo{display:flex; align-items:center; gap:10px; font-family:'Be Vietnam Pro',sans-serif; font-weight:700; font-size:19px; color:var(--nxpl-primary-dark); white-space:nowrap;}
.nxpl-logo img{max-height:32px; width:auto;}
.nxpl-primary-menu{display:flex; gap:28px; list-style:none; margin:0; padding:0; font-size:15px; font-weight:500; flex-wrap:nowrap;}
.nxpl-primary-menu li{position:relative; white-space:nowrap;}
.nxpl-primary-menu a{color:var(--nxpl-nav-text, #16324A); display:block; padding:8px 0; white-space:nowrap;}
.nxpl-primary-menu li.menu-item-has-children > a::after{content:"\25BE"; display:inline-block; margin-left:6px; font-size:16px; position:relative; top:2px;}
.nxpl-primary-menu li:hover > a{color:var(--nxpl-primary);}
.nxpl-primary-menu ul{
  list-style:none; margin:0; padding:8px 0;
  position:absolute; top:100%; left:0; min-width:220px;
  background:#fff; border:1px solid var(--nxpl-line); box-shadow:0 8px 24px rgba(11,95,165,.12);
  display:none;
}
.nxpl-primary-menu li:hover > ul{display:block;}
.nxpl-primary-menu ul ul{top:0; left:100%;}
.nxpl-primary-menu ul a{padding:8px 16px;}
.nxpl-header-cta{white-space:nowrap; background:var(--nxpl-cta-bg, var(--nxpl-primary)) !important; color:var(--nxpl-cta-text, #fff) !important;}
.nxpl-menu-toggle{display:none; background:none; border:1px solid var(--nxpl-line); padding:8px 12px; font-size:15px;}

  .nxpl-search-toggle{background:none; border:none; font-size:18px; cursor:pointer; padding:8px;}
  .nxpl-search-panel{display:none; border-top:1px solid var(--nxpl-line); background:#fff;}
  .nxpl-search-panel.is-open{display:block;}
  .nxpl-search-form{max-width:1180px; margin:0 auto; padding:14px 24px; display:flex; gap:10px;}
  .nxpl-search-form input{flex:1; border:1px solid var(--nxpl-line); padding:11px 14px; font-size:15px; font-family:'Inter',sans-serif;}
  .nxpl-search-form button{background:var(--nxpl-primary); color:#fff; border:none; padding:11px 22px; font-weight:600; cursor:pointer;}

@media (max-width:900px){
  .nxpl-primary-menu, .nxpl-header-cta{display:none;}
  .nxpl-menu-toggle{display:inline-block;}
  .nxpl-primary-menu.is-open{
    display:flex; flex-direction:column; gap:0;
    position:absolute; top:100%; left:0; right:0; background:#fff;
    border-top:1px solid var(--nxpl-line); padding:8px 24px 20px;
  }
  .nxpl-primary-menu.is-open ul{position:static; border:none; box-shadow:none; padding-left:14px; display:block;}
}

/* Hero */
.nxpl-hero{
  background:linear-gradient(180deg, var(--nxpl-primary-dark), var(--nxpl-primary));
  color:#fff;
  min-height:520px;
  display:flex;
  align-items:center;
}
.nxpl-hero .nxpl-wrap{max-width:100%; padding-left:64px; padding-right:64px;}
.nxpl-hero-inner{max-width:680px; margin:0; text-align:left;}
.nxpl-hero h1{color:var(--nxpl-hero-text, #fff); font-size:var(--nxpl-hero-title-size, clamp(28px,4.2vw,46px)); max-width:26ch; text-shadow:0 2px 12px rgba(0,0,0,.55);}
.nxpl-hero p{color:var(--nxpl-hero-text, #fff); font-size:var(--nxpl-hero-desc-size, 17px); max-width:48ch; margin-top:16px; text-shadow:0 2px 10px rgba(0,0,0,.55);}
.nxpl-hero-actions{display:flex; gap:14px; margin-top:28px; flex-wrap:wrap;}
.nxpl-hero-figure{position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.06); min-height:280px; height:100%;}
.nxpl-hero-figure img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.nxpl-hero-figure span{position:absolute; bottom:20px; left:20px; right:20px; z-index:1;}

/* Two business lines */
.nxpl-lines{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
@media (max-width:760px){ .nxpl-lines{grid-template-columns:1fr;} }
.nxpl-line-card{border:1px solid var(--nxpl-line); padding:28px;}
.nxpl-line-card.accent{border-top:4px solid var(--nxpl-accent);}
.nxpl-line-card.primary{border-top:4px solid var(--nxpl-primary);}
.nxpl-line-card h3{font-size:20px;}

/* Section head */
.nxpl-section-head{margin-bottom:36px; max-width:60ch;}
.nxpl-section-head p{color:var(--nxpl-muted);}

/* Grids reused for products/projects/posts */
.nxpl-card-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:880px){ .nxpl-card-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .nxpl-card-grid{grid-template-columns:1fr;} }
.nxpl-card{border:1px solid var(--nxpl-line); background:#fff;}
.nxpl-card-thumb{aspect-ratio:4/3; background:var(--nxpl-bg-alt); overflow:hidden;}
.nxpl-card-thumb img{width:100%; height:100%; object-fit:cover;}
.nxpl-card-body{padding:16px 18px;}
.nxpl-card-cat{font-size:12px; color:var(--nxpl-primary); font-weight:600; margin-bottom:4px;}
.nxpl-card-body h3{font-size:16px; margin-bottom:6px;}
.nxpl-card-body p{font-size:14px; color:var(--nxpl-muted); margin:0;}

/* Process */
.nxpl-process{background:var(--nxpl-bg-alt);}
.nxpl-steps{display:grid; grid-template-columns:repeat(6,1fr); gap:1px; background:var(--nxpl-line); border:1px solid var(--nxpl-line);}
@media (max-width:880px){ .nxpl-steps{grid-template-columns:repeat(2,1fr);} }
.nxpl-step{background:#fff; padding:20px 16px;}
.nxpl-step .num{font-weight:700; color:var(--nxpl-accent); font-family:'Be Vietnam Pro',sans-serif;}
.nxpl-step h4{font-size:14.5px; margin-top:8px;}

/* Contact */
.nxpl-contact-wrap{display:grid; grid-template-columns:.9fr 1.1fr; gap:48px;}
@media (max-width:820px){ .nxpl-contact-wrap{grid-template-columns:1fr;} }
.nxpl-contact-info .label{font-size:12.5px; font-weight:600; color:var(--nxpl-primary); display:block; margin-bottom:2px;}
.nxpl-contact-block{border-top:1px solid var(--nxpl-line); padding-top:14px; margin-top:14px;}
.nxpl-contact-block:first-child{border-top:none; padding-top:0; margin-top:0;}

/* Floating call / zalo */
.nxpl-float{
  position:fixed; right:18px; bottom:18px; z-index:200;
  display:flex; flex-direction:column; gap:10px;
}
.nxpl-float a{
  width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--nxpl-primary); color:#fff; font-size:13px; font-weight:700;
  box-shadow:0 6px 18px rgba(11,95,165,.35);
}
.nxpl-float a.zalo{background:#0068FF;}

/* Footer */
.nxpl-footer{background:var(--nxpl-primary-dark); color:#BFD6E8; padding:48px 0 24px;}
.nxpl-footer h4{color:#fff; font-size:15px; margin-bottom:14px;}
.nxpl-footer-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:32px; padding-bottom:28px; border-bottom:1px solid rgba(255,255,255,.15);}
@media (max-width:900px){ .nxpl-footer-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .nxpl-footer-grid{grid-template-columns:1fr;} }
.nxpl-footer-bottom{padding-top:18px; font-size:13px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;}
.nxpl-footer a{color:#BFD6E8;}

/* Breadcrumb */
.nxpl-breadcrumb{font-size:13.5px; color:var(--nxpl-muted); padding:18px 0 0;}

/* Generic page/single content */
.nxpl-content{padding:56px 0;}
.nxpl-content .entry-title{margin-bottom:18px;}
.nxpl-content .entry-content > * + *{margin-top:1em;}

/* Dong bo font & co chu cho toan bo noi dung soan bang khoi (Gutenberg) -
   ap dung cho ca trang thuong (entry-content) va khu vuc linh hoat o trang chu (#noi-dung-them) */
.entry-content, #noi-dung-them{
  font-family:'Inter', sans-serif;
  font-size:16px;
  line-height:1.7;
  color:var(--nxpl-text);
}
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6,
#noi-dung-them h1, #noi-dung-them h2, #noi-dung-them h3, #noi-dung-them h4, #noi-dung-them h5, #noi-dung-them h6{
  font-family:'Be Vietnam Pro', sans-serif;
  font-weight:700;
  color:var(--nxpl-primary-dark);
  line-height:1.25;
  margin-top:1.4em;
  margin-bottom:0.5em;
}
.entry-content h1, #noi-dung-them h1{font-size:32px;}
.entry-content h2, #noi-dung-them h2{font-size:26px;}
.entry-content h3, #noi-dung-them h3{font-size:20px;}
.entry-content h4, #noi-dung-them h4{font-size:17px;}
.entry-content p, .entry-content li, #noi-dung-them p, #noi-dung-them li{
  font-family:'Inter', sans-serif;
  font-size:16px;
  line-height:1.7;
}
.entry-content ul, .entry-content ol, #noi-dung-them ul, #noi-dung-them ol{padding-left:22px;}
.entry-content img, #noi-dung-them img{border-radius:0;}