.hero-image{background-image:url('../images/hero-jakarta.png')!important}
:root{--ink:#080e14;--gold:#bd945c;--paper:#faf9f6;--line:rgba(255,255,255,.1);--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:#f5f3ef;font:15px Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}.shell{width:min(1260px,calc(100% - 112px));margin:auto}.site-header{position:sticky;top:0;z-index:100;background:rgba(7,13,20,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(15px)}.nav-wrap{width:min(1450px,calc(100% - 88px));height:82px;margin:auto;display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;align-items:center;gap:10px;min-width:185px}.brand-mark{color:var(--gold);font:700 49px var(--serif);line-height:1;letter-spacing:-12px;padding-right:8px}.brand-mark span{font-size:34px}.brand-word{font-size:15px;font-weight:750;line-height:1.05}.brand-word small{display:block;margin-top:4px;color:var(--gold);font-size:10px;letter-spacing:3.7px}.main-nav{display:flex;align-items:center;gap:27px}.main-nav>a:not(.nav-cta){font-size:11px;color:#bbb}.main-nav>a.active,.main-nav>a:hover{color:#d8b57f!important}.nav-cta{padding:13px 15px;border:1px solid var(--gold);font-size:11px;color:#d8b57f!important}.menu-toggle{display:none}.eyebrow{display:block;color:var(--gold);font-size:10px;letter-spacing:2.4px;font-weight:700}.home-hero{min-height:670px;height:min(730px,calc(100vh - 82px));position:relative;display:flex;align-items:center;overflow:hidden}.hero-image{position:absolute;inset:0;background-image:url('../images/hero-jakarta.png');background-size:cover;background-position:center 44%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,12,18,.97),rgba(6,12,18,.87) 39%,rgba(6,12,18,.3) 80%)}.hero-inner{position:relative;z-index:1}.hero-inner h1,.section-heading h2,.cta-content h2,.page-hero h1,.about-editorial h2,.detail-intro h1{font-family:var(--serif);font-weight:400;letter-spacing:-2px}.hero-inner h1{font-size:clamp(54px,7.2vw,94px);line-height:1.03;margin:32px 0 23px}.hero-inner h1 i,.section-heading h2 i,.cta-content h2 i,.page-hero h1 i,.about-editorial h2 i,.detail-intro h1 i{font-style:normal;color:var(--gold)}.hero-inner>p{max-width:520px;color:#c1c3c6;line-height:1.85}.hero-buttons{display:flex;gap:14px;margin-top:32px}.button{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:51px;padding:0 21px;font-size:12px;font-weight:700;border:0;cursor:pointer}.button-gold{color:#16110a;background:linear-gradient(115deg,#b78d54,#d0aa76)}.button-outline{border:1px solid #ffffff55;color:#f1ede7}.hero-trust{display:flex;gap:14px;margin-top:39px;color:#b8b7b4;font-size:12px}.trust-stars{color:var(--gold);letter-spacing:2px}.hero-scroll{position:absolute;right:50px;bottom:35px;font-size:9px;letter-spacing:2px}.numbers-strip{background:#0d1721;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.numbers-grid{display:grid;grid-template-columns:repeat(4,1fr)}.numbers-grid>div{padding:35px 0;text-align:center;border-right:1px solid #ffffff12}.numbers-grid>div:last-child{border:0}.numbers-grid strong{display:block;font-size:36px;font-weight:500}.numbers-grid strong span{color:var(--gold)}.numbers-grid small{display:block;margin-top:7px;color:#a0a2a4;font-size:11px}.section{padding:110px 0}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:50px}.section-heading h2{margin:16px 0 0;font-size:clamp(42px,5.1vw,62px);line-height:1.1}.text-link{padding-bottom:8px;border-bottom:1px solid var(--gold);color:#b79567;font-size:12px}.services-home,.process-home{background:var(--paper);color:#11171d}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#e5e3df;border:1px solid #e5e3df}.service-tile{position:relative;min-height:260px;padding:30px 26px;background:var(--paper)}.service-tile:hover{background:#f2eee8}.service-num{position:absolute;right:22px;top:23px;color:#b8b3ab;font-size:11px}.service-icon{display:block;color:var(--gold);font-size:30px;margin-bottom:20px}.service-tile h3{font-size:15px;margin:0 0 11px}.service-tile p{font-size:12px;line-height:1.8;color:#6c7073}.service-link{display:block;margin-top:20px;color:#9f7544;font-size:11px}.selected-work{background:#0b121a}.featured-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.project-image{height:190px;position:relative;background-size:cover;background-position:center}.project-image:after{position:absolute;inset:0;content:"";background:#0002}.project-featured .project-image{height:310px}.project-number{position:absolute;left:11px;top:11px;z-index:2;padding:6px 8px;background:#0c1116df;border:1px solid #bd945cbb;color:#ead7bb;font-size:11px}.project-hover{position:absolute;inset:0;z-index:2;display:grid;place-items:center;opacity:0;transition:opacity .2s}.project-hover span{padding:11px 15px;background:#070c11df;font-size:12px}.project-card:hover .project-hover{opacity:1}.project-meta{padding:15px 0;display:flex;justify-content:space-between}.project-meta strong,.project-meta small{display:block}.project-meta strong{font-size:13px}.project-meta small{margin-top:5px;color:#919397;font-size:11px}.project-arrow{color:var(--gold)}.process-mini{display:grid;grid-template-columns:repeat(4,1fr)}.process-mini article{padding:23px 20px 10px 0;border-top:1px solid #d9d4cd}.process-mini article>span{display:block;color:var(--gold);font-size:12px;margin-bottom:30px}.process-mini h3{font-size:14px}.process-mini p{font-size:11px;color:#676b6e;line-height:1.8}.quote-section{padding:110px 0;background:#101a23;text-align:center}.quote-mark{color:var(--gold);font:70px var(--serif);line-height:.6}.quote-section blockquote{max-width:840px;margin:33px auto;font:clamp(25px,4vw,44px)/1.45 var(--serif)}.quote-person strong,.quote-person span{display:block}.quote-person strong{font-size:12px}.quote-person span{margin-top:6px;color:#9b9da0;font-size:11px}.cta-band{padding:84px 0;background:#f5f2ed;color:#12171c}.cta-band-dark{background:#101a23;color:#f4f1ec}.cta-content{display:flex;align-items:center;justify-content:space-between}.cta-content h2{font-size:46px;line-height:1.13;margin:15px 0}.site-footer{padding-top:75px;background:#080e14}.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.4fr;gap:55px;padding-bottom:60px}.footer-about>p,.footer-contact p{color:#91959a;line-height:1.8;font-size:11px}.footer-about>p{margin-top:20px}.footer-grid h4{margin:8px 0 23px;color:#c6a06b;font-size:10px;letter-spacing:1.7px}.footer-grid>div:not(.footer-about)>a{display:block;margin:13px 0;color:#b5b7b9;font-size:11px}.socials{display:flex;gap:9px;margin-top:19px}.socials a{width:29px;height:29px;display:grid;place-items:center;border:1px solid #46413a;color:#c6a06b;font-size:11px}.footer-bottom{min-height:60px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:#767a7e;font-size:10px}.floating-wa{position:fixed;right:23px;bottom:23px;z-index:101;padding:12px 15px;background:#28a65a;color:white;font-size:11px;box-shadow:0 8px 25px #0005}
.service-tile-image{height:130px;margin:-30px -26px 24px;background-size:cover;background-position:center}.service-tile .service-num{top:13px;right:13px;padding:5px 8px;background:#090f16c9;color:#dfc29a}.page-hero{height:345px;display:flex;align-items:center;background-position:center;background-size:cover}.page-hero h1{margin:17px 0 11px;font-size:clamp(48px,7vw,78px);line-height:1.06}.page-hero p{max-width:570px;color:#c7c7c5;font-size:13px;line-height:1.8}.services-page-body,.process-page-body,.about-page-body,.contact-page-body,.detail-main{background:var(--paper);color:#151a20}.service-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.service-detail-card{display:flex;background:white;border:1px solid #e9e6e2;min-height:258px;scroll-margin-top:110px}.service-detail-photo{width:41%;min-height:258px;background:center/cover}.service-detail-content{width:59%;padding:23px 18px}.service-detail-content .eyebrow{font-size:8px;letter-spacing:1px}.service-detail-content h2{margin:11px 0;font-size:17px}.service-detail-content>p{font-size:10px;line-height:1.75;color:#6e7376}.service-features{list-style:none;padding:4px 0 0}.service-features li{font-size:10px;margin:8px 0;color:#656a6d}.service-features li:before{content:"✓";color:#ad824c;margin-right:8px}.service-detail-cta{color:#a77d49;font-size:10px}.benefit-band{padding:85px 0;background:#101922}.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}.benefit-grid>div{padding-left:20px;border-left:1px solid #795e43}.benefit-grid strong,.benefit-grid span{display:block}.benefit-grid strong{font-size:13px}.benefit-grid span{margin-top:8px;color:#a4a5a6;font-size:10px;line-height:1.6}
.portfolio-page{background:#090f16}.portfolio-section{padding:35px 0 80px}.filters{display:flex;gap:4px;overflow-x:auto;padding-bottom:19px;border-bottom:1px solid #25292d;margin-bottom:26px}.filters button{white-space:nowrap;padding:10px 13px;color:#b8b8b9;background:transparent;border:0;font-size:10px;cursor:pointer}.filters button.filter-active{background:var(--gold);color:#14100b}.portfolio-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:21px 16px}.portfolio-grid .project-image{height:150px}.portfolio-grid .project-meta{padding:11px 0}.portfolio-grid .project-meta strong{font-size:11px}.portfolio-grid .project-meta small{font-size:9px}.portfolio-note{margin-top:33px;text-align:center;font-size:11px;color:#94969a}.portfolio-note strong{color:var(--gold)}.process-timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:35px 25px}.timeline-card{position:relative;border:1px solid #ebe8e3;background:#fff}.timeline-image{height:170px;background:center/cover}.timeline-content{padding:21px 19px}.timeline-number{position:absolute;top:12px;left:12px;padding:7px 9px;background:#121922;color:#d8b47e;font-size:11px}.timeline-content h2{font-size:15px}.timeline-content p{color:#696d70;font-size:11px;line-height:1.85}.timeline-duration{display:block;margin-top:12px;color:#a47d50;font-size:10px}.about-editorial{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}.about-photo{height:460px;background:center/cover}.about-editorial h2{font-size:54px;line-height:1.12;margin:15px 0 21px}.about-editorial>div>p{color:#63676b;font-size:13px;line-height:1.9}.about-checks{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:25px}.about-checks span{font-size:11px}.about-checks span:before{content:"✓";color:var(--gold);margin-right:8px}.values-section,.related-projects{background:#101922}.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.value-card{padding:28px;border:1px solid #ffffff20}.value-card>span{color:var(--gold);font-size:24px}.value-card h3{margin:20px 0 9px;font-size:14px}.value-card p{font-size:11px;line-height:1.8;color:#a4a5a6}.team-photo{height:400px;background:center 38%/cover}.contact-layout{display:grid;grid-template-columns:.9fr 1.25fr;gap:85px}.contact-sidebar h2,.contact-form-wrap h2{font:35px var(--serif);margin:12px 0 14px}.contact-sidebar>p,.contact-form-wrap>p{font-size:12px;line-height:1.8;color:#6e7275}.contact-info{margin-top:36px}.contact-info>div{padding:19px 0;border-top:1px solid #e1ddd7}.contact-info strong,.contact-info span{display:block}.contact-info strong{font-size:11px;color:#9e794c}.contact-info span{margin-top:7px;font-size:12px;line-height:1.7}.contact-form{margin-top:28px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.contact-form label{display:block;margin:0 0 17px;font-size:11px;color:#45494c}.contact-form input,.contact-form select,.contact-form textarea{display:block;width:100%;margin-top:8px;padding:12px;background:white;border:1px solid #e0ddd8;font-size:11px}.contact-form button{width:100%}.contact-success{text-align:center;padding:75px 15px}.contact-success>span{display:inline-grid;place-items:center;width:45px;height:45px;background:#7a9268;color:white;border-radius:50%}.contact-success p{color:#6a6d70;font-size:12px}
.detail-hero{
  width: 100%;
  height: 100vh; /* penuh 1 layar */
  min-height: 620px;
  background-position: center top; /* mulai dari atas sesuai request kamu tadi */
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
}

/* Biar di HP gak ketinggian */
@media (max-width: 768px){
  .detail-hero{
    width: 100vw; /* paksa selebar layar HP */
    max-width: 100vw;
    margin-left: calc(-50vw + 50%); /* dobrak container */
    margin-right: calc(-50vw + 50%);
    height: 50vh; /* biar tinggi juga proporsional */
    min-height: 300px;
    background-position: center top;
    background-size: 100% auto;

  }
  
  /* cegah scroll samping */
  body{
    overflow-x: hidden;
  }
}
}.detail-intro{padding-top:78px}.detail-intro h1{font-size:68px;margin:14px 0}.detail-intro>p{max-width:750px;color:#62676a;font-size:14px;line-height:1.9}.detail-facts{display:grid;grid-template-columns:repeat(4,1fr);margin-top:40px;padding:23px 0;border-top:1px solid #dedbd6;border-bottom:1px solid #dedbd6}.detail-facts span,.detail-facts strong{display:block}.detail-facts span{color:#898780;font-size:9px}.detail-facts strong{margin-top:9px;font-size:12px}.case-copy{max-width:760px;padding:65px 0 90px}.case-copy h2{font:33px var(--serif)}.case-copy p{color:#606468;line-height:2;font-size:13px}.result-box{margin:29px 0;padding:25px;border-left:3px solid var(--gold);background:#f1eee9}.result-box strong{display:block;color:#ad8250;font-size:20px}.result-box span{display:block;margin-top:6px;font-size:11px;color:#6a6b6c}.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}
@media(max-width:1120px){.shell{width:calc(100% - 70px)}.nav-wrap{width:calc(100% - 45px)}.main-nav{gap:15px}.portfolio-grid{grid-template-columns:repeat(3,1fr)}.footer-grid{gap:30px}}@media(max-width:820px){.shell{width:calc(100% - 38px)}.nav-wrap{width:calc(100% - 32px);height:70px}.brand-mark{font-size:42px}.menu-toggle{display:flex;flex-direction:column;gap:5px;padding:9px;background:none;border:1px solid #745a3e}.menu-toggle span{width:19px;height:1px;background:#d8b47e}.main-nav{position:absolute;top:70px;left:0;right:0;display:none;padding:14px 19px 20px;background:#090f16}.main-nav.nav-open{display:flex;flex-direction:column;align-items:stretch;gap:0}.main-nav>a{padding:14px 4px!important;border-bottom:1px solid #ffffff10}.nav-cta{margin-top:9px;text-align:center;border:1px solid var(--gold)!important}.home-hero{min-height:610px;height:calc(100svh - 70px)}.hero-image{background-position:61% center}.hero-inner h1{font-size:56px}.hero-inner>p{font-size:13px}.hero-scroll{right:20px}.numbers-grid{grid-template-columns:repeat(2,1fr)}.numbers-grid>div:nth-child(2){border-right:0}.section{padding:75px 0}.section-heading{align-items:flex-start;gap:22px;flex-direction:column;margin-bottom:35px}.section-heading h2{font-size:43px}.services-grid{grid-template-columns:repeat(2,1fr)}.featured-grid{gap:20px}.project-featured .project-image{height:225px}.process-mini{grid-template-columns:repeat(2,1fr)}.cta-content{align-items:flex-start;gap:25px;flex-direction:column}.cta-content h2{font-size:39px}.footer-grid{grid-template-columns:1.2fr 1fr;gap:40px}.page-hero{height:295px}.service-detail-grid{grid-template-columns:1fr}.benefit-grid{grid-template-columns:repeat(2,1fr)}.portfolio-grid,.process-timeline{grid-template-columns:repeat(2,1fr)}.about-editorial{grid-template-columns:1fr;gap:35px}.about-photo{height:350px}.values-grid{grid-template-columns:1fr}.contact-layout{grid-template-columns:1fr;gap:55px}.detail-intro h1{font-size:52px}.related-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.hero-inner h1{font-size:47px}.hero-buttons{gap:9px;flex-wrap:wrap}.button{padding:0 15px;font-size:11px}.section-heading h2{font-size:36px}.services-grid,.featured-grid,.process-timeline{grid-template-columns:1fr}.service-tile{min-height:220px}.portfolio-grid .project-image{height:116px}.portfolio-grid{gap:17px 10px}.footer-grid{grid-template-columns:1fr 1fr;gap:32px 20px}.footer-about{grid-column:span 2}.footer-bottom{align-items:flex-start;justify-content:center;gap:6px;flex-direction:column}.service-detail-card{flex-direction:column}.service-detail-photo,.service-detail-content{width:100%}.service-detail-photo{min-height:185px}.page-hero h1{font-size:47px}.about-checks,.form-row{grid-template-columns:1fr}.detail-facts{grid-template-columns:repeat(2,1fr);gap:22px}.related-grid{grid-template-columns:1fr}.floating-wa{right:12px;bottom:12px}}

[hidden]{display:none!important}.page-hero{background-position:center 38%}.project-image,.timeline-image,.service-detail-photo,.service-tile-image{background-color:#17202a}.offline-notice{padding:8px;background:#151f29;text-align:center;color:#c5a473;font-size:10px}

/* HIDE DI PC, MUNCUL DI HP */
@media (min-width: 769px) {
  .hide-desktop {
    display: none !important;
  }
}

/* HIDE DI HP, MUNCUL DI PC */
@media (max-width: 768px) {
  .hide-mobile {
    display: none !important;
  }
}