@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500;1,600&display=swap');
:root{--cream:#f2eadb;--dark:#17130f;--brown:#4b2e1f;--accent:#c9945b;--line:#d4c7b5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--dark);font-family:'DM Sans',sans-serif;line-height:1.6}.navbar{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 6%;position:relative;z-index:10;background:var(--cream);border-bottom:1px solid var(--line)}.brand{font-weight:700;letter-spacing:2px;color:var(--dark);text-decoration:none;font-size:19px}.brand span{font-weight:400}.navbar nav{display:flex;gap:28px}.navbar nav a{color:var(--dark);text-decoration:none;font-size:12px;text-transform:uppercase;letter-spacing:1px;padding:8px 0}.navbar nav a.active,.navbar nav a:hover{border-bottom:1px solid var(--dark)}.menu{display:none;background:none;border:0;font-size:25px}.hero{height:calc(100vh - 82px);min-height:600px;background:linear-gradient(90deg,rgba(15,11,8,.78),rgba(15,11,8,.15)),url('../images/hero.jpg') center/cover;display:flex;align-items:center;padding:0 9%;color:#fff}.hero-overlay{max-width:700px}.eyebrow{font-size:11px;letter-spacing:3px;font-weight:700;margin:0 0 18px}.hero h1{font-size:clamp(70px,13vw,180px);line-height:.78;margin:0 0 35px;letter-spacing:-7px}.hero h1 em,.page-head em,h2 em{font-family:'Playfair Display',serif;font-weight:500}.hero p:not(.eyebrow){font-size:19px;margin-bottom:30px}.btn{display:inline-block;border:1px solid currentColor;padding:13px 20px;color:inherit;background:transparent;text-decoration:none;font-size:11px;letter-spacing:1.5px;font-weight:700;cursor:pointer}.btn:hover{background:var(--dark);color:#fff}.intro{padding:110px 9%;display:grid;grid-template-columns:1.1fr .9fr;gap:10%;align-items:end}.intro h2{font-size:clamp(42px,6vw,76px);line-height:1;margin:0}.intro>p{font-size:17px;max-width:500px}.cards{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin:0 9% 100px}.cards article{padding:40px 25px 25px 0;border-right:1px solid var(--line)}.cards article+article{padding-left:25px}.cards span{font-size:12px;color:#8d745d}.cards h3{font-size:27px;margin:15px 0 5px}.page{padding:90px 9%;min-height:calc(100vh - 150px)}.page-head{margin-bottom:90px}.page-head h1{font-size:clamp(55px,8vw,105px);line-height:.92;margin:0;letter-spacing:-3px}.split{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.photo{min-height:520px;background:center/cover}.photo-story{background-image:url('../images/gallery/story.jpg'),linear-gradient(135deg,#765238,#20150f)}.split h2{font-size:45px;line-height:1.1}.split p{max-width:540px}.products{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.product{border-top:1px solid var(--line);padding-top:15px}.product-img{height:380px;background:center/cover;margin-bottom:22px}.p1{background-image:url('../images/product/kota-blend.jpg'),linear-gradient(135deg,#7a5137,#24150d)}.p2{background-image:url('../images/product/jawa.jpg'),linear-gradient(135deg,#9a714e,#332217)}.p3{background-image:url('../images/product/sumatra.jpg'),linear-gradient(135deg,#4f3929,#15100c)}.product small{font-size:10px;letter-spacing:2px}.product h2{margin:8px 0 3px;font-family:'Playfair Display',serif;font-size:32px}.product p{margin:0 0 15px;color:#6b5b4d}.product b{font-size:14px}.timeline{border-top:1px solid var(--line)}.timeline>div{display:grid;grid-template-columns:80px 1fr 1.3fr;gap:30px;padding:35px 0;border-bottom:1px solid var(--line);align-items:center}.timeline span{font-size:12px}.timeline h2{font-family:'Playfair Display',serif;font-size:42px;margin:0}.timeline p{margin:0;max-width:550px}.gallery{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:250px;gap:15px}.g{background-size:cover;background-position:center;filter:saturate(.8)}.g1{grid-row:span 2;background-image:url('../images/gallery/01.jpg'),linear-gradient(135deg,#5b3d29,#20150e)}.g2{background-image:url('../images/gallery/02.jpg'),linear-gradient(135deg,#947052,#322217)}.g3{background-image:url('../images/gallery/03.jpg'),linear-gradient(135deg,#62442f,#21140d)}.g4{background-image:url('../images/gallery/04.jpg'),linear-gradient(135deg,#b08b63,#3b291c)}.g5{background-image:url('../images/gallery/05.jpg'),linear-gradient(135deg,#4d3628,#17110d)}.g6{grid-column:span 2;background-image:url('../images/gallery/06.jpg'),linear-gradient(135deg,#816044,#241811)}.video-wrap{max-width:1000px}.video-wrap video{width:100%;display:block;background:#19130f}.video-note{font-size:13px;color:#6b5b4d}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10%;max-width:1000px}.contact-grid h2{font-family:'Playfair Display',serif;font-size:48px}.contact-grid p{margin:25px 0}.contact-grid form{display:flex;flex-direction:column;gap:20px}.contact-grid label{font-size:11px;text-transform:uppercase;letter-spacing:1px}.contact-grid input,.contact-grid textarea{width:100%;margin-top:8px;padding:14px;background:transparent;border:1px solid var(--line);font:inherit;resize:vertical}.contact-grid form .btn{color:var(--dark);align-self:flex-start}footer{padding:30px 9%;border-top:1px solid var(--line);font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#6b5b4d}@media(max-width:800px){.navbar{height:70px}.navbar nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--cream);padding:20px 7%;flex-direction:column;gap:10px;border-bottom:1px solid var(--line)}.navbar nav.show{display:flex}.menu{display:block}.hero{height:calc(100vh - 70px);padding:0 7%}.intro,.split,.contact-grid{grid-template-columns:1fr}.intro{gap:40px;padding:80px 7%}.cards{grid-template-columns:1fr;margin:0 7% 70px}.cards article,.cards article+article{border-right:0;border-bottom:1px solid var(--line);padding:30px 0}.page{padding:70px 7%}.page-head{margin-bottom:55px}.products{grid-template-columns:1fr}.product-img{height:430px}.timeline>div{grid-template-columns:50px 1fr;gap:15px}.timeline p{grid-column:2}.gallery{grid-template-columns:1fr 1fr;grid-auto-rows:190px}.g1{grid-row:span 1}.g6{grid-column:span 1}.split .photo{min-height:380px}.hero h1{letter-spacing:-4px}}