/* home-au: 시드니·호주 메인(home-sydney.html) 전용. 다섯 층 띠·한눈에 지도·기본/예약/따로 맡기기 카드·진행·질문.
   색은 home-dark 이름을 그대로 쓰고, 층 번호·가격만 금색(--gold)으로 — 위 메뉴의 시드니 알약과 같은 색. */
:root{--gold:#f0cf7a;--gold-line:rgba(240,207,122,.45);--card:#10141c}

/* 층 띠: 층이 바뀌는 자리 */
.layer-band{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(16px,3vw,40px);
  padding:clamp(36px,4.5vw,64px) clamp(20px,5vw,72px) clamp(20px,2.4vw,30px);border-top:1px solid var(--hair);scroll-margin-top:64px;
  background:linear-gradient(180deg,rgba(240,207,122,.06),transparent 85%)}
.layer-band>b{font:600 clamp(40px,5vw,72px)/1 'IBM Plex Mono',monospace;color:var(--gold);letter-spacing:-.04em}
.layer-band small{display:block;font-size:13px;font-weight:800;letter-spacing:.06em;color:var(--gold);margin-bottom:6px}
.layer-band h2{font-size:clamp(26px,3.2vw,44px);font-weight:900;line-height:1.15;letter-spacing:-.045em;text-wrap:balance}
.layer-band>span{border:1px solid var(--gold-line);color:var(--gold);border-radius:999px;padding:10px 18px;font-weight:800;font-size:15px;white-space:nowrap}

/* 한눈에: 층마다 그림 카드 — 글 목록만으로는 누르는 곳인지 몰라서(2026-10-16 마스터). 그림 = 그 층의 실제 예시 화면 */
.ladder-list{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin:0;padding:0}
.ladder-list li{grid-column:span 2}
html:not([data-region="au"]) .ladder-list li:nth-child(n+4){grid-column:span 3}
.ladder-list a{display:flex;flex-direction:column;height:100%;padding:10px 10px 18px;border:1px solid var(--hair);border-radius:20px;background:var(--card);transition:border-color .2s,transform .2s}
.ladder-list a:hover,.ladder-list a:focus-visible{border-color:var(--gold-line);transform:translateY(-4px)}
.lc-img{position:relative;display:block;height:clamp(170px,17vw,250px);border-radius:13px;overflow:hidden;background:#1a2030;margin-bottom:14px}
.lc-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.ladder-list a:hover .lc-img img,.ladder-list a:focus-visible .lc-img img{transform:scale(1.04)}
.lc-img b{position:absolute;left:12px;top:12px;font:600 17px/1 'IBM Plex Mono',monospace;color:var(--gold);background:rgba(8,10,14,.82);border-radius:999px;padding:7px 11px}
.lc-img i{position:absolute;right:12px;bottom:12px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:800;font-size:19px;color:#191600;background:var(--gold);box-shadow:0 6px 16px rgba(0,0,0,.4);transition:transform .2s}
.ladder-list a:hover .lc-img i,.ladder-list a:focus-visible .lc-img i{transform:translateY(3px)}
.ladder-list small,.ladder-list h3,.ladder-list em{margin:0 8px}
.ladder-list small{font-size:12.5px;font-weight:800;letter-spacing:.04em;color:var(--gold)}
.ladder-list h3{margin-top:4px;font-size:clamp(17px,1.5vw,20px);font-weight:800;letter-spacing:-.03em;line-height:1.3;text-wrap:balance}
.ladder-list em{margin-top:auto;padding-top:10px;font-style:normal;font-weight:800;font-size:15px;color:var(--ink2)}

/* 1층 끝: 한국어·영어 + 구글 지도 */
.basics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.basics-grid article{border:1px solid var(--hair);border-radius:20px;background:var(--card);padding:28px;display:grid;gap:18px;align-content:start}
.lang-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lang-pair div{border:1px solid var(--rule);border-radius:14px;padding:18px}
.lang-pair small{font-size:12px;font-weight:800;color:var(--gold)}
.lang-pair b{display:block;font-size:22px;margin-top:8px;letter-spacing:-.03em}
.lang-pair span{display:block;font-size:13.5px;color:var(--ink2);margin-top:8px}
.lang-arrow i{font-style:normal;display:inline-block;background:#fee500;color:#191600;border-radius:999px;padding:8px 16px;font-weight:800;font-size:14.5px}
.mini-map{position:relative;height:190px;border-radius:14px;overflow:hidden;background:#e7edf2;
  background-image:linear-gradient(90deg,transparent 47%,#fff 47% 51%,transparent 51%),linear-gradient(0deg,transparent 56%,#fff 56% 60%,transparent 60%),linear-gradient(30deg,transparent 68%,#d4e6cf 68%)}
.mini-map .pin,.ex-map .pin{position:absolute;left:46%;top:18%;width:30px;height:30px;border-radius:50% 50% 50% 0;background:#e2463b;transform:rotate(-45deg);box-shadow:0 6px 12px rgba(0,0,0,.25)}
.map-info{position:absolute;left:14px;right:14px;bottom:14px;background:#fff;color:#1d2a35;border-radius:12px;padding:12px 14px;font-size:13px;line-height:1.5}
.map-info b{display:block;font-size:16px}.map-info span{color:#5c6b77}.map-info em{display:block;font-style:normal;color:#1a73e8;font-weight:700}
.map-card>p:last-child{color:var(--ink2);font-size:15px;line-height:1.6}

/* 2층: 예약·견적 */
.book-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.book-card{display:grid;grid-template-rows:auto 1fr;border:1px solid var(--hair);border-radius:20px;overflow:hidden;background:var(--card);transition:border-color .2s,transform .2s}
.book-card:hover,.book-card:focus-visible{border-color:var(--gold-line);transform:translateY(-3px)}
.book-card img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:top;display:block}
.book-card div{padding:20px 22px 22px;display:grid;gap:6px}
.book-card small{font-size:12.5px;font-weight:800;color:var(--gold)}
.book-card b{font-size:20px;letter-spacing:-.03em}
.book-card span{font-size:14.5px;color:var(--ink2);line-height:1.5}
.book-card em{font-style:normal;font-weight:800;margin-top:6px}
.book-sec .fine,.services .fine{margin-top:18px;font-size:13.5px;color:var(--ink2)}
.book-sec .fine a{border-bottom:1px solid var(--rule)}

/* 5층: 따로 맡기는 일 */
.extra-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.extra-grid article{border:1px solid var(--hair);border-radius:20px;background:var(--card);padding:0 0 24px;overflow:hidden;display:grid;gap:8px;align-content:start}
.extra-grid article>:not(.ex-img){margin:0 24px}
.ex-img{height:180px;overflow:hidden;background:#1a2030;position:relative;margin-bottom:12px}
.ex-img img{width:100%;height:100%;object-fit:cover;object-position:top}
.ex-map{background:#e7edf2;background-image:linear-gradient(90deg,transparent 47%,#fff 47% 51%,transparent 51%),linear-gradient(0deg,transparent 56%,#fff 56% 60%,transparent 60%),linear-gradient(30deg,transparent 68%,#d4e6cf 68%)}
.ex-map .pin{top:34%}
.ex-care{display:grid;align-content:center;gap:12px;padding:0 28px}
.ex-care i{display:block;height:12px;border-radius:99px;background:linear-gradient(90deg,var(--gold) var(--w,70%),rgba(255,255,255,.08) 0)}
.ex-care i:nth-child(2){--w:45%}.ex-care i:nth-child(3){--w:85%}
.extra-grid small{font-size:12.5px;font-weight:800;color:var(--gold)}
.extra-grid h3{font-size:21px;letter-spacing:-.03em}
.extra-grid p{font-size:14.5px;color:var(--ink2);line-height:1.6}
.extra-grid b{font-size:20px;margin-top:6px}

/* 비용: 첫 3곳 */
.price-extra.founding{border-color:var(--gold-line)!important}
.price-extra.founding h3,.price-extra.founding b{color:var(--gold)}

/* 진행·질문 */
.steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0;padding:0}
.steps li{counter-increment:s;border:1px solid var(--hair);border-radius:18px;background:var(--card);padding:22px}
.steps li::before{content:"0" counter(s);display:block;font:600 22px/1 'IBM Plex Mono',monospace;color:var(--gold);margin-bottom:14px}
.steps b{font-size:18px}.steps p{margin-top:8px;font-size:14.5px;color:var(--ink2);line-height:1.6}
.how .faq{margin-top:30px;display:grid;gap:10px;max-width:860px}
.how .faq details{border:1px solid var(--hair);border-radius:14px;padding:16px 20px;background:var(--card)}
.how .faq summary{cursor:pointer;font-weight:800;list-style:none}
.how .faq summary::-webkit-details-marker{display:none}
.how .faq summary::before{content:"Q. ";color:var(--gold)}
.how .faq p{margin-top:10px;font-size:15px;color:var(--ink2);line-height:1.65}

@media (max-width:900px){
  .book-grid,.extra-grid{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  .layer-band{grid-template-columns:auto minmax(0,1fr);row-gap:12px}
  .layer-band>span{grid-column:1/-1;justify-self:start;font-size:14px;padding:8px 14px}
  .ladder-list{grid-template-columns:1fr 1fr;gap:10px}
  .ladder-list li,html:not([data-region="au"]) .ladder-list li:nth-child(n+4){grid-column:span 1}
  html:not([data-region="au"]) .ladder-list li:first-child{grid-column:span 2}
  .ladder-list a{padding:7px 7px 14px;border-radius:16px}
  .lc-img{height:118px;margin-bottom:10px;border-radius:10px}
  html:not([data-region="au"]) .ladder-list li:first-child .lc-img{height:170px}
  .lc-img b{font-size:13px;padding:5px 8px;left:8px;top:8px}
  .lc-img i{width:32px;height:32px;font-size:15px;right:8px;bottom:8px}
  .ladder-list small,.ladder-list h3,.ladder-list em{margin:0 5px}
  .ladder-list small{font-size:11.5px}
  .ladder-list h3{font-size:15px;margin-top:3px}
  .ladder-list em{font-size:13px;padding-top:6px}
  .basics-grid,.book-grid,.extra-grid,.steps{grid-template-columns:1fr}
  .basics-grid article{padding:20px}
  .lang-pair b{font-size:18px}
}

/* 한 장 + 지역 자동(home-main.html, 2026-10-11): 6층 두 칸 · 지역 바꾸기 줄 · 자동 답장 자세히 · 2층 업종 바로가기 */
.extra-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.region-note{margin-top:14px;font-size:14.5px;color:var(--ink2)}
.region-note a{color:var(--gold);font-weight:800;border-bottom:1px solid var(--gold-line)}
.channel-side .ch-more{justify-self:start;margin-top:18px}
.book-sec .try-more{margin-top:22px}
@media (max-width:700px){.extra-grid.two{grid-template-columns:1fr}}
/* 한국판 비용 카드는 숫자 대신 "상담 후 견적" — 큰 숫자 크기로 세 번 되풀이되지 않게 */
html[data-region="ko"] .price-ledger .price-card strong{font-size:clamp(22px,1.9vw,26px)}
/* 견적 화면 캡처 그림은 왼쪽(가게 이름·제목)부터 보이게 */
.book-card img[src*="/exp-"]{object-position:left top}
/* 중간 폭(태블릿): 위 메뉴가 로고와 겹치지 않게 한눈에·자동 답장·작업은 숨긴다(한눈에 목록·층 띠로 갈 수 있다) */
@media (min-width:701px) and (max-width:1080px){.top nav a[href="#ladder"],.top nav a[href="#layer-3"],.top nav a[href="#works"]{display:none}}

/* 05층 콘텐츠(v134) */
.ct-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:-6px 0 8px}
.ct-tabs a{border:1px solid var(--rule);border-radius:999px;padding:9px 15px;font-size:14.5px;font-weight:700;color:var(--ink)}
.ct-tabs a:hover,.ct-tabs a:focus-visible{border-color:var(--gold-line)}
.ct-block{border-top:1px solid var(--hair);padding-top:clamp(22px,2.6vw,32px);margin-top:clamp(22px,2.6vw,32px);scroll-margin-top:72px}
.ct-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px 20px;flex-wrap:wrap}
.ct-head h3{font-size:clamp(20px,1.9vw,26px);letter-spacing:-.03em}
.ct-head h3 small{font-size:14.5px;font-weight:600;color:var(--ink2);margin-left:8px;letter-spacing:0}
.ct-head b{font-size:15px;color:var(--gold)}
.ct-lede{margin:8px 0 18px;font-size:15px;color:var(--ink2);line-height:1.65;max-width:46em}
.pair-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pair-row figure{margin:0;border:1px solid var(--hair);border-radius:18px;overflow:hidden;background:var(--card)}
.pair-row img{width:100%;aspect-ratio:9/16;object-fit:cover;display:block;max-height:520px}
.pair-row figcaption,.ad-card figcaption{padding:12px 16px 14px;font-size:14.5px;font-weight:700}
.ad-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ad-card{margin:0;border:1px solid var(--hair);border-radius:18px;overflow:hidden;background:var(--card)}
.ad-card video{width:100%;aspect-ratio:9/16;display:block;background:#000;max-height:560px;object-fit:cover}
.ad-card figcaption{display:grid;gap:2px}
.ad-card small{font-size:12.5px;font-weight:800;color:var(--gold)}
.ad-card span{font-size:13.5px;color:var(--ink2);font-weight:500}
@media (max-width:700px){
  .pair-row,.ad-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
  .pair-row figure,.ad-card{scroll-snap-align:start}
}
