/* =============================================================================
   VELOCEAN — international pages (/en/ · /tw/ · /cn/)
   styles.css 다음에 읽힌다. 색·서체 토큰은 styles.css 것을 그대로 쓰고,
   여기에는 외국어 페이지에만 있는 요소(언어 전환 · 상담 플로팅 · 요금 대조표 ·
   잔여 객실 · 문의 폼)만 둔다.
   ========================================================================== */
html[lang="zh-Hant"]{--serif:"Noto Serif TC","Noto Serif KR",serif;--sans:"Pretendard","PingFang TC","Microsoft JhengHei","Noto Sans TC",sans-serif}
html[lang="zh-Hans"]{--serif:"Noto Serif SC","Noto Serif KR",serif;--sans:"Pretendard","PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif}
html[lang="en"] body{word-break:normal;letter-spacing:0}
html[lang^="zh"] body{word-break:normal;letter-spacing:0}
html[lang^="zh"] h1,html[lang^="zh"] h2,html[lang^="zh"] h3{letter-spacing:0}

/* ---- hero: price line + text link ---------------------------------------- */
.hero-price{margin:24px 0 0;font-size:clamp(17px,2.2vw,21px);color:#fff;line-height:1.5}
.hero-price b{font-family:var(--sans);font-weight:700;font-size:1.4em;font-variant-numeric:tabular-nums lining-nums;color:var(--gold-2);letter-spacing:-.01em}
.hero-price s{color:rgba(255,255,255,.55);text-decoration-thickness:1px;margin-left:10px;font-size:.9em}
.hero-price small{display:block;font-size:14.5px;color:rgba(255,255,255,.72);margin-top:8px}
.page-hero .hero-cta{margin-top:30px}
.hero-cta .link{color:rgba(255,255,255,.82);font-size:15px;text-decoration:underline;text-underline-offset:4px;align-self:center}
.hero-cta .link:hover{color:#fff}
.page-hero .badge{margin-top:22px}

/* ---- honest note (why the discount) -------------------------------------- */
.reason{max-width:780px;padding-left:24px;border-left:2px solid var(--gold)}
.reason p{font-size:17px;line-height:1.85;color:var(--ink-txt);margin-bottom:16px}
.reason p:last-child{margin-bottom:0}
.sec-dark .reason p{color:var(--txt)}

/* ---- rates ledger (published vs this charter) ---------------------------- */
.rates{border-top:1px solid var(--line-dark);max-width:900px}
.rrow{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line-dark)}
.rrow.head{padding:12px 0;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);font-weight:600}
.rrow .n strong{display:block;font-size:17px;font-weight:600;color:var(--ink-txt)}
.rrow .n span{display:block;font-size:14px;color:var(--ink-dim);margin-top:3px}
.rrow .pub{font-variant-numeric:tabular-nums lining-nums;color:var(--ink-dim);font-size:16px}
.rrow .pub s{text-decoration-thickness:1px}
.rrow .now{font-variant-numeric:tabular-nums lining-nums;font-weight:700;font-size:23px;color:var(--ink-txt);white-space:nowrap;letter-spacing:-.01em}
.rrow .now small{display:block;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--sea);font-weight:700;margin-top:3px}
.rates-note{margin-top:16px;font-size:14.5px;color:var(--ink-dim);line-height:1.75;max-width:780px}
.sec-dark .rates{border-color:var(--line)}
.sec-dark .rrow{border-color:var(--line)}
.sec-dark .rrow .n strong{color:#fff}.sec-dark .rrow .n span{color:var(--txt-dim)}
.sec-dark .rrow .pub{color:var(--txt-dim)}.sec-dark .rrow .now{color:#fff}.sec-dark .rrow .now small{color:var(--gold-2)}
.sec-dark .rates-note{color:var(--txt-dim)}
@media(max-width:560px){
  .rrow{grid-template-columns:1fr auto;gap:4px 14px}
  .rrow .n{grid-column:1}.rrow .pub{grid-column:1;font-size:14px}
  .rrow .now{grid-column:2;grid-row:1/3;text-align:right;font-size:21px}
  .rrow.head{display:none}
}

/* ---- availability ----------------------------------------------------------- */
.avail{display:grid;grid-template-columns:1fr 1fr;gap:22px 48px;max-width:900px}
.avail .a h4{font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--sea);font-weight:700;margin-bottom:8px}
.avail .a p{font-size:17px;color:var(--ink-txt);line-height:1.75}
.avail .a p.none{color:var(--ink-dim)}
.avail .a a{display:inline-block;margin-top:10px;font-weight:600;color:var(--sea);text-decoration:underline;text-underline-offset:4px;font-size:15px}
.sec-dark .avail .a a{color:var(--gold-2)}
.sec-dark .avail .a h4{color:var(--gold-2)}.sec-dark .avail .a p{color:#fff}
@media(max-width:560px){.avail{grid-template-columns:1fr}}

/* ---- dive sites -------------------------------------------------------------- */
.dive-sites{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:8px;max-width:900px}
.dive-sites span{font-size:15.5px;color:var(--ink-txt);padding:6px 0;border-bottom:1px solid var(--line-dark)}

/* ---- contact channels (in page) --------------------------------------------- */
.channels{display:grid;grid-template-columns:repeat(4,1fr);gap:0 28px}
.channel{padding:22px 0;border-top:1px solid var(--line-dark)}
.channel .k{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);font-weight:600}
.channel .v{display:block;margin-top:8px;font-size:17px;font-weight:600;color:var(--ink-txt);font-variant-numeric:tabular-nums lining-nums;word-break:break-all}
a.channel .v:hover,.channel a:hover{color:var(--sea)}
.channel .h{font-size:13.5px;color:var(--ink-dim);margin-top:6px}
.sec-dark .channel{border-color:var(--line)}
.sec-dark .channel .k{color:var(--txt-dim)}.sec-dark .channel .v{color:#fff}.sec-dark .channel .h{color:var(--txt-dim)}
.sec-dark a.channel .v:hover{color:var(--gold-2)}
@media(max-width:920px){.channels{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.channels{grid-template-columns:1fr}}

/* ---- contact float (replaces the Kakao button on intl pages) ---------------- */
.contact-float{position:fixed;right:22px;bottom:22px;z-index:95;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.cf-main{display:inline-flex;align-items:center;gap:9px;background:var(--gold);color:#1a1206;font-weight:700;font-size:15px;
  padding:13px 20px 13px 16px;border-radius:100px;border:0;cursor:pointer;font-family:var(--sans);letter-spacing:-.01em;
  box-shadow:0 12px 30px rgba(20,20,20,.24);transition:transform .25s var(--ease),box-shadow .25s}
.cf-main:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(20,20,20,.3)}
.cf-main svg{width:20px;height:20px}
.cf-sheet{display:none;background:#fff;border-radius:12px;box-shadow:0 20px 60px rgba(10,25,34,.28);padding:8px;width:min(330px,calc(100vw - 44px))}
.contact-float.open .cf-sheet{display:block}
.cf-sheet a,.cf-sheet button{display:flex;align-items:center;gap:12px;width:100%;padding:11px 12px;border-radius:8px;border:0;background:none;
  font:inherit;font-size:15px;color:var(--ink-txt);cursor:pointer;text-align:left;font-family:var(--sans)}
.cf-sheet a:hover,.cf-sheet button:hover{background:var(--sand)}
.cf-sheet .ic{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none;font-size:11.5px;font-weight:800;letter-spacing:.02em}
.ic-wa{background:#25D366}.ic-line{background:#06C755}.ic-wc{background:#07C160}.ic-mail{background:var(--sea)}
.cf-sheet .t b{display:block;font-weight:600;line-height:1.3}
.cf-sheet .t span{display:block;font-size:13px;color:var(--ink-dim);margin-top:2px}
.cf-sheet .t span.copied{color:var(--ok);font-weight:600}
@media(max-width:560px){.contact-float{right:14px;bottom:14px}.cf-main{font-size:14px;padding:12px 18px 12px 14px}}

/* ---- inquiry form ------------------------------------------------------------ */
.inq{max-width:780px;position:relative}
.inq .row{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
.inq .f{display:flex;flex-direction:column;gap:6px;margin-bottom:22px}
.inq .f.full{grid-column:1/-1}
.inq label{font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-dim);font-weight:600}
.inq input,.inq select,.inq textarea{font:inherit;font-size:16px;color:var(--ink-txt);background:transparent;border:0;
  border-bottom:1px solid rgba(10,25,34,.28);padding:10px 0;border-radius:0;outline:none;transition:border-color .2s;width:100%}
.inq input:focus,.inq select:focus,.inq textarea:focus{border-bottom-color:var(--sea)}
.inq textarea{min-height:110px;resize:vertical}
.inq select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:28px;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-dim) 50%),linear-gradient(135deg,var(--ink-dim) 50%,transparent 50%);
  background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.inq .actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:4px}
.inq .btn[disabled]{opacity:.6;cursor:progress;transform:none}
.inq .msg{font-size:15.5px;line-height:1.6;max-width:520px}
.inq .msg.ok{color:var(--ok)}.inq .msg.err{color:#c2411d}
.inq .hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
.sec-dark .inq label{color:var(--txt-dim)}
.sec-dark .inq input,.sec-dark .inq select,.sec-dark .inq textarea{color:#fff;border-bottom-color:rgba(255,255,255,.3)}
.sec-dark .inq input:focus,.sec-dark .inq select:focus,.sec-dark .inq textarea:focus{border-bottom-color:var(--gold-2)}
.sec-dark .inq select{background-image:linear-gradient(45deg,transparent 50%,var(--txt-dim) 50%),linear-gradient(135deg,var(--txt-dim) 50%,transparent 50%)}
.sec-dark .inq select option{color:#1a2a33}
.sec-dark .inq .msg.ok{color:#6fd8a4}.sec-dark .inq .msg.err{color:#ff9273}
@media(max-width:560px){.inq .row{grid-template-columns:1fr}}

/* ---- small things -------------------------------------------------------------- */
.sec-dark .notes .note{background:rgba(255,255,255,.04);border-color:var(--line)}
.sec-dark .note h4{color:#fff}.sec-dark .note li,.sec-dark .note p{color:var(--txt-dim)}
.sec-dark .incl h4{color:#fff}
.sec-dark .tl .d{color:var(--gold-2)}.sec-dark .tl{border-color:var(--line)}.sec-dark .tl .t strong{color:#fff}.sec-dark .tl .t span{color:var(--txt-dim)}
.lead-note{font-size:16px;color:var(--ink-dim);max-width:720px;line-height:1.8}
.who{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:start;max-width:1000px}
.who p{font-size:16.5px;line-height:1.85;color:var(--ink-dim)}
.who .facts{display:grid;gap:14px}
.who .facts div{padding:14px 0;border-top:1px solid var(--line-dark)}
.who .facts b{display:block;font-size:17px;color:var(--ink-txt)}
.who .facts span{font-size:14.5px;color:var(--ink-dim)}
@media(max-width:920px){.who{grid-template-columns:1fr}}
.faq{max-width:820px}
.faq details{border-top:1px solid var(--line-dark);padding:4px 0}
.faq details:last-child{border-bottom:1px solid var(--line-dark)}
.faq summary{cursor:pointer;list-style:none;padding:18px 34px 18px 0;font-size:17px;font-weight:600;color:var(--ink-txt);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:14px;font-size:24px;color:var(--gold);font-weight:300}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 0 20px;font-size:15.5px;line-height:1.8;color:var(--ink-dim);max-width:720px}
.faq .a p{margin-bottom:10px}.faq .a p:last-child{margin-bottom:0}
.terms{max-width:820px}
.terms h3{font-family:var(--serif);font-size:24px;margin:34px 0 14px;color:var(--ink-txt)}
.terms h3:first-child{margin-top:0}
.terms ol,.terms ul{padding-left:22px;display:grid;gap:10px}
.terms li{font-size:15.5px;line-height:1.75;color:var(--ink-txt)}
.terms p{font-size:15.5px;line-height:1.8;color:var(--ink-dim);margin-bottom:12px}