/* 홈 디자인 정리 1028 — /official/ 홈에만 건다. index.html의 링크 한 줄만 빼면 이전 화면으로 돌아간다.
   방향: 초대장을 펼치듯 읽히는 홈.
   - 사진 두 장(초대 영상, 제주 에스테이트 전경)만 화면 끝까지 넓히고, 글과 나머지 사진은 기존 1080 칸에 둔다.
   - 제목은 본명조 잉크색(회색 제목을 없앤다), 본문은 Pretendard 16px. 한글은 어절 단위로만 줄을 바꾼다.
   - Gloock은 숫자에만 쓴다(평형·대표번호). 오시는 길 지도의 '40분' 숫자와 같은 결.
   - '이제 제주에서'부터 '오직 TROON ESTATE JEJU'까지는 초대장처럼 가운데 정렬, 그 외는 왼쪽 정렬.
   - 제목과 뜻이 겹치는 영문 라벨(TROON ESTATE, LOCATION)은 숨긴다. 새 움직임은 넣지 않는다.
   - 색은 사이트에 있는 값만 쓴다.
   - 글자 크기·굵기·행간은 type-system-1028.css의 단계(--ts-display·--ts-title·--type-h1·--ts-lead)를 쓴다. */

body.eg-site.fg-home.aman-grid-review{
 --hd-ink:#23292b;--hd-slate:#687078;--hd-sage:#596156;--hd-line:#dce0dd;--hd-mist:#f1f3ee;
 --hd-serif:'Noto Serif KR',serif;--hd-num:Gloock,serif;
 --hd-header:96px;--hd-section:clamp(96px,11vw,168px);
}
/* 화면 끝까지 넓힌 사진이 세로 스크롤바 폭만큼 가로 스크롤을 만들지 않게 자른다(clip 미지원 브라우저는 hidden). */
body.eg-site.fg-home.aman-grid-review .page-scroll{overflow-x:hidden;overflow-x:clip}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main{word-break:keep-all;overflow-wrap:break-word}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main :is(h1,h2){text-wrap:balance}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main p{text-wrap:pretty}

/* 1. 초대 영상: 헤더 바로 아래에서 화면 끝까지. 첫 화면 높이를 넘지 않는다. */
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening{margin-top:0;margin-bottom:0}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .golf-frame{
 width:100vw;max-width:none;margin:0 calc(50% - 50vw);aspect-ratio:16/9;height:auto;
 max-height:calc(100svh - var(--hd-header));background:var(--hd-ink)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .golf-frame video{width:100%;height:100%;object-fit:cover}

/* 제목은 칸 전체에서 두 줄로, 소개는 그 아래 오른쪽 5칸. 소개 줄바꿈은 칸 폭에 맡긴다. */
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .opening-copy{
 display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:64px;row-gap:28px;
 margin:clamp(48px,6vw,88px) 0 0}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening #home-title{
 grid-column:1/-1;margin:0;font:300 var(--ts-title)/1.3 var(--hd-serif);letter-spacing:-.025em;color:var(--hd-ink)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .fg1-intro{
 grid-column:2;margin:0;max-width:26em;font-size:var(--type-body);line-height:1.8;color:var(--hd-slate)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .fg1-intro .fg1-br{display:none}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .fg1-troon-photo{margin-top:clamp(56px,6vw,88px)}

/* 2. 넘어가는 자리: '이제 제주에서'는 작게, '오직 TROON ESTATE JEJU'는 이 페이지에서 가장 큰 제목. */
body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening>.fg-arrival{
 margin:var(--hd-section) 0 0;text-align:center;
 font:400 var(--ts-lead)/1.7 var(--hd-serif);letter-spacing:-.01em;color:var(--hd-slate)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .fg-special-heading{margin:14px 0 clamp(40px,5vw,72px);text-align:center}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju-special-title{
 margin:0;font:300 var(--ts-display)/1.2 var(--hd-serif);letter-spacing:-.03em;color:var(--hd-ink)}

/* 3. 제주 에스테이트 전경: 화면 끝까지. 건물이 아래쪽에 있어 위(하늘)부터 자른다. */
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .fg-special>#jeju>figure{
 flex:none;width:100vw;max-width:none;margin:0 calc(50% - 50vw);
 max-height:calc(100svh - var(--hd-header));overflow:hidden}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .fg-special>#jeju>figure :is(a,img){
 display:block;width:100%;height:100%;max-height:inherit}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .fg-special>#jeju>figure img{object-fit:cover}

/* 전경 아래 소개: 바로 위 제목과 겹치는 영문 라벨은 숨기고, 실제 정보(평형·세대 수)를 크게 둔다.
   #jeju의 flex gap(adapter.css 48px)은 빼고 간격은 아래 margin으로만 잡는다. */
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .fg-special>#jeju{row-gap:0}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju.jeju-r46 .jeju-heading{
 grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:64px;align-items:baseline;
 margin:clamp(48px,5vw,72px) 0 clamp(32px,3vw,48px)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-heading .section-label{display:none}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju #jeju-title{
 margin:0;font:400 var(--type-h1)/1.4 var(--hd-serif);letter-spacing:-.02em;color:var(--hd-ink)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-heading-body p{
 margin:0;font:400 var(--ts-lead)/1.7 var(--hd-serif);letter-spacing:-.01em;color:var(--hd-ink)}

/* 네 가지 타입: 평형 숫자가 카드의 이름이다. 이름은 숫자 아래 작은 글씨. */
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-types{
 gap:clamp(16px,2.2vw,32px);padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--hd-line)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-type-card>span{
 display:flex;flex-direction:column;gap:6px;margin-top:18px;color:var(--hd-ink)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-type-card .type-size{
 margin:0;font:400 clamp(36px,3.6vw,52px)/1 var(--hd-num);letter-spacing:-.01em;color:var(--hd-ink)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-type-card .type-size small{
 margin-left:4px;font:400 14px/1 Pretendard,sans-serif;letter-spacing:0;color:var(--hd-slate)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-type-card .type-name{
 margin:0;font-size:12px;font-weight:500;line-height:1.5;letter-spacing:.12em;color:var(--hd-slate);
 text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-type-card:is(:hover,:focus-visible) .type-name{
 color:var(--hd-ink);text-decoration-color:currentColor}

/* 4. 골프 혜택 · 6성급 관리: 제목 크기를 위 섹션과 같은 단계로, 본문은 읽히는 크기로. */
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .home-feature-pair{margin-top:var(--hd-section);row-gap:clamp(64px,7vw,104px)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main :is(.gbl-head h2,.hk-copy h2,#home-location-title){
 font:400 var(--type-h1)/1.4 var(--hd-serif);letter-spacing:-.02em;color:var(--hd-ink)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main :is(.gbl-head,.hk-copy) .section-label{color:var(--hd-sage)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .golf-benefits-list h3{font-size:17px;line-height:1.5;color:var(--hd-ink)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .golf-benefits-list p{font-size:15px;line-height:1.8;color:var(--hd-slate)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main #chapter-03 .hk-copy>p:not(.section-label){
 max-width:30em;font-size:var(--type-body);line-height:1.8;color:var(--hd-slate)}

/* 5. 오시는 길: 대표번호를 Gloock 숫자로 크게, 지도 버튼은 페이지 색에 맞춘 테두리 버튼(앱 아이콘은 그대로). */
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .review-home-location{margin-top:clamp(24px,3vw,48px)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .review-home-location>header .section-label{display:none}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .review-home-location #location-contact p{
 margin:0;font-size:15px;line-height:1.8;color:var(--hd-slate)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .review-home-location #location-contact p+p{margin-top:10px}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .review-home-location #location-contact a[href^="tel:"]{
 font:400 clamp(30px,2.8vw,38px)/1.1 var(--hd-num);letter-spacing:.01em;color:var(--hd-ink);
 text-decoration:underline;text-decoration-color:transparent;text-underline-offset:6px;text-decoration-thickness:1px}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .review-home-location #location-contact a[href^="tel:"]:is(:hover,:focus-visible){text-decoration-color:currentColor}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .review-home-location .location-info .om-address{
 margin:20px 0 0;padding-top:20px;border-top:1px solid var(--hd-line);font-size:15px;line-height:1.8;color:var(--hd-slate)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #main .review-home-location .location-info .om-btns{
 display:grid;gap:10px;margin:24px 0 0}
body.eg-site.fg-home.fg-final-main.aman-grid-review #location a.om-btn{
 justify-content:flex-start;gap:12px;min-height:52px;padding:12px 20px;
 background:transparent;border:1px solid #c9cec9;border-radius:26px;color:var(--hd-ink);font-size:15px}
body.eg-site.fg-home.fg-final-main.aman-grid-review #location a.om-btn:is(:hover,:focus-visible){background:transparent;border-color:var(--hd-ink);color:var(--hd-ink)}
body.eg-site.fg-home.fg-final-main.aman-grid-review #location a.om-btn .review-map-logo{width:20px;height:20px}

/* 모바일: 한 칸으로, 영상은 좌우 여백 없이. 전경은 4:3으로 세로를 조금 더 준다. */
@media(max-width:700px){
 body.eg-site.fg-home.aman-grid-review{--hd-section:88px}
 body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .opening-copy{grid-template-columns:minmax(0,1fr);row-gap:16px;margin-top:36px;padding:0}
 body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .fg1-intro{grid-column:1}
 body.eg-site.fg-home.fg-final-main.aman-grid-review #main>.opening .fg1-troon-photo{margin-top:40px}
 body.eg-site.fg-home.fg-final-main.aman-grid-review #main .fg-special>#jeju>figure,
 body.eg-site.fg-home.fg-final-main.aman-grid-review #main .fg-special>#jeju>figure :is(a,img){aspect-ratio:4/3!important}
 body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju.jeju-r46 .jeju-heading{grid-template-columns:minmax(0,1fr);row-gap:12px;margin:40px 0 32px}
 body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-types{row-gap:32px}
 body.eg-site.fg-home.fg-final-main.aman-grid-review #main #jeju .jeju-type-card>span{margin-top:14px}
}
