/* ============================================================
   /tw/ (zh-Hant-TW) page — overrides only. Layout and parts come
   from the shared LP stylesheets; this file changes the typeface
   and adjusts the few places where the Japanese page relies on
   parts this page does not load (header menu, store badges).
   ============================================================ */

/* Shared stylesheets name 'Noto Sans JP' on many selectors, which would
   render Traditional Chinese with Japanese glyph forms. A locale-wide
   override is the one place where !important is the simpler choice. */
body.lp-tw *:not(.brand__wordmark) {
    font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Header has no menu button here: keep the pill off the screen edge. */
@media (max-width: 759px) {
    .lp-tw .lp-top-links__actions {
        padding-right: 14px;
    }
}

.lp-tw .hero__lead.tw-hero__lead {
    display: block;
}

/* Final CTA: one primary button, then the two store links as quiet buttons
   (the shared store badge images are the Japanese versions). */
.lp-tw .fnv2 .tw-final__cta {
    width: min(100%, 330px);
    margin: 18px auto 0;
}

.lp-tw .tw-final__stores {
    display: flex;
    gap: 10px;
    width: min(100%, 330px);
    margin: 12px auto 0;
}

.lp-tw .tw-final__stores .fnv2__consult {
    flex: 1 1 0;
    width: auto;
    margin: 0;
}

/* Launch note (2026-10-25, Taiwan launch campaign): one quiet strip right
   under the fixed header. The hero keeps its own header offset, so the strip
   takes the header height as margin and the hero loses that offset here.
   Removed when the campaign ends; no shared part exists for this. */
.lp-tw .tw-launch-note {
    margin: 59px 0 0;
    padding: 10px 16px;
    background: #EFEFEB;
    color: #2A2A2A;
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
}

.lp-tw .tw-launch-note__tag {
    display: block;
    width: max-content;
    margin: 0 auto 4px;
    padding: 1px 8px;
    border: 1px solid rgba(42, 42, 42, 0.3);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.lp-tw.lp-home .hero--conversion {
    padding-top: 24px;
}

@media (min-width: 760px) {
    .lp-tw .tw-launch-note {
        margin-top: 67px;
    }

    .lp-tw.lp-home .hero--conversion {
        padding-top: 40px;
    }

    .lp-tw .tw-launch-note__tag {
        display: inline-block;
        margin: 0 8px 0 0;
    }
}

/* FAQ and section frame shared by / and /pricing/, from hosting_lp/css/multi-store-page.css
   (copied because tw-lp is a separate Hosting site). */
.ms-sec{
  --ink:#1c1c1a;--muted:#6b6b64;--border:#e5e5e2;--surface:#fff;--pink:#c4445b;--pink-fill:#d2818a;--pink-ink:#a8364c;--tint:#faeaeb;
  padding-block:clamp(56px,8vw,88px);padding-inline:24px;border-block-start:1px solid var(--border);color:var(--ink);word-break:auto-phrase
}
.ms-sec__inner{max-inline-size:1080px;margin-inline:auto}
.ms-sec__inner--narrow{max-inline-size:760px}
.ms-sec__title{font-size:clamp(24px,2.8vw,32px);line-height:1.4;font-weight:800;margin:0}

.ms-faq__list{margin-block-start:24px;border-block-start:1px solid var(--border)}
.ms-faq__item{border-block-end:1px solid var(--border)}
.ms-faq__item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:18px;font-size:16px;font-weight:700;line-height:1.5}
.ms-faq__item summary::-webkit-details-marker{display:none}
.ms-faq__item summary::after{content:"+";flex:none;font-size:22px;font-weight:400;color:var(--muted)}
.ms-faq__item[open] summary::after{content:"−"}
.ms-faq__item summary:focus-visible{outline:2px solid var(--pink);outline-offset:4px;border-radius:4px}
.ms-faq__body p{margin:0;padding-block-end:18px;font-size:14px;line-height:1.85;color:var(--muted)}
.ms-faq__body a{color:var(--pink-ink)}
:root{interpolate-size:allow-keywords}
.ms-faq__item::details-content{block-size:0;overflow:clip}
.ms-faq__item[open]::details-content{block-size:auto}
@media (prefers-reduced-motion:no-preference){
  .ms-faq__item::details-content{transition:block-size .3s ease-out,content-visibility .3s allow-discrete}
}
@media (hover:hover) and (pointer:fine){
  .ms-faq__item summary:hover{color:var(--pink-ink)}
}
@media(max-width:560px){
  .ms-sec{padding-inline:20px}
}
