:root{--black:#0b0b0b;--ink:#17120f;--red:#a80f18;--red2:#741015;--gold:#d6a52a;--cream:#f4ead8;--paper:#fbf6ec}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Georgia,"Times New Roman",serif}
.topbar{height:76px;background:var(--black);color:white;display:flex;align-items:center;justify-content:space-between;padding:0 6vw;position:sticky;top:0;z-index:10;border-bottom:1px solid #2b2116}
.brand{display:flex;align-items:center;gap:13px;color:var(--gold);text-decoration:none}.brand strong{display:block;letter-spacing:2px;font-size:21px}.brand small{display:block;color:#fff;letter-spacing:3px;font:9px Arial,sans-serif;margin-top:3px}.mark{font-size:25px;letter-spacing:-8px;color:var(--gold);transform:translateY(-4px)}
nav{display:flex;gap:30px}nav a{color:#eee;text-decoration:none;text-transform:uppercase;font:11px Arial,sans-serif;letter-spacing:1.4px}nav a:hover{color:var(--gold)}
.hero{min-height:610px;position:relative;overflow:hidden;display:flex;align-items:center;padding:70px 8vw;background:radial-gradient(circle at 65% 45%,#efd7a6 0,#d2a66c 27%,#8b5435 50%,#251613 78%,#0b0b0b 100%);color:white}
.hero:after{content:"";position:absolute;inset:auto 0 0;height:150px;background:linear-gradient(transparent,rgba(0,0,0,.58))}
.hero-pattern{position:absolute;left:0;top:0;bottom:0;width:62px;background:repeating-linear-gradient(45deg,var(--red) 0 12px,var(--gold) 12px 15px,#16110e 15px 28px);opacity:.75;border-right:3px solid var(--gold)}
.hero-copy{position:relative;z-index:3;max-width:650px}.eyebrow{font:700 11px Arial,sans-serif;letter-spacing:2.4px;color:var(--red);margin-bottom:16px}.gold{color:var(--gold)}
h1,h2,h3,p{margin-top:0}h1{font-size:74px;line-height:.95;letter-spacing:-2px;margin-bottom:28px}h1 span{color:#ffd276}.lead{font-size:21px;line-height:1.55;margin-bottom:32px;text-shadow:0 2px 12px #000}
.button{display:inline-block;padding:15px 22px;text-decoration:none;color:white;text-transform:uppercase;font:700 11px Arial,sans-serif;letter-spacing:1.2px}.red{background:var(--red);border:1px solid #d04b43}
.gonjong{position:absolute;right:5vw;bottom:65px;width:480px;height:300px;z-index:2;filter:drop-shadow(0 16px 20px rgba(0,0,0,.4))}
.roof{position:absolute;bottom:115px;width:220px;height:120px;border-bottom:32px solid #17100e;border-radius:0 0 50% 50%;transform:skewY(-12deg)}.roof:after{content:"";position:absolute;width:8px;height:160px;background:#17100e;right:4px;bottom:-25px;transform:rotate(-24deg);transform-origin:bottom}.r1{left:10px}.r2{left:130px;bottom:135px;transform:scale(1.25) skewY(-12deg)}.r3{right:0}
.house{position:absolute;bottom:15px;left:75px;width:335px;height:130px;background:#4c271b;border:4px solid #bd7e28;display:flex;justify-content:space-around;padding-top:32px}.house span{height:80px;width:50px;border:3px solid #c79036;background:#251310}
.section{padding:78px 9vw}.section h2,.generations h2,.values h2{font-size:39px;line-height:1.15}.story{display:grid;grid-template-columns:1.15fr .85fr;gap:8vw;align-items:center;background:linear-gradient(90deg,#fffaf1,#f2e2c6)}.story p{font:16px/1.7 Arial,sans-serif;color:#4c433b;max-width:680px}.story h2 em{color:var(--red);font-style:normal}.story-card{padding:48px;background:#1a1512;color:#f9ecd1;border-top:5px solid var(--gold);box-shadow:0 18px 45px #a9906b55}.story-card blockquote{font-size:27px;line-height:1.45;margin:20px 0}.story-card span{font:11px Arial,sans-serif;color:#c8bba6}.ornament{font-size:28px;color:var(--gold)}
.generations{background:#0c0c0c;color:white;text-align:center;padding:65px 8vw}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:45px;position:relative}.timeline:before{content:"";position:absolute;left:10%;right:10%;top:34px;height:1px;background:var(--gold)}.timeline article{position:relative}.timeline b{position:relative;z-index:2;display:grid;place-items:center;margin:auto;width:70px;height:70px;border-radius:50%;background:#151515;border:2px solid var(--gold);color:var(--gold);font-size:25px}.timeline h3{margin:18px 0 5px;text-transform:uppercase;color:#f0c757;font:700 12px Arial,sans-serif;letter-spacing:1px}.timeline p{font:14px Arial,sans-serif;color:#ddd}
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:38px}.cards article{background:#fff;border:1px solid #e4d4bc;padding:28px 23px;min-height:230px;box-shadow:0 10px 25px #806b4a18}.cards span{color:var(--gold);font:700 26px Arial,sans-serif}.cards h3{margin-top:20px}.cards p{font:13px/1.55 Arial,sans-serif;color:#5c554d}.cards a{color:var(--red);text-decoration:none;font:700 11px Arial,sans-serif;text-transform:uppercase}
.values{padding:65px 9vw;background:linear-gradient(110deg,#721015,#9f1118 50%,#561015);color:white;display:grid;grid-template-columns:1.35fr repeat(4,1fr);gap:0}.values>div,.values article{padding:15px 28px;border-right:1px solid #d3a32955}.values article{text-align:center}.values article b{color:var(--gold);font-size:26px}.values article h3{color:#ffd45d;text-transform:uppercase;font:700 12px Arial,sans-serif;letter-spacing:1px;margin-top:15px}.values article p{font:12px/1.6 Arial,sans-serif;color:#f1dcd8}
footer{background:#090909;color:#eee;padding:48px 9vw}.footer-brand{margin-bottom:18px;width:max-content}footer p{font:13px Arial,sans-serif}.muted{color:#827c75;margin-top:25px}
@media(max-width:900px){nav{display:none}.hero{min-height:600px;padding-left:11vw}.hero-pattern{width:28px}.hero-copy{z-index:4}h1{font-size:52px}.gonjong{opacity:.35;right:-150px}.story{grid-template-columns:1fr}.timeline{grid-template-columns:1fr 1fr;gap:35px}.timeline:before{display:none}.cards{grid-template-columns:1fr 1fr}.values{grid-template-columns:1fr 1fr}.values>div{grid-column:1/-1}.values>div,.values article{border-right:0;border-bottom:1px solid #d3a32955}}
@media(max-width:560px){.topbar{padding:0 7vw}.brand strong{font-size:17px}.hero{padding:70px 11vw;min-height:560px}h1{font-size:43px}.lead{font-size:17px}.section{padding:58px 8vw}.section h2,.generations h2,.values h2{font-size:31px}.timeline,.cards,.values{grid-template-columns:1fr}.values>div{grid-column:auto}.story-card blockquote{font-size:22px}}