:root{--gold:#b78328;--brown:#3c2412;--cream:#fff9ef;--text:#222}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP","Hiragino Sans",Meiryo,sans-serif;color:var(--text);background:var(--cream);line-height:1.75}
.hero{background:#fff;overflow:hidden}.hero img{width:100%;display:block}
main{max-width:980px;margin:auto;padding:28px 18px 48px}
.intro,.about,.contact{background:rgba(255,255,255,.88);border:1px solid #ead8bd;border-radius:20px;padding:28px;margin:18px 0;box-shadow:0 8px 28px rgba(98,67,26,.08)}
.label{color:var(--gold);font-weight:700;letter-spacing:.08em;margin:0 0 8px}
h1{font-size:clamp(30px,7vw,54px);line-height:1.18;margin:0 0 14px;color:var(--brown)}
h2{font-size:24px;margin:0 0 10px;color:var(--brown)}
p{font-size:17px;margin:0 0 12px}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.cta a,.mail{display:inline-block;text-decoration:none;background:var(--gold);color:#fff;border-radius:999px;padding:12px 22px;font-weight:700}
.cta a.secondary{background:#fff;color:var(--brown);border:1px solid #d8bb85}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:22px 0}
.cards article{background:#fff;border:1px solid #ead8bd;border-radius:18px;padding:20px;box-shadow:0 8px 24px rgba(98,67,26,.06)}
.cards h2{font-size:20px}.cards p{font-size:15px}
.contact{text-align:center}footer{text-align:center;color:#7b654a;padding:28px}
@media(max-width:760px){.cards{grid-template-columns:1fr 1fr}main{padding:18px 12px 40px}.intro,.about,.contact{padding:22px}}
@media(max-width:480px){.cards{grid-template-columns:1fr}}