/* 홈 브랜드 한 문장 — "ANNO 각인" 디자인 (2026-11)
   검정 배경 위, 문장 뒤에 금색 테두리만 있는 큰 ANNO. 색·크기는 아래 --motto-* 값 한 곳에서 */

/* 이 구역 문장 전용 한글 세리프: Noto Serif KR Light (SIL Open Font License)
   파일에는 지금 문장에 쓰인 글자만 들어 있어 아주 가벼움(약 5KB). 문장을 바꾸면 없는 글자는 기본 글꼴로 보이니
   새 문장 글자로 다시 받아야 함(방법은 docs/진행상황.md). 다른 페이지·구역 글꼴에는 영향 없음 */
@font-face{font-family:"Motto Serif KR";font-style:normal;font-weight:300;font-display:swap;src:url("fonts/noto-serif-kr-300-motto.woff2") format("woff2")}

body.home main section.home-motto{
 --motto-gold:#B89A5E;
 --motto-ivory:#EDE6D3;
 --anno-size:clamp(110px,26vw,420px); /* 1920px 화면에서 420px, 그보다 좁으면 화면 안에 들어가게 */
 --anno-shift:0px; /* 스크롤 패럴랙스(스크립트가 바꿈) */
 position:relative;isolation:isolate;overflow:hidden;
 margin:0;max-width:none;padding:190px 6%;
 background:#000;color:var(--motto-ivory);text-align:center;border:0
}
/* 뒤의 큰 ANNO: 글자 안은 비우고 금색 1px 테두리만 */
.home-motto-anno{
 position:absolute;left:50%;top:50%;z-index:-1;
 transform:translate(-50%,calc(-50% + var(--anno-shift)));
 font:300 var(--anno-size)/1 "Cormorant Garamond",Georgia,serif;letter-spacing:.06em;padding-left:.06em;
 white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgb(184 154 94 / .28);
 pointer-events:none;user-select:none
}
body.home main section.home-motto .home-motto-since{
 margin:0 0 34px;max-width:none;color:var(--motto-gold);
 font:italic 400 13px/1.4 "Cormorant Garamond",Georgia,serif;letter-spacing:.2em;padding-left:.2em
}
body.home main section.home-motto .home-motto-text{
 margin:0 auto;max-width:none;color:var(--motto-ivory);
 font:300 clamp(26px,2.5vw,36px)/1.6 "Cormorant Garamond","Motto Serif KR","Noto Serif KR",Georgia,serif;
 letter-spacing:.01em;word-break:keep-all
}
.home-motto-text span{display:block}
body.home main section.home-motto .home-motto-mark{
 margin:40px 0 0;max-width:none;color:var(--motto-ivory);opacity:.7;
 font:500 12px/1 "Cormorant SC",Georgia,serif;letter-spacing:.42em;padding-left:.42em
}
@media (max-width:700px){
 body.home main section.home-motto{padding:110px 6%;--anno-size:24vw}
 body.home main section.home-motto .home-motto-text{font-size:22px}
 body.home main section.home-motto .home-motto-since{margin-bottom:26px}
 body.home main section.home-motto .home-motto-mark{margin-top:30px}
}

/* 모션: 화면에 들어올 때 ANNO 가 1.2초에 걸쳐 천천히 나타남(스크립트가 화면 아래에 있을 때만 .anno-wait 을 붙임 → 스크립트가 없으면 그냥 보임) */
.home-motto.anno-wait .home-motto-anno{opacity:0}
.home-motto.anno-in .home-motto-anno{opacity:1;transition:opacity 1.2s cubic-bezier(.16,1,.3,1)}
@media (prefers-reduced-motion:reduce){
 .home-motto.anno-wait .home-motto-anno{opacity:1}
 .home-motto.anno-in .home-motto-anno{transition:none}
 .home-motto-anno{transform:translate(-50%,-50%)}
}
