/* หน้า Collaboration (v2.166.0) สี/ฟอนต์จาก gib.css (--g-*) ปุ่ม .bt ใช้แบบ studio ใน gib.css */
*{box-sizing:border-box}
body.cb-page{margin:0;background:var(--g-bg);color:var(--g-ink);font:400 16px/1.65 var(--g-ui)}
.cb-page a{color:inherit}
.cb-shell{width:min(100% - 32px,1120px);margin:0 auto}
.cb-page h1,.cb-page h2,.cb-page h3{margin:0;color:var(--g-ink)}
.cb-page h2{font:400 clamp(28px,3.2vw,40px)/1.2 var(--g-display);margin-bottom:20px}
:lang(th) .cb-page h2{font-weight:600;line-height:1.4}
.cb-lbl,.cb-kick,.cb-w small,.cb-exc-tx small{font:600 .78rem/1.3 var(--g-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--g-gold-d)}
:lang(th) .cb-lbl,:lang(th) .cb-kick{letter-spacing:.02em;font-size:.95rem;font-weight:500}
.cb-in{margin:-8px 0 24px;max-width:60ch;color:var(--g-ink2)}
.cb-hero{padding:clamp(32px,6vw,72px) 0 clamp(28px,4vw,48px)}
.cb-hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,56px);align-items:center}
.cb-kick{margin:0 0 12px}
.cb-hero h1{font:400 clamp(36px,5vw,60px)/1.08 var(--g-display);margin-bottom:18px}
:lang(th) .cb-hero h1{font-weight:600;line-height:1.3}
.cb-dek{margin:0 0 24px;font-size:clamp(16px,1.3vw,18px);color:var(--g-ink2);max-width:46ch}
.cb-ctas{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.cb-ctas .bt{display:inline-flex;align-items:center;min-height:46px;padding:0 20px;text-decoration:none}
.cb-hero-img{margin:0;border-radius:var(--g-r);overflow:hidden;aspect-ratio:4/3;background:var(--g-soft)}
.cb-hero-img img{width:100%;height:100%;object-fit:cover;object-position:65% 50%}
@media (max-width:860px){.cb-hero-in{grid-template-columns:1fr}.cb-hero-img{order:-1;aspect-ratio:16/9}}
.cb-sec{padding:clamp(36px,5vw,64px) 0}
.cb-works{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cb-w{display:flex;flex-direction:column;gap:6px;padding:0 0 18px;border-radius:var(--g-r);border:1px solid var(--g-line);overflow:hidden;background:var(--g-bg)}
.cb-w-img{display:block;aspect-ratio:4/3;background:var(--g-soft) center/cover no-repeat;margin-bottom:10px}
.cb-w-img.tood{display:flex;align-items:flex-end;justify-content:center;gap:2px;padding:0 8px 6px}
.cb-w-img.tood i{width:30%;aspect-ratio:1;background:0 0/400% 100% no-repeat}
.cb-w small,.cb-w h3,.cb-w p{padding:0 18px}
.cb-w h3{font:400 21px/1.3 var(--g-display)}:lang(th) .cb-w h3{font-weight:600}
.cb-w p{margin:0;font-size:15px;color:var(--g-ink2)}
@media (max-width:980px){.cb-works{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cb-works{grid-template-columns:1fr}}
.cb-ex{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.cb-exc{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);border-radius:var(--g-r);border:1px solid var(--g-line);overflow:hidden;text-decoration:none;background:var(--g-bg)}
.cb-exc:hover{border-color:var(--g-ink)}
.cb-exc-img{min-height:200px;background:var(--g-soft) center/cover no-repeat}
.cb-exc-tx{display:flex;flex-direction:column;gap:6px;padding:18px 20px}
.cb-exc-tx b{font:400 22px/1.25 var(--g-display)}:lang(th) .cb-exc-tx b{font-weight:600}
.cb-exc-tx span{font-size:15px;color:var(--g-ink2)}
.cb-exc-tx em{margin-top:auto;padding-top:8px;font:700 .85rem var(--g-ui);font-style:normal;color:var(--g-ink);text-decoration:underline;text-underline-offset:3px}
@media (max-width:860px){.cb-ex{grid-template-columns:1fr}}
@media (max-width:480px){.cb-exc{grid-template-columns:1fr}.cb-exc-img{aspect-ratio:16/9;min-height:0}}
.cb-band{background:var(--g-soft)}
.cb-princ{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.cb-princ li{padding-top:14px;border-top:2px solid var(--g-gold)}
.cb-princ h3{font:700 1.05rem var(--g-ui);margin-bottom:6px}
.cb-princ p{margin:0;font-size:15px;color:var(--g-ink2)}
@media (max-width:860px){.cb-princ{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.cb-princ{grid-template-columns:1fr}}
.cb-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:st}
.cb-steps li{counter-increment:st;padding:20px;border-radius:var(--g-r);border:1px solid var(--g-line)}
.cb-steps li::before{content:counter(st);display:grid;place-items:center;width:34px;height:34px;margin-bottom:12px;border-radius:50%;background:var(--g-ink);color:var(--g-bg);font:600 15px var(--g-ui)}
.cb-steps h3{font:700 1.05rem var(--g-ui);margin-bottom:4px}
.cb-steps p{margin:0;font-size:15px;color:var(--g-ink2)}
@media (max-width:860px){.cb-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.cb-steps{grid-template-columns:1fr}}
.cb-contact{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);padding:clamp(24px,4vw,44px);border-radius:var(--g-r);background:#1F1D1A;color:#FFFAF0}
.cb-contact h2{color:#FFFAF0}.cb-contact .cb-in{color:#D9D2C6;margin:-8px 0 18px}
.cb-mail{margin:0;font-size:15px;color:#D9D2C6}.cb-mail a{color:var(--g-gold);font-weight:600}
.cb-cs{display:grid;gap:10px}
.cb-c{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:2px 14px;padding:14px 18px;border-radius:calc(var(--g-r) * .7);border:1px solid #3A3631;text-decoration:none;color:#FFFAF0}
.cb-c:hover{border-color:var(--g-gold)}
.cb-c b{grid-row:1;font:600 1rem var(--g-ui)}.cb-c span{grid-column:1/-1;grid-row:2;font-size:14px;color:#B3AB9E}
.cb-c em{grid-row:1;grid-column:2;justify-self:end;font:600 .85rem var(--g-ui);font-style:normal;color:var(--g-gold)}
@media (max-width:760px){.cb-contact{grid-template-columns:1fr}}
.cb-ft{padding:28px 0 40px;border-top:1px solid var(--g-line);font-size:14px;color:var(--g-ink3)}
.cb-ft .cb-shell{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.cb-ft p{margin:0}.cb-ft .nv-logo{text-decoration:none;color:var(--g-ink)}