/* DTAT V2 — editorial showroom direction */
:root{--v2-ivory:#f3f0e8;--v2-paper:#fbfaf6;--v2-ink:#142016;--v2-muted:#647066;--v2-deep:#102a17;--v2-deeper:#091c0e;--v2-green:#1a9410;--v2-line:rgba(20,32,22,.14);--v2-max:1320px}
html{scroll-behavior:smooth}body{background:var(--v2-ivory);color:var(--v2-ink);font-family:"Be Vietnam Pro",system-ui,sans-serif;font-weight:400;letter-spacing:-.025em;line-height:1.55}.wrap{max-width:var(--v2-max);padding-inline:48px}
header{background:rgba(243,240,232,.9);border-color:var(--v2-line);backdrop-filter:blur(24px) saturate(140%)}.nav{height:68px}.brand{font-size:25px;letter-spacing:-.08em;color:var(--v2-ink)}.links{gap:26px;font-size:12px;letter-spacing:.01em}.links a{position:relative}.links>a:not(.cta):after,.drop>a:after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:var(--v2-green);transition:right .25s}.links>a:hover:after,.drop>a:hover:after{right:0}.cta{padding:12px 18px;background:var(--v2-ink);font-weight:600}.cta:hover{background:var(--v2-green)}.drop-menu{top:34px;width:480px;border:0;background:var(--v2-paper);box-shadow:0 30px 80px rgba(8,27,12,.15);padding:18px}.drop-row{border-color:var(--v2-line)}
/* Hero: architectural editorial, no decorative circles */
.hero{min-height:calc(100svh - 68px);background:var(--v2-ivory);color:var(--v2-ink);border-bottom:1px solid var(--v2-line)}.hero:after{display:none}.hero-grid{grid-template-columns:minmax(0,1.45fr) minmax(270px,.55fr);gap:7vw;align-items:end;padding-top:12vh;padding-bottom:9vh}.hero .eyebrow{color:var(--v2-green);font-size:10px;letter-spacing:.24em}.hero h1{font-size:clamp(70px,8.4vw,132px);line-height:.88;letter-spacing:-.075em;font-weight:300;margin:30px 0 42px;max-width:1000px;text-wrap:balance}.hero p{color:var(--v2-muted);font-size:clamp(16px,1.3vw,20px);line-height:1.65;max-width:720px}.actions{margin-top:42px;gap:0}.btn{border:1px solid var(--v2-ink);padding:15px 22px;font-size:13px;background:transparent}.btn.primary{background:var(--v2-green);border-color:var(--v2-green);color:white}.btn:hover{background:var(--v2-ink);color:white}.material-card{background:transparent;border:0;border-top:1px solid var(--v2-ink);padding:20px 0 0}.material-card strong{font-size:10px;letter-spacing:.18em;color:var(--v2-muted)}.material-list{grid-template-columns:48px 1fr;margin-top:25px}.material-list span{padding:15px 0;border-color:var(--v2-line);color:var(--v2-ink);font-size:13px}.material-list span:nth-child(odd){color:var(--v2-green);font-variant-numeric:tabular-nums}
section{padding:clamp(90px,11vw,160px) 0}.section-head{margin-bottom:72px;align-items:start}.section-head h2{font-size:clamp(48px,6vw,88px);line-height:.98;letter-spacing:-.065em;font-weight:300;max-width:1000px}.section-head p{font-size:15px;line-height:1.7;margin-top:26px}.eyebrow{font-size:10px;letter-spacing:.22em!important;font-weight:600}
/* About — magazine spread */
#about{background:var(--v2-paper)}#about .section-head{margin-bottom:40px}#about .section-head h2{font-size:clamp(32px,3.2vw,50px);color:var(--v2-green)}.story{grid-template-columns:1.1fr .9fr;gap:10vw}.story .lead{font-size:clamp(28px,3vw,46px);line-height:1.18;letter-spacing:-.05em;font-weight:300}.story .lead b{font-weight:500;color:var(--v2-ink)}.story>div:last-child{padding-top:8px}.story>div:last-child p{font-size:15px;line-height:1.8}.story .stat{margin-top:50px;padding-top:18px;gap:0;display:grid;grid-template-columns:repeat(3,1fr)}.story .stat>div{padding-right:22px}.story .stat b{font-size:17px;font-weight:600;color:var(--v2-green)}.story .stat span{display:block;margin-top:24px;line-height:1.5;font-size:12px}.values{margin-top:110px;grid-template-columns:repeat(5,1fr);border-color:var(--v2-line)}.value{padding:22px 25px 20px 0;border-color:var(--v2-line)}.value b{font-size:10px}.value h3{font-size:17px;margin:60px 0 13px;font-weight:500}.value p{font-size:12px;line-height:1.65}
/* Three disciplines — full-width editorial bands, not cards */
#areas{background:var(--v2-ivory)}#areas .three{display:block;background:transparent;border-top:1px solid var(--v2-ink)}.area{min-height:unset;background:transparent!important;padding:42px 0 44px;display:grid;grid-template-columns:170px minmax(320px,.8fr) 1fr;gap:40px;align-items:start;border-bottom:1px solid var(--v2-line);transition:padding .3s,background .3s}.area:hover{padding-left:22px;padding-right:22px;background:var(--v2-paper)!important}.area .field-no{margin:8px 0 0;font-size:10px}.area h3{font-size:clamp(28px,3vw,44px);font-weight:300;letter-spacing:-.05em;margin:0;line-height:1.08}.area p,.area.main p{font-size:14px;line-height:1.75;max-width:520px;margin:4px 0 0}
/* Material showroom scene */
#materials{background:var(--v2-deep);color:#f6f3e9}#materials .section-head .eyebrow{color:#7ed878!important}#materials .section-head p{color:#b9c6ba}.material-grid{grid-template-columns:repeat(3,1fr);border:0;background:rgba(255,255,255,.14);gap:1px}.mat{min-height:260px;background:var(--v2-deep);border:0;padding:30px;position:relative;overflow:hidden}.mat:before{content:"";position:absolute;width:170px;height:170px;right:-50px;top:-55px;border-radius:50%;background:radial-gradient(circle at 35% 35%,rgba(126,216,120,.24),transparent 65%);opacity:.55;transition:transform .45s}.mat:nth-child(2):before,.mat:nth-child(5):before{border-radius:0;transform:rotate(35deg)}.mat:hover{background:#163921}.mat:hover:before{transform:scale(1.18)}.mat span{color:#7ed878;font-size:9px;letter-spacing:.18em;position:relative}.mat h3{color:white;font-size:clamp(25px,2.3vw,36px);font-weight:300;letter-spacing:-.045em;position:relative}
/* Paint expertise — quiet typographic index */
#solutions{background:var(--v2-paper);padding-top:clamp(90px,11vw,160px)!important}.services{grid-template-columns:repeat(2,1fr);border:0;background:var(--v2-line);gap:1px}.service{background:var(--v2-paper);border:0;min-height:230px;padding:34px;transform:none!important}.service:hover{background:var(--v2-ivory);color:var(--v2-ink)}.service .num{font-size:10px;font-weight:600}.service h3{font-size:clamp(24px,2.3vw,34px);font-weight:300;letter-spacing:-.04em;margin:70px 0 12px}.service p{font-size:13px;max-width:440px}.service:hover p{color:var(--v2-muted)}
/* Process — horizontal rail */
.process{background:var(--v2-ivory)}.steps{border-top:1px solid var(--v2-ink)}.step{padding:26px 22px 15px 0;border-color:var(--v2-line)}.step b{font-size:12px}.step h3{font-size:16px;font-weight:500;margin-top:55px}.step p{line-height:1.5}
/* Projects: elegant abstract fields until real photography arrives */
#projects{background:var(--v2-paper)}.cases{gap:14px;background:transparent}.case{min-height:520px;padding:30px;background:var(--v2-deep)}.case:after{content:"";display:block;position:absolute;inset:0;background:linear-gradient(160deg,transparent 0 50%,rgba(0,0,0,.35)),radial-gradient(circle at 75% 22%,rgba(151,199,142,.34),transparent 22%),linear-gradient(125deg,#1d4425 0 24%,#0d2814 24% 46%,#315839 46% 47%,#132f1a 47%);transition:transform .7s,filter .7s}.case:nth-child(2):after{background:linear-gradient(155deg,transparent 0 45%,rgba(0,0,0,.4)),repeating-linear-gradient(115deg,#1a3c21 0 38px,#234c2a 38px 40px,#102a17 40px 78px)}.case:nth-child(3):after{background:radial-gradient(ellipse at 70% 28%,rgba(172,205,164,.38),transparent 14%),radial-gradient(ellipse at 35% 55%,rgba(83,132,79,.28),transparent 22%),linear-gradient(140deg,#0d2513,#254b2b)}.case:hover:after{transform:scale(1.035);filter:saturate(1.1)}.case:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(6,22,10,.88));z-index:1}.case>*{z-index:2}.case small{color:#95d48f;font-size:9px;letter-spacing:.14em}.case h3{font-size:clamp(23px,2vw,31px);font-weight:300;letter-spacing:-.04em;line-height:1.15}
#knowledge{padding-block:90px;background:var(--v2-ivory);border-top:1px solid var(--v2-line);border-bottom:1px solid var(--v2-line)}#knowledge .section-head{margin:0}#knowledge .section-head h2{font-size:clamp(38px,4vw,60px)}
/* Contact — conversion, not a generic card */
.contact{background:var(--v2-deeper);padding-block:clamp(90px,10vw,140px)}.contact-grid{gap:10vw;align-items:start}.contact h2{font-size:clamp(48px,5.2vw,78px);font-weight:300;letter-spacing:-.065em;line-height:.98}.contact p{font-size:15px;line-height:1.75}.contact-list{border-top:1px solid rgba(255,255,255,.22);padding-top:22px}.contact-list strong{font-size:13px;font-weight:400}.form{background:transparent;color:white;padding:0}.form label{display:block;color:#9fb09f;font-size:9px;letter-spacing:.14em;text-transform:uppercase}.form input,.form select,.form textarea{background:transparent;color:white;border:0;border-bottom:1px solid rgba(255,255,255,.28);padding:13px 0;margin:4px 0 24px;border-radius:0}.form select option{color:var(--v2-ink);background:white}.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:#7ed878}.form button{margin-top:8px;background:var(--v2-green);padding:17px;font-size:13px;font-weight:600;transition:background .2s}.form button:hover{background:#25ae19}
footer{background:var(--v2-deeper);border-top:1px solid rgba(255,255,255,.12);padding:38px 0;color:#90a392}.foot strong{font-weight:400;letter-spacing:.02em}
/* Reveal motion */
@media(prefers-reduced-motion:no-preference){section>.wrap{animation:reveal .75s both;animation-timeline:view();animation-range:entry 5% cover 22%}@keyframes reveal{from{opacity:.25;transform:translateY(26px)}to{opacity:1;transform:none}}}
@media(max-width:900px){.wrap{padding-inline:28px}.nav{height:64px}.links.open{top:64px;background:var(--v2-paper)}.hero-grid{grid-template-columns:1fr;padding-top:10vh}.hero h1{font-size:clamp(58px,12vw,88px);line-height:.9}.material-card{max-width:500px}.story{grid-template-columns:1fr;gap:60px}.area{grid-template-columns:110px 1fr}.area p{grid-column:2}.material-grid{grid-template-columns:repeat(2,1fr)}.services{grid-template-columns:1fr 1fr}.steps{grid-template-columns:repeat(3,1fr)}.cases{grid-template-columns:1fr}.case{min-height:420px}.values{grid-template-columns:repeat(3,1fr)}.contact-grid{grid-template-columns:1fr;gap:70px}}
@media(max-width:580px){.wrap{padding-inline:20px}.hero{padding:0}.hero-grid{padding-top:72px;padding-bottom:70px}.hero h1{font-size:clamp(52px,16vw,72px);letter-spacing:-.075em;margin-block:26px 34px}.hero p{font-size:15px}.actions{display:grid}.btn{text-align:center}.section-head{margin-bottom:50px}.section-head h2{font-size:clamp(41px,12vw,56px)}.story .lead{font-size:31px}.story .stat{grid-template-columns:1fr;gap:20px}.story .stat>div{display:grid;grid-template-columns:50px 1fr;align-items:start}.story .stat span{margin:0}.values{grid-template-columns:1fr}.value h3{margin-top:35px}.area{grid-template-columns:1fr;padding-block:35px}.area p{grid-column:auto}.area .field-no{margin-bottom:28px}.material-grid{grid-template-columns:1fr}.mat{min-height:210px}.services{grid-template-columns:1fr}.service{min-height:200px}.service h3{margin-top:45px}.steps{grid-template-columns:1fr 1fr}.step h3{margin-top:35px}.case{min-height:380px}.contact h2{font-size:47px}.foot{display:grid;gap:10px;font-size:11px}}

/* V2 completion overrides */
.drop.open .drop-menu{display:block!important}
.case:after{content:""!important;display:block!important;background-image:url('/assets/v2/interior.jpg')!important;background-size:cover!important;background-position:center!important;transition:transform .7s,filter .7s!important}
.case:nth-child(2):after{background-image:url('/assets/v2/spray-gun-detail.jpg')!important;background-position:50% 40%!important}
.case:nth-child(3):after{background-image:url('/assets/v2/landscape.jpg')!important;background-position:center!important}
.case:hover:after{transform:scale(1.035);filter:saturate(1.05)}
.case small:before{content:"HÌNH ẢNH ĐỊNH HƯỚNG · ";color:#d5e8d2}
/* Disable scroll-driven opacity; content must always be readable */
section>.wrap{animation:none!important;opacity:1!important;transform:none!important}
@media(max-width:900px){.drop.open .drop-menu{display:block!important}.drop-menu a{min-height:44px;display:flex!important;align-items:center}.paint-sub{display:grid!important}.paint-sub a{min-height:44px}}
