body{margin:0}:root{--ink:#101010;--muted:#6f6a64;--paper:#f7f2ea;--panel:#fffaf3;--line:#e4d8c9;--red:#b91c1c;--brown:#6e3f2d;--green:#66785f;--blue:#4f6f87;--yellow:#d9a441;--shadow:0 24px 60px #1f161029;color:var(--ink);background:var(--paper);font-family:Inter,Segoe UI,Roboto,Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);margin:0}a{color:inherit}main{min-height:100vh;overflow-x:hidden}.btn{white-space:nowrap;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:9px;min-height:42px;padding:11px 17px;font-size:14px;font-weight:800;text-decoration:none;display:inline-flex}.btn.primary{color:#fff;background:var(--red);box-shadow:0 16px 34px #b91c1c42}.btn.secondary{color:#fff;background:#ffffff14;border-color:#ffffff8f}.hero{color:#fff;isolation:isolate;min-height:100vh;padding:138px clamp(18px,5vw,72px) 34px;display:grid;position:relative}.hero-video,.hero-scrim{z-index:-2;position:absolute;inset:0}.hero-video{object-fit:cover;background:#211916;width:100%;height:100%}.hero-scrim{z-index:-1;background:linear-gradient(90deg,#100e0ce6,#100e0c8a 50%,#100e0c61),linear-gradient(#0000 62%,#100e0cb8)}.hero-grid{opacity:.86;grid-template-columns:repeat(2,minmax(82px,10vw));gap:10px;display:grid;position:absolute;bottom:98px;right:clamp(18px,5vw,72px)}.hero-grid span{aspect-ratio:1;box-shadow:var(--shadow);border:1px solid #ffffff42;border-radius:8px}.hero-grid span:first-child{background:#d9a441}.hero-grid span:nth-child(2){background:#526d82}.hero-grid span:nth-child(3){background:#b91c1c}.hero-grid span:nth-child(4){background:#748e63}.hero-content{align-self:center;max-width:910px}.eyebrow{color:var(--red);letter-spacing:.13em;text-transform:uppercase;margin:0 0 14px;font-size:12px;font-weight:900}.hero .eyebrow,.contact-section .eyebrow{color:#ffc36e}.hero h1,.section h2,.feature-banner h2,.contact-section h2{letter-spacing:0;margin:0}.hero h1,.hero-heading{max-width:780px;font-size:clamp(38px,6.4vw,82px);font-weight:900;line-height:.98;display:inline-block}.hero-subheading{color:#fffffff0;max-width:780px;font-weight:700;margin:24px 0 0!important;font-size:clamp(20px,2.8vw,32px)!important;line-height:1.28!important}.hero-description{max-width:640px;color:#ffffffbd!important;margin:18px 0 0!important;font-size:clamp(15px,1.8vw,18px)!important;line-height:1.68!important}.hero-content>p:not(.eyebrow){color:#ffffffd6;max-width:640px;margin:28px 0 0;font-size:clamp(16px,2vw,21px);line-height:1.68}.hero-actions{flex-wrap:wrap;gap:12px;margin-top:34px;display:flex}.hero-meta{border-top:1px solid #ffffff3d;grid-template-columns:repeat(3,minmax(0,1fr));align-self:end;width:min(780px,100%);margin-top:70px;display:grid}.hero-meta div{padding:18px 22px 0 0}.hero-meta strong,.hero-meta span{display:block}.hero-meta strong{font-size:clamp(16px,2.2vw,24px);font-weight:800;line-height:1.2}.hero-meta span{color:#ffffffb8;margin-top:4px;font-size:13px}.intro-strip{border-bottom:1px solid var(--line);background:#fffaf3;grid-template-columns:repeat(6,minmax(0,1fr));display:grid}.intro-strip span{border-right:1px solid var(--line);color:#342b26;text-align:center;white-space:nowrap;place-items:center;min-height:76px;padding:0 18px;font-weight:800;display:grid}.intro-strip span:last-child{border-right:0}.section{padding:clamp(64px,8vw,110px) clamp(18px,5vw,72px)}.section-kicker,.process-heading{max-width:820px;margin-bottom:34px}.text-center{text-align:center;margin-left:auto;margin-right:auto}.text-left{text-align:left}.section h2,.feature-banner h2,.contact-section h2{letter-spacing:-.01em;margin:0;font-weight:900;line-height:1.05}#produk h2,#testimoni h2{font-size:clamp(32px,4.6vw,56px)}#galeri h2,#jasa h2,#proses h2{font-size:clamp(26px,3.8vw,44px)}.feature-banner h2,.contact-section h2{font-size:clamp(28px,4.2vw,48px);line-height:1.1}.product-section{background:var(--paper)}.category-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.category-card{color:#fff;background:var(--brown);border:1px solid #1010101a;border-radius:8px;flex-direction:column;justify-content:flex-end;min-height:330px;padding:24px;display:flex;position:relative;overflow:hidden}.category-card:before{content:"";opacity:.34;background-color:#0000;background-image:linear-gradient(90deg,#ffffff2e 1px,#0000 1px),linear-gradient(0deg,#ffffff2e 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:38px 38px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0}.category-card:after{content:"";background:linear-gradient(#0000,#00000061);height:62%;position:absolute;inset:auto 0 0}.card-1{background:#8b4d34}.card-2{color:#241b13;background:#d9a441}.card-3{background:#4f6f87}.card-4{background:#5f1717}.card-5{background:#66785f}.card-6{background:#6e6258}.card-icon,.category-card span,.category-card h3,.category-card p{z-index:2;position:relative}.card-icon{background:#ffffff1f;border:1px solid #ffffff5c;border-radius:8px;place-items:center;width:54px;height:54px;font-size:30px;display:grid;position:absolute;top:22px;right:22px}.category-card span{letter-spacing:.12em;font-size:12px;font-weight:900}.category-card h3{margin:12px 0 8px;font-size:clamp(23px,2.7vw,34px);line-height:1}.category-card p{color:currentColor;opacity:.82;max-width:360px;margin:0;line-height:1.58}.feature-banner{color:#fff;background:#181513;grid-template-columns:minmax(300px,1.1fr) minmax(280px,.7fr);align-items:end;gap:clamp(28px,5vw,74px);padding:clamp(62px,7vw,92px) clamp(18px,5vw,72px);display:grid}.feature-banner p:last-child{color:#ffffffb8;margin:0;font-size:18px;line-height:1.7}.service-section{background:#fffaf3}.service-list{border:1px solid var(--line);background:var(--line);border-radius:8px;gap:1px;display:grid;overflow:hidden}.service-list article{background:#fffaf3;grid-template-columns:70px 1fr;align-items:center;gap:22px;padding:28px;display:grid}.service-list i{color:#fff;background:var(--red);border-radius:8px;place-items:center;width:58px;height:58px;font-size:31px;display:grid}.service-list h3{margin:0 0 7px;font-size:clamp(23px,3vw,36px)}.service-list p{max-width:680px;color:var(--muted);margin:0;line-height:1.65}.process-section{background:var(--paper);grid-template-columns:minmax(280px,.85fr) minmax(320px,1.15fr);gap:clamp(30px,5vw,70px);display:grid}.process-grid{gap:12px;display:grid}.process-grid article{border:1px solid var(--line);background:#fffaf3;border-radius:8px;padding:24px}.process-grid strong{color:var(--red);letter-spacing:.14em;font-size:13px;display:block}.process-grid p{color:#2f2823;margin:20px 0 0;font-size:19px;line-height:1.54}.contact-section{color:#fff;background:var(--red);grid-template-columns:1.2fr 1fr;align-items:center;gap:40px;padding:clamp(64px,7vw,96px) clamp(18px,5vw,72px);display:grid}.contact-section>div{max-width:930px}.contact-section p:not(.eyebrow){color:#ffffffc7;max-width:680px;margin:22px 0 0;font-size:17px;line-height:1.7}.contact-section .btn.primary{color:var(--red);box-shadow:none;background:#fff}.footer{border-top:1px solid var(--line);color:#766d66;background:#fffaf3;justify-content:space-between;gap:18px;padding:24px clamp(18px,5vw,72px);font-size:13px;display:flex}.footer-links{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:16px;display:flex}.footer-links a{color:#3a312b;align-items:center;gap:8px;font-weight:800;text-decoration:none;display:inline-flex}.footer-links a:hover{color:var(--red)}@media (width<=980px){.hero-grid{opacity:.34}.intro-strip{scroll-snap-type:x proximity;scrollbar-width:none;display:flex;overflow-x:auto}.intro-strip::-webkit-scrollbar{display:none}.intro-strip span{scroll-snap-align:start;flex:none;min-width:154px}.category-grid,.feature-banner,.process-section,.contact-section{grid-template-columns:1fr}}@media (width<=620px){.hero{min-height:94vh;padding-top:150px}.hero h1{font-size:36px;line-height:1.04}.hero-actions,.hero-actions .btn,.contact-section .btn{width:100%}.hero-meta{grid-template-columns:1fr}.intro-strip{grid-template-columns:repeat(2,minmax(0,1fr));display:grid;overflow:visible}.intro-strip span{white-space:normal;min-width:0;min-height:54px;padding:10px 12px;font-size:13px}.category-card{min-height:280px}.service-list article{grid-template-columns:1fr}.footer{flex-direction:column}.footer-links{justify-content:flex-start}}.gallery-section{background:var(--panel)}.gallery-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:34px;display:grid}.gallery-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;flex-direction:column;transition:all .3s;display:flex;overflow:hidden;box-shadow:0 4px 20px #00000008}.gallery-card:hover{box-shadow:var(--shadow);border-color:var(--red);transform:translateY(-4px)}.gallery-img-wrapper{aspect-ratio:4/3;background:#eee;width:100%;position:relative;overflow:hidden}.gallery-img-wrapper img{object-fit:cover;width:100%;height:100%;display:block}.gallery-info{padding:20px}.gallery-info h4{color:var(--ink);margin:0 0 8px;font-size:18px;font-weight:700}.gallery-info p{color:var(--muted);margin:0;font-size:14px;line-height:1.5}.testimonial-section{background:var(--paper);border-top:1px solid var(--line)}.testimonial-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:34px;display:grid}.testimonial-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;flex-direction:column;justify-content:space-between;padding:30px;transition:all .3s;display:flex;box-shadow:0 4px 20px #00000005}.testimonial-card:hover{box-shadow:var(--shadow);border-color:var(--red);transform:translateY(-4px)}.testimonial-stars{color:var(--yellow);gap:4px;margin-bottom:16px;font-size:16px;display:flex}.testimonial-text{color:var(--ink);margin:0 0 24px;font-size:15px;font-style:italic;line-height:1.65}.testimonial-user{align-items:center;gap:14px;display:flex}.user-avatar{color:#fff;border-radius:50%;place-items:center;width:42px;height:42px;font-size:14px;font-weight:700;display:grid;box-shadow:0 4px 10px #0000001a}.testimonial-user h4{color:var(--ink);margin:0;font-size:15px;font-weight:800}.testimonial-user span{color:var(--muted);margin-top:2px;font-size:12px;display:block}.pill-nav-container{z-index:99;pointer-events:none;justify-content:center;display:flex;position:fixed;top:18px;left:0;right:0}@media (width<=768px){.pill-nav-container{pointer-events:auto;width:100%;left:0}}.pill-nav{--nav-h:48px;--logo:40px;--pill-pad-x:20px;--pill-gap:4px;box-sizing:border-box;pointer-events:auto;align-items:center;width:max-content;display:flex}@media (width<=768px){.pill-nav{-webkit-backdrop-filter:blur(12px);background:#120f0dd9;border:1px solid #ffffff26;border-radius:9999px;justify-content:space-between;width:calc(100% - 24px);margin:0 auto;padding:8px 12px;box-shadow:0 12px 30px #0003}}.pill-nav-items{height:var(--nav-h);background:var(--base,#000);border:1px solid #ffffff1a;border-radius:9999px;align-items:center;display:flex;position:relative;box-shadow:0 10px 30px #00000026}.pill-logo{width:var(--nav-h);height:var(--nav-h);background:var(--base,#000);border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;margin-right:10px;padding:8px;transition:transform .3s;display:inline-flex;overflow:hidden;box-shadow:0 10px 30px #00000026}.pill-logo:hover{transform:scale(1.05)}@media (width<=768px){.pill-logo{box-shadow:none;background:0 0;border:none;margin-right:0}}.pill-logo img{object-fit:contain;width:100%;height:100%;display:block}.pill-list{align-items:stretch;gap:var(--pill-gap);height:100%;margin:0;padding:4px;list-style:none;display:flex}.pill-list>li{height:100%;display:flex}.pill{height:100%;padding:0 var(--pill-pad-x);background:var(--pill-bg,#fff);color:var(--pill-text,var(--base,#000));box-sizing:border-box;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;cursor:pointer;border:1px solid #ffffff0d;border-radius:9999px;justify-content:center;align-items:center;font-size:14px;font-weight:700;line-height:1;text-decoration:none;transition:border-color .3s;display:inline-flex;position:relative;overflow:hidden}.pill:hover{border-color:#ffffff26}.pill .hover-circle{background:var(--base,#000);z-index:1;pointer-events:none;will-change:transform;border-radius:50%;display:block;position:absolute;bottom:0;left:50%}.pill .label-stack{z-index:2;line-height:1;display:inline-block;position:relative}.pill .pill-label{z-index:2;will-change:transform;line-height:1;display:inline-block;position:relative}.pill .pill-label-hover{color:var(--hover-text,#fff);z-index:3;will-change:transform, opacity;display:inline-block;position:absolute;top:0;left:0}.pill.is-active:after{content:"";background:var(--base,#000);z-index:4;border-radius:50%;width:4px;height:4px;position:absolute;bottom:4px;left:50%;transform:translate(-50%)}.desktop-only{display:block}.mobile-only{display:none}@media (width<=768px){.desktop-only{display:none}.mobile-only{display:block}}.mobile-menu-button{width:var(--nav-h);height:var(--nav-h);background:var(--base,#000);cursor:pointer;border:1px solid #ffffff1a;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0;display:none;position:relative;box-shadow:0 4px 12px #00000026}@media (width<=768px){.mobile-menu-button{box-shadow:none;background:0 0;border:none;display:flex}}.hamburger-line{background:var(--pill-bg,#fff);transform-origin:50%;border-radius:1px;width:18px;height:2px;transition:all 10ms}.mobile-menu-popover{-webkit-backdrop-filter:blur(15px);z-index:998;opacity:0;transform-origin:top;visibility:hidden;background:#120f0df2;border:1px solid #ffffff26;border-radius:24px;padding:6px;position:absolute;top:74px;left:12px;right:12px;box-shadow:0 20px 40px #0000004d}.mobile-menu-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.mobile-menu-popover .mobile-menu-link{color:#fff;text-transform:uppercase;letter-spacing:.5px;background-color:#ffffff0d;border:1px solid #ffffff05;border-radius:18px;padding:14px 20px;font-size:15px;font-weight:700;text-decoration:none;transition:all .2s;display:block}.mobile-menu-popover .mobile-menu-link:hover,.mobile-menu-popover .mobile-menu-link.is-active{cursor:pointer;background-color:var(--pill-bg,#fff);color:var(--hover-text,#120f17)}
