:root{--ink:#252823;--paper:#f7f6f1;--orange:#b64e27;--line:#dbdcd3}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:105px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit}header{display:flex;align-items:center;justify-content:space-between;padding:14px 5%;background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:800;line-height:1.15;letter-spacing:1px}.brand img{width:55px;height:55px;object-fit:contain}.brand small{font-size:12px;letter-spacing:5px}nav{display:flex;gap:30px;font-size:14px}nav a:hover,.textlink:hover{color:var(--orange)}.btn{display:inline-flex;justify-content:center;align-items:center;gap:24px;background:var(--orange);color:white;padding:17px 24px;font-weight:700;font-size:14px;border:1px solid var(--orange);transition:background .2s}.btn:hover{background:#913c1d}.btn.small{padding:12px 18px;font-size:13px}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:700px}.hero-copy{padding:72px 10% 45px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--orange);margin-bottom:24px}h1{font-size:clamp(48px,5.6vw,82px);line-height:1.03;letter-spacing:-4px;margin:0 0 26px;font-weight:600}em{font-family:Georgia,serif;font-weight:400;color:var(--orange)}p{color:#676b61;max-width:490px}h1+p{font-size:17px;margin-bottom:30px}.textlink{display:block;font-size:13px;margin-top:20px}.hero-facts{display:flex;gap:45px;margin-top:42px;padding-top:22px;border-top:1px solid var(--line)}.hero-facts strong,.hero-facts span{display:block}.hero-facts strong{font-size:19px}.hero-facts span{font-size:12px;color:#74796b}.hero-photo{position:relative;min-height:600px;margin:20px 20px 20px 0;overflow:hidden}.hero-photo>img{width:100%;height:100%;position:absolute;object-fit:cover;object-position:center}.hero-photo:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#152017b8)}.photo-tag{position:absolute;bottom:35px;left:35px;color:white;z-index:1}.photo-tag span{font-size:10px;letter-spacing:2px}.photo-tag strong{display:block;font-size:29px;line-height:1.2;margin-top:10px}.vertical{position:absolute;right:15px;top:25px;writing-mode:vertical-rl;color:white;font-size:9px;letter-spacing:2px}.ribbon{background:var(--ink);color:#eceee5;display:flex;justify-content:space-around;align-items:center;padding:23px 4%;font-size:16px}.ribbon b{color:#d28d63}.section{padding:95px 7%}.section-head{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:44px}.section-head>p{max-width:330px;font-size:14px}h2{font-size:clamp(34px,3.7vw,52px);line-height:1.13;letter-spacing:-1.8px;font-weight:500;margin:0 0 20px}h3{font-size:23px;line-height:1.25;letter-spacing:-.6px}.services{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.services article{padding:30px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .2s}.services article:hover{background:#eeeee5}.num{color:var(--orange);font-size:12px}.services p{font-size:14px}.options{background:#ecece3;display:grid;grid-template-columns:1fr 1fr;gap:70px}.options>div>p{font-size:15px}.option-cards article{padding:25px 0;border-top:1px solid #c6c9bb}.option-cards span{color:var(--orange);font-size:11px;letter-spacing:1px}.option-cards h3{margin:12px 0}.option-cards p{font-size:14px}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.gallery-item{border:0;padding:0;background:#e9eae1;cursor:zoom-in;text-align:left;color:var(--ink);overflow:hidden}.gallery-item:first-child{grid-column:span 2;grid-row:span 2}.gallery-item img{width:100%;height:230px;object-fit:cover;display:block;transition:transform .4s}.gallery-item:first-child img{height:519px}.gallery-item:hover img{transform:scale(1.025)}.gallery-item span{display:flex;justify-content:space-between;padding:12px;font-size:11px}.gallery-item b{color:var(--orange)}.video-block{margin-top:50px;display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:center;border-top:1px solid var(--line);padding-top:45px}.video-block h3{font-size:32px}.video-block video{width:100%;max-height:360px;background:#20231e}.dark{background:var(--ink);color:var(--paper)}.dark .eyebrow{color:#db966c}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:50px}.steps article{border-top:1px solid #64685c;padding-top:24px}.steps span{color:#df9b74;font-size:13px}.steps h3{font-size:20px}.steps p{font-size:14px;color:#b7bcad}.faq{display:grid;grid-template-columns:1fr 1.5fr;gap:55px}.questions details{border-bottom:1px solid var(--line);padding:20px 0}.questions summary{cursor:pointer;font-size:17px;font-weight:600}.questions p{font-size:14px}.contact{text-align:center;background:#e9e7dd}.contact p{margin:20px auto 30px}.contact h2{font-size:clamp(40px,5vw,68px)}.phone{display:block;font-size:14px;margin-top:18px}footer{display:flex;gap:20px;justify-content:space-between;align-items:center;padding:30px 7%;font-size:12px}footer .brand{font-size:14px}footer p{font-size:12px}.float-wa{position:fixed;bottom:20px;right:20px;background:#283e2e;color:white;padding:13px 20px;border-radius:30px;font-size:13px;box-shadow:0 5px 25px #0002;z-index:12}dialog{border:0;padding:12px;background:#f7f6f1;max-width:92vw;max-height:94vh}dialog::backdrop{background:#101610dd}dialog img{max-width:85vw;max-height:83vh;display:block;object-fit:contain}.close{display:block;margin:0 0 10px auto;border:0;background:none;cursor:pointer;font-size:23px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #dc8454;outline-offset:5px}@media(max-width:850px){nav{gap:15px}.hero-copy{padding:55px 8%}h1{letter-spacing:-2px}.section{padding:65px 6%}.gallery{grid-template-columns:repeat(2,1fr)}.gallery-item:first-child{grid-row:span 1}.gallery-item:first-child img{height:330px}.options{gap:30px}.steps{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){header{flex-wrap:wrap;gap:12px;padding:12px 5%}header .brand{font-size:14px}.brand img{width:40px;height:40px}.brand small{font-size:10px}header .btn.small{font-size:11px;padding:10px}nav{order:3;justify-content:space-between;width:100%;padding-top:8px;border-top:1px solid var(--line);font-size:12px}.hero{grid-template-columns:1fr}.hero-copy{padding:45px 6% 30px}h1{font-size:57px}.hero-photo{min-height:400px;margin:0 16px 16px}.hero-facts{margin-top:30px}.ribbon{font-size:11px;padding:19px 3%}.ribbon b{font-size:10px}.section-head{display:block;margin-bottom:28px}.section-head>p{max-width:none}.services{grid-template-columns:1fr 1fr}.services article{padding:20px}.services h3{font-size:19px}.services p{font-size:13px}.options,.faq,.video-block{grid-template-columns:1fr;gap:25px}.gallery-item img{height:210px}.gallery-item:first-child img{height:300px}.gallery{gap:10px}.gallery-item span{font-size:10px;padding:10px}.steps{gap:25px}.steps h3{font-size:18px}.steps p{font-size:13px}.contact .eyebrow{font-size:9px}footer{flex-direction:column;align-items:start;gap:3px;padding-bottom:80px}footer p{margin:7px 0}.float-wa{bottom:15px;right:15px}.photo-tag{left:25px;bottom:25px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

@media(min-width:851px){.steps{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* Readability: larger copy and stronger information hierarchy */
body{font-size:18px;line-height:1.65}
p{color:#50564b}
nav{font-size:16px;font-weight:600}
.eyebrow{font-size:13px;font-weight:800;letter-spacing:1.5px}
h1{font-weight:700}h2{font-weight:700}h3{font-weight:700}
h1+p{font-size:19px}
.btn,.btn.small{font-size:16px;font-weight:700}
.textlink{font-size:16px;font-weight:600}
.hero-facts strong{font-size:22px;font-weight:800}
.hero-facts span{font-size:15px;color:#50564b}
.section-head>p,.services p,.options>div>p,.option-cards p,.steps p,.questions p{font-size:17px}
.num,.steps span{font-size:16px;font-weight:700}
.option-cards span{font-size:13px;font-weight:700}
.steps h3{font-size:22px}
.gallery-item span{font-size:14px;font-weight:600}
.questions summary{font-size:20px;font-weight:700}
.phone{font-size:19px;font-weight:700}
.ribbon{font-size:18px;font-weight:600}
footer,footer p,footer small{font-size:14px}
.float-wa{font-size:16px;font-weight:700}
@media(max-width:850px){.services p,.steps p{font-size:17px}}
@media(max-width:600px){
body{font-size:17px}
nav{font-size:14px;gap:10px}
header .btn.small{font-size:13px;padding:12px}
.eyebrow{font-size:12px}
h1+p{font-size:18px}
.services{grid-template-columns:1fr}
.services article{padding:25px}
.services h3,.steps h3{font-size:22px}
.services p,.steps p,.section-head>p,.option-cards p,.questions p{font-size:17px}
.steps{grid-template-columns:1fr}
.gallery-item span{font-size:13px;line-height:1.4}
.ribbon{font-size:13px;gap:8px;flex-wrap:wrap}
.contact .eyebrow{font-size:12px;line-height:1.8}
.questions summary{font-size:19px}
footer p{font-size:14px}
}
/* Keep services and gallery introductions directly below their headings */
#layanan .section-head,#galeri .section-head{display:block;max-width:760px;margin-bottom:32px}
#layanan .section-head h2,#galeri .section-head h2{margin-bottom:16px}
#layanan .section-head>p,#galeri .section-head>p{max-width:660px;margin:0;line-height:1.65}
@media(max-width:600px){#layanan .section-head,#galeri .section-head{margin-bottom:26px}}
.options.section { padding-block: clamp(36px, 5vw, 64px); gap: clamp(24px, 4vw, 56px); }
.options > div:first-child .eyebrow { margin-bottom: 12px; }
.options > div:first-child h2 { margin: 0 0 12px; font-size: clamp(34px, 4vw, 54px); }
.options > div:first-child > p { margin: 0; font-size: clamp(18px, 1.8vw, 22px); line-height: 1.48; }
.options .option-cards article { padding-block: 18px; }
.options .option-cards p { margin-bottom: 0; }
