/* ETS Tech — page-specific styles for "Du An Tieu Bieu" */

.dat-hero { padding:120px 48px 40px; text-align:center; }
.dat-hero-inner { max-width:820px; margin:0 auto; }
.hero-badge-dat { display:inline-flex; align-items:center; gap:9px; padding:9px 18px; border-radius:999px; background:rgba(255,255,255,.6); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border:1px solid rgba(255,255,255,.55); box-shadow:0 6px 22px rgba(15,84,112,.08); color:#0f5470; font-size:13px; font-weight:600; letter-spacing:.4px; margin-bottom:26px; }
.dat-hero-title { font-size:60px; line-height:1.06; font-weight:700; letter-spacing:-1.5px; margin-bottom:20px; }
.dat-hero-subtitle { font-size:18.5px; line-height:1.68; color:#4a5568; max-width:640px; margin:0 auto; }
.featured-section { padding:20px 48px 40px; }
.container { max-width:1200px; margin:0 auto; }
.featured-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:36px; }
.featured-title { font-size:36px; margin:12px 0 0; letter-spacing:-.6px; }
.featured-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:26px; }
.featured-grid > .project-tile { flex:0 0 calc((100% - 52px) / 3); width:calc((100% - 52px) / 3); max-width:calc((100% - 52px) / 3); }
.featured-grid > .empty-note { flex:0 0 100%; width:100%; max-width:100%; }
.project-tile { grid-column:span 1; min-width:0; display:flex; flex-direction:column; border-radius:26px; overflow:hidden; border:1px solid rgba(255,255,255,.6); box-shadow:0 20px 60px rgba(15,84,112,.12); background:rgba(255,255,255,.62); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); opacity:0; transform:translateY(24px); transition:transform .3s ease, box-shadow .3s ease, opacity .6s ease; }
.project-tile-media { aspect-ratio:16/10; background:repeating-linear-gradient(45deg,rgba(15,84,112,.08),rgba(15,84,112,.08) 12px,rgba(46,184,235,.1) 12px,rgba(46,184,235,.1) 24px); display:flex; align-items:center; justify-content:center; }
.project-tile-body { padding:24px 26px 26px; }
.project-tile-tag { font-family:'Space Grotesk',sans-serif; font-size:12px; letter-spacing:1.5px; color:#2eb8eb; font-weight:600; }
.project-tile-title { font-size:22px; line-height:1.28; margin:10px 0 8px; letter-spacing:-.3px; }
.project-tile-desc { font-size:14.5px; line-height:1.6; margin:0; }
.industries-section { padding:70px 48px 100px; }
.ind-head { text-align:center; margin-bottom:48px; }
.ind-title { font-size:38px; margin:14px 0 12px; letter-spacing:-.6px; }
.ind-lead { font-size:16.5px; max-width:560px; margin:0 auto; }
.ind-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; }
.ind-grid > .ind-card { flex:0 0 calc((100% - 60px) / 4); width:calc((100% - 60px) / 4); max-width:calc((100% - 60px) / 4); }
.ind-card { text-decoration:none; padding:34px 22px; border-radius:22px; background:rgba(255,255,255,.62); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); border:1px solid rgba(255,255,255,.6); box-shadow:0 12px 36px rgba(15,84,112,.08); display:flex; flex-direction:column; align-items:center; text-align:center; gap:16px; }
.ind-icon { width:56px; height:56px; border-radius:18px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#0f5470,#2eb8eb); box-shadow:0 8px 20px rgba(46,184,235,.3); }
.ind-title-sm { font-size:16px; line-height:1.3; }
.ind-link { font-size:12.5px; color:#2eb8eb; font-weight:600; letter-spacing:.3px; }
@media (max-width:1024px) {
  [data-sec] { padding-left:60px; padding-right:60px; padding-top:72px; padding-bottom:72px; }
  [data-hero] { padding-top:112px; padding-bottom:56px; }
  [data-feat-grid] > .project-tile { flex-basis:calc((100% - 26px) / 2) !important; width:calc((100% - 26px) / 2) !important; max-width:calc((100% - 26px) / 2) !important; }
  [data-feat-grid] [data-feat=first] { flex-basis:100% !important; width:100% !important; max-width:100% !important; }
  [data-ind-grid] > .ind-card { flex-basis:calc((100% - 40px) / 3) !important; width:calc((100% - 40px) / 3) !important; max-width:calc((100% - 40px) / 3) !important; }
  [data-footer-grid] { grid-template-columns:1fr 1fr !important; }
  [data-hero-h] { font-size:52px !important; }
}
@media (max-width:767px) {
  [data-sec] { padding-left:20px !important; padding-right:20px !important; padding-top:48px !important; padding-bottom:48px !important; }
  [data-hero] { padding-top:96px !important; padding-bottom:40px !important; }
  [data-hero-h] { font-size:38px !important; letter-spacing:-.5px !important; }
  [data-h2] { font-size:27px !important; }
  [data-feat-grid] > .project-tile { flex-basis:100% !important; width:100% !important; max-width:100% !important; }
  [data-feat-grid] [data-feat=first] { flex-basis:100% !important; width:100% !important; max-width:100% !important; }
  [data-ind-grid] { gap:14px !important; }
  [data-ind-grid] > .ind-card { flex-basis:calc((100% - 14px) / 2) !important; width:calc((100% - 14px) / 2) !important; max-width:calc((100% - 14px) / 2) !important; }
  [data-footer-grid] { grid-template-columns:1fr !important; gap:32px !important; }
}
