*{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:#0c0c0c}body{font-family:Kanit,sans-serif;color:#d7e2ea;overflow-x:clip}.hero-heading{background:linear-gradient(180deg,#646973,#bbccd7);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.btn-contact{border:none;cursor:pointer;color:#fff;font-family:inherit;font-weight:500;text-transform:uppercase;letter-spacing:.18em;border-radius:9999px;padding:14px 40px;font-size:clamp(.72rem,1vw,1rem);background:linear-gradient(123deg,#18011f 7%,#b600a8 37%,#7621b0 72%,#be4c00);box-shadow:0 4px 4px #b501a740,4px 4px 12px #7721b1 inset;outline:2px solid #fff;outline-offset:-3px;transition:transform .2s ease,filter .2s ease}.btn-contact:hover{transform:translateY(-2px);filter:brightness(1.08)}.btn-ghost{cursor:pointer;background:transparent;font-family:inherit;font-weight:500;text-transform:uppercase;letter-spacing:.18em;border-radius:9999px;border:2px solid #D7E2EA;color:#d7e2ea;padding:12px 34px;font-size:clamp(.72rem,1vw,1rem);transition:background .2s ease;display:inline-flex;align-items:center;gap:.4em}.btn-ghost:hover{background:#d7e2ea1a}a{text-decoration:none}.fade{opacity:0;transition:opacity .7s cubic-bezier(.25,.1,.25,1),transform .7s cubic-bezier(.25,.1,.25,1)}.fade.in{opacity:1;transform:none!important}.ph{position:relative;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#d7e2ea0f,#7621b01a),repeating-linear-gradient(45deg,rgba(215,226,234,.03) 0 12px,transparent 12px 24px);border:1px dashed rgba(215,226,234,.22);color:#d7e2ea8c;font-weight:400;letter-spacing:.05em;text-align:center;padding:12px;overflow:hidden}.ph span{font-size:clamp(.62rem,1vw,.85rem);line-height:1.4}.ph img{width:100%;height:100%;object-fit:cover;display:block}.nav{display:flex;justify-content:space-between;padding:26px 24px 0;gap:16px}.nav a{color:#d7e2ea;font-weight:500;text-transform:uppercase;letter-spacing:.08em;font-size:clamp(.78rem,1.2vw,1.4rem);transition:opacity .2s}.nav a:hover{opacity:.7}.mq-row{display:flex;gap:12px;will-change:transform}.mq-tile{flex:0 0 auto;width:420px;height:270px;border-radius:16px;overflow:hidden}@media (max-width:640px){.mq-tile{width:280px;height:180px}}.svc{background:#fff;border-top-left-radius:56px;border-top-right-radius:56px}.svc-item{display:flex;gap:clamp(16px,3vw,48px);align-items:flex-start;border-top:1px solid rgba(12,12,12,.15);padding:clamp(28px,4vw,48px) 0}.svc-num{font-weight:900;color:#0c0c0c;line-height:.8;font-size:clamp(2.6rem,9vw,140px)}.svc-name{font-weight:500;text-transform:uppercase;color:#0c0c0c;font-size:clamp(1rem,2.2vw,2.1rem);line-height:1.05}.svc-desc{font-weight:300;color:#0c0c0c;opacity:.6;line-height:1.6;max-width:640px;margin-top:8px;font-size:clamp(.85rem,1.6vw,1.25rem)}.proj-card{border:2px solid #D7E2EA;background:#0c0c0c;border-radius:48px;padding:clamp(16px,2.4vw,32px);will-change:transform;transform-origin:top center}.proj-top{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-bottom:clamp(16px,2vw,28px)}.proj-grid{display:grid;grid-template-columns:40% 60%;gap:12px}@media (max-width:640px){.proj-grid{grid-template-columns:1fr}}.eyebrow{font-size:clamp(.66rem,1vw,.85rem);letter-spacing:.22em;text-transform:uppercase;color:#8a929b}.corner{position:absolute;pointer-events:none}