*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:17px;line-height:1.7;scroll-behavior:smooth}
body{background-color:#E8E4DE;color:#3A3530;font-family:'Work Sans',sans-serif;font-weight:300;overflow-x:hidden}

.site-nav{position:fixed;top:0;left:0;width:100%;padding:16px 24px;display:flex;justify-content:space-between;align-items:center;z-index:100;opacity:0;transition:opacity 300ms ease-out}
.site-nav.visible{opacity:1}
.nav-domain{font-family:'Space Mono',monospace;font-size:0.7rem;font-weight:700;color:#3A3530;letter-spacing:0.06em}
.nav-kanji{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:600;color:#C4A882}

.wire-line{position:relative;width:0;height:1px;background:#B8B0A0;margin:80px auto 0;transition:width 500ms ease-out}
.wire-line.visible{width:90%}

.bulletin-board{max-width:1100px;margin:0 auto;padding:40px 24px 80px}

.hero-card{position:relative;max-width:560px;margin:48px auto 56px;background:#F5F0E8;border:1px solid #DDD8CC;padding:0;opacity:0;transform:translateY(-8px);transition:opacity 600ms ease-out,transform 600ms ease-out}
.hero-card.visible{opacity:1;transform:translateY(0)}
.hero-card .card-inner{padding:40px 36px}

.tape-strip{position:absolute;background:rgba(196,168,130,0.3);border:1px solid rgba(196,168,130,0.15)}
.tape-top{top:-6px;left:50%;transform:translateX(-50%);width:60px;height:12px}
.tape-corner-tl{top:-4px;left:12px;width:40px;height:10px;transform:rotate(-5deg)}
.tape-corner-tr{top:-4px;right:12px;width:40px;height:10px;transform:rotate(3deg)}

.hero-stamp{font-family:'Space Mono',monospace;font-size:0.6rem;font-weight:700;color:#8A8478;letter-spacing:0.12em;text-transform:uppercase;margin-bottom:16px}
.hero-title{font-family:'Cormorant Garamond',serif;font-weight:600;font-style:italic;font-size:2.8rem;line-height:1.2;color:#3A3530;margin-bottom:20px}
.hero-body{font-family:'Work Sans',sans-serif;font-weight:300;font-size:0.95rem;color:#6B4C3B;line-height:1.7}

.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:32px}

.notice-card{position:relative;background:#F5F0E8;border:1px solid #DDD8CC;transition:transform 300ms ease,box-shadow 300ms ease;opacity:0;transform-origin:center}
.notice-card.visible{opacity:1}
.notice-card:hover{box-shadow:0 4px 16px rgba(58,53,48,0.1);z-index:5}
.notice-card .card-inner{padding:28px 24px}

.card-aged-1{background:#F5F0E8}
.card-aged-2{background:#F0EBE3}
.card-aged-3{background:#EDE8E0}

.card-aged-1 .card-inner{background-image:repeating-radial-gradient(circle at 1px 1px,rgba(58,53,48,0.02) 0px,transparent 1px);background-size:3px 3px}
.card-aged-2 .card-inner{background-image:repeating-radial-gradient(circle at 2px 2px,rgba(58,53,48,0.025) 0px,transparent 1px);background-size:4px 4px}
.card-aged-3 .card-inner{background-image:repeating-radial-gradient(circle at 1px 1px,rgba(58,53,48,0.03) 0px,transparent 1px);background-size:3px 3px}

.card-stamp{font-family:'Space Mono',monospace;font-size:0.6rem;font-weight:700;color:#C4A882;letter-spacing:0.1em;display:block;margin-bottom:10px}
.card-heading{font-family:'Cormorant Garamond',serif;font-weight:600;font-style:italic;font-size:1.3rem;line-height:1.3;color:#3A3530;margin-bottom:12px}
.card-text{font-family:'Work Sans',sans-serif;font-weight:300;font-size:0.85rem;color:#6B4C3B;line-height:1.65;margin-bottom:16px}
.card-date{font-family:'Space Mono',monospace;font-size:0.6rem;color:#8A8478;letter-spacing:0.06em}

.watercolor-wash{position:absolute;border-radius:40% 60% 50% 45%;opacity:0.08;background:#C4A882;pointer-events:none;z-index:0}

.site-footer{max-width:1100px;margin:0 auto;padding:0 24px 48px}
.footer-wire{height:1px;background:#C8C0B0;margin-bottom:16px}
.footer-text{font-family:'Space Mono',monospace;font-size:0.65rem;color:#8A8478;text-align:center;letter-spacing:0.04em}

@media(max-width:768px){
    .hero-title{font-size:2rem}
    .card-grid{grid-template-columns:1fr}
    .notice-card{transform:rotate(0deg) !important}
}