/* VIA Connect — Blue Peaks Design System — Shared Styles */
:root{
  --canvas:#F5F1E8;--canvas-soft:#FBF8F1;--surface:#FFFFFF;--surface-sunk:#EFEAE0;--surface-deep:#2E4D70;--surface-mid:#426A95;
  --ink-1:#213D5C;--ink-2:#4A5A72;--ink-3:#758397;--ink-4:#A0AAB9;--ink-on-deep:#F7F4ED;--ink-on-deep-2:#C9D3E1;
  --peak-deep:#2E4D70;--peak-mid:#426A95;--peak:#5187C9;--peak-bright:#6FA0DC;--peak-soft:#DDE7F4;--peak-paper:#EEF3FA;
  --glow:#E8845C;--glow-soft:#FCE4D7;
  --via-teal:#14B8A6;--via-teal-dark:#0D9488;--via-teal-soft:#5EEAD4;
  --evergreen:#1F7A5C;--evergreen-soft:#D8EEE3;
  --line:#E5DFD1;--line-strong:#CDC5B3;--line-cool:#D9DEE7;--line-on-deep:rgba(247,244,237,.14);
  --ring:rgba(81,135,201,.36);
  --font-display:"Instrument Serif","Iowan Old Style","Times New Roman",Georgia,serif;
  --font-sans:"Figtree",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --r-sm:8px;--r-md:12px;--r-lg:18px;--r-xl:24px;--r-2xl:32px;--r-pill:999px;
  --shadow-1:0 1px 2px rgba(33,61,92,.06);
  --shadow-2:0 4px 10px -2px rgba(33,61,92,.08),0 2px 4px -2px rgba(33,61,92,.06);
  --shadow-3:0 18px 40px -16px rgba(33,61,92,.16),0 6px 14px -6px rgba(33,61,92,.09);
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-8:32px;--s-10:40px;--s-12:48px;--s-16:64px;--s-20:80px;--s-24:96px;
  --container:1240px;--gutter:24px;
  --ease-out:cubic-bezier(.22,1,.36,1);--t-base:220ms;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--font-sans);font-size:16px;line-height:1.55;color:var(--ink-1);background:var(--canvas);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
::selection{background:var(--peak);color:#fff;}
a{color:inherit;}
.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter);}

/* ── Typography ── */
.eyebrow{font-family:var(--font-sans);font-weight:500;font-size:12px;line-height:1;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);}
.eyebrow .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--peak);margin-right:10px;vertical-align:1px;}
.eyebrow.on-deep{color:var(--peak-bright);}
.eyebrow.on-deep .dot{background:#5DD7F7;box-shadow:0 0 0 4px rgba(93,215,247,.18);}
.h-section{font-family:var(--font-display);font-weight:400;font-size:clamp(36px,4.6vw,60px);line-height:1.06;letter-spacing:-.022em;color:var(--ink-1);}
.h-block{font-family:var(--font-display);font-weight:400;font-size:clamp(22px,2.2vw,30px);line-height:1.15;letter-spacing:-.018em;color:var(--ink-1);}
.h-page{font-family:var(--font-display);font-weight:400;font-size:clamp(42px,5.5vw,72px);line-height:1.04;letter-spacing:-.026em;color:var(--ink-1);}
.italic-peak{font-style:italic;color:var(--peak);}
.on-deep,.on-deep *{color:var(--ink-on-deep);}
.on-deep .italic-peak{color:var(--peak-bright);}
.on-deep .h-section,.on-deep .h-page{color:var(--ink-on-deep);}
.lead{font-size:18px;line-height:1.6;color:var(--ink-2);max-width:600px;text-wrap:pretty;}
.lead.on-deep{color:var(--ink-on-deep-2);}
.lead a{color:var(--peak);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;}
.mono{font-family:var(--font-mono);}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-sans);font-weight:600;font-size:15px;border:1.5px solid transparent;border-radius:var(--r-md);height:48px;padding:0 22px;cursor:pointer;text-decoration:none;transition:background var(--t-base) var(--ease-out),color var(--t-base),border-color var(--t-base),transform 80ms ease;white-space:nowrap;}
.btn:active{transform:scale(.985);}
.btn--accent{background:var(--peak);color:#fff;border-color:var(--peak);}
.btn--accent:hover{background:var(--peak-bright);border-color:var(--peak-bright);}
.btn--ink{background:var(--ink-1);color:var(--ink-on-deep);border-color:var(--ink-1);}
.btn--ink:hover{background:var(--peak-deep);border-color:var(--peak-deep);}
.btn--ghost{background:transparent;color:var(--ink-1);border-color:var(--line-strong);}
.btn--ghost:hover{background:var(--surface);border-color:var(--ink-1);}
.btn--ghost-light{background:transparent;color:var(--ink-on-deep);border-color:rgba(247,244,237,.32);}
.btn--ghost-light:hover{border-color:var(--ink-on-deep);background:rgba(247,244,237,.06);}
.btn--sm{height:38px;padding:0 16px;font-size:13.5px;border-radius:var(--r-sm);}
.arrow::after{content:"→";margin-left:4px;font-size:16px;font-weight:300;transition:transform var(--t-base) var(--ease-out);}
.btn.arrow:hover::after{transform:translateX(4px);}

/* ── Lang dropdown ── */
.lang-select{position:relative;}
.lang-trigger{display:flex;align-items:center;gap:6px;background:var(--surface-sunk);border:none;border-radius:var(--r-sm);padding:6px 10px;cursor:pointer;color:var(--ink-1);transition:background var(--t-base);}
.lang-trigger:hover{background:var(--line);}
.lang-trigger .chev{width:12px;height:12px;color:var(--ink-3);transition:transform var(--t-base);}
.lang-select.open .lang-trigger .chev{transform:rotate(180deg);}
.lang-code{font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.1em;}
.lang-flag{font-size:16px;line-height:1;}
.lang-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:164px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-3);overflow:hidden;display:none;z-index:100;}
.lang-select.open .lang-menu{display:block;}
.lang-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;border:none;background:transparent;cursor:pointer;font-family:var(--font-sans);font-size:14px;color:var(--ink-2);text-align:left;transition:background var(--t-base),color var(--t-base);}
.lang-menu button:hover{background:var(--canvas);color:var(--ink-1);}
.lang-menu button.active{background:var(--peak-paper);color:var(--peak);font-weight:600;}
.lang-menu .mflag{font-size:16px;line-height:1;}

/* ── Nav ── */
nav.top{position:sticky;top:0;z-index:50;background:rgba(245,241,232,.86);backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid rgba(33,61,92,.06);}
nav.top .inner{display:flex;align-items:center;justify-content:space-between;height:76px;}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.brand .mark{width:40px;height:40px;border-radius:11px;overflow:hidden;flex-shrink:0;}
.brand .mark img{width:40px;height:40px;display:block;border-radius:11px;}
.brand .name{font-family:var(--font-sans);font-weight:700;font-size:17px;letter-spacing:-.005em;color:var(--ink-1);}
.brand .name em{font-weight:400;color:var(--ink-3);font-style:normal;margin-left:8px;padding-left:10px;border-left:1px solid var(--line-strong);font-size:13px;letter-spacing:.04em;}
.nav-links{display:flex;gap:32px;}
.nav-links a{color:var(--ink-2);text-decoration:none;font-size:14.5px;font-weight:500;transition:color var(--t-base);}
.nav-links a:hover,.nav-links a.active{color:var(--ink-1);}
.nav-cta{display:flex;gap:10px;align-items:center;}
@media(max-width:880px){.nav-links{display:none;}.brand .name em{display:none;}}
@media(max-width:560px){.nav-cta .btn--ghost{display:none;}}

/* ── Section base ── */
section{padding:var(--s-24) 0;position:relative;}
section.tight{padding:var(--s-20) 0;}
.section__head{max-width:740px;margin-bottom:var(--s-12);}
.section__head .eyebrow{margin-bottom:var(--s-4);display:inline-flex;align-items:center;}
.section__head .lead{margin-top:var(--s-5);}

/* ── Page hero (sub-pages) ── */
.page-hero{background:var(--surface-deep);padding:var(--s-20) 0;position:relative;overflow:hidden;}
.page-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background-image:url("peaks-pattern.svg");background-size:cover;opacity:.2;pointer-events:none;}
.page-hero .inner{position:relative;z-index:1;}
.page-hero .breadcrumb{font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:var(--ink-on-deep-2);margin-bottom:var(--s-5);display:flex;align-items:center;gap:10px;}
.page-hero .breadcrumb a{color:var(--peak-bright);text-decoration:none;}
.page-hero .breadcrumb a:hover{text-decoration:underline;}
.page-hero .breadcrumb span{color:var(--line-on-deep);}

/* ── Footer ── */
footer.site{padding:var(--s-20) 0 var(--s-12);border-top:1px solid var(--line);margin-top:var(--s-16);}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:var(--s-10);margin-bottom:var(--s-12);}
@media(max-width:880px){.foot-grid{grid-template-columns:1fr 1fr;gap:var(--s-8);}}
.foot-grid h4{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-1);font-weight:500;margin-bottom:var(--s-4);}
.foot-grid ul{list-style:none;display:flex;flex-direction:column;gap:8px;}
.foot-grid a{color:var(--ink-2);text-decoration:none;font-size:14px;transition:color var(--t-base);}
.foot-grid a:hover{color:var(--ink-1);}
.foot-brand .desc{margin-top:var(--s-4);font-size:14px;color:var(--ink-2);max-width:280px;line-height:1.55;}
.foot-brand .parent{margin-top:var(--s-5);font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:var(--ink-3);}
.foot-brand .parent strong{color:var(--ink-1);font-weight:600;}
.foot-bottom{border-top:1px solid var(--line);padding-top:var(--s-5);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3);font-family:var(--font-mono);letter-spacing:.03em;}
.foot-bottom .legal{display:flex;gap:18px;}
.foot-bottom a{color:var(--ink-3);text-decoration:none;}
.foot-bottom a:hover{color:var(--ink-1);}

/* ── Lang visibility (7 languages) ── */
body.lang-es [data-en],body.lang-es [data-fr],body.lang-es [data-de],body.lang-es [data-zh],body.lang-es [data-ja],body.lang-es [data-th]{display:none;}
body.lang-en [data-es],body.lang-en [data-fr],body.lang-en [data-de],body.lang-en [data-zh],body.lang-en [data-ja],body.lang-en [data-th]{display:none;}
body.lang-fr [data-es],body.lang-fr [data-en],body.lang-fr [data-de],body.lang-fr [data-zh],body.lang-fr [data-ja],body.lang-fr [data-th]{display:none;}
body.lang-de [data-es],body.lang-de [data-en],body.lang-de [data-fr],body.lang-de [data-zh],body.lang-de [data-ja],body.lang-de [data-th]{display:none;}
body.lang-zh [data-es],body.lang-zh [data-en],body.lang-zh [data-fr],body.lang-zh [data-de],body.lang-zh [data-ja],body.lang-zh [data-th]{display:none;}
body.lang-ja [data-es],body.lang-ja [data-en],body.lang-ja [data-fr],body.lang-ja [data-de],body.lang-ja [data-zh],body.lang-ja [data-th]{display:none;}
body.lang-th [data-es],body.lang-th [data-en],body.lang-th [data-fr],body.lang-th [data-de],body.lang-th [data-zh],body.lang-th [data-ja]{display:none;}
body.lang-zh .h-section,body.lang-zh .h-block,body.lang-zh .h-page{font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-weight:700;letter-spacing:0;}
body.lang-ja .h-section,body.lang-ja .h-block,body.lang-ja .h-page{font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif;font-weight:700;letter-spacing:0;}
body.lang-th .h-section,body.lang-th .h-block,body.lang-th .h-page{font-family:"Thonburi","Leelawadee UI",sans-serif;font-weight:700;letter-spacing:0;}
body.lang-zh .italic-peak,body.lang-ja .italic-peak,body.lang-th .italic-peak{font-style:normal;font-weight:700;}
