/* JINSUNG TECHTEM — draft v7 "MONOGRAPH"
   Tokens only from the design system: navy / ivory / signal red / signal blue, Pretendard, square buttons, 1px rules. */

@font-face{font-family:"Pretendard";src:url("/shared/PretendardVariable.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Manrope";src:url("/shared/fonts/Manrope-Variable.ttf") format("truetype");font-weight:200 800;font-display:swap}

:root{
  --navy:#0B172B; --ink:#070E1C; --navy2:#101D33; --navy3:#172843;
  --ivory:#F3F1EA; --ivory2:#E9E6DD; --paper:#FAF9F5;
  --red:#EB252A; --blue:#0D56A5; --blue2:#3B7BC8;
  --fg-d:#F3F1EA; --mute-d:#8E99AB; --line-d:rgba(243,241,234,.14); --line-d2:rgba(243,241,234,.28);
  --fg-l:#0B172B; --mute-l:#5F6879; --line-l:rgba(11,23,43,.16); --line-l2:rgba(11,23,43,.34);
  --gx:clamp(20px,5.2vw,104px);
  --sy:clamp(96px,11vw,176px);
  --font:"Pretendard",-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --en:"Manrope","Pretendard",sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --header:84px;
}
@media (max-width:860px){:root{--header:64px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--ink);color:var(--fg-d);font-family:var(--font);font-size:16px;line-height:1.72;word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;overflow-x:clip}
body.light{background:var(--ivory);color:var(--fg-l)}
img,video,svg,canvas{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,p,ul,ol,figure,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
strong{font-weight:700}
::selection{background:var(--blue);color:#fff}
:focus-visible{outline:2px solid var(--blue2);outline-offset:3px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Type ---------- */
.lbl{font-family:var(--en);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;line-height:1.4}
.lbl-ko{font-size:13px;font-weight:600;letter-spacing:.02em;line-height:1.4}
.dark .lbl,.dark .lbl-ko{color:var(--mute-d)}
.light .lbl,.light .lbl-ko{color:var(--mute-l)}
.lbl.red{color:var(--red)}.lbl.blue{color:var(--blue2)}
.light .lbl.blue{color:var(--blue)}
.display{font-weight:700;font-size:clamp(42px,7.2vw,116px);line-height:1.02;letter-spacing:-.045em}
.h1{font-weight:700;font-size:clamp(40px,6vw,96px);line-height:1.04;letter-spacing:-.04em}
.h2{font-weight:700;font-size:clamp(32px,4.3vw,66px);line-height:1.08;letter-spacing:-.035em}
.h3{font-weight:700;font-size:clamp(24px,2.6vw,40px);line-height:1.18;letter-spacing:-.03em}
.h4{font-weight:700;font-size:clamp(19px,1.6vw,24px);line-height:1.3;letter-spacing:-.02em}
.lead{font-size:clamp(17px,1.45vw,22px);line-height:1.62;font-weight:400;letter-spacing:-.01em}
.body{font-size:clamp(15px,1.1vw,17px);line-height:1.8}
.small{font-size:13px;line-height:1.6}
.dark .muted{color:var(--mute-d)}.light .muted{color:var(--mute-l)}
.fig{font-family:var(--en);font-variant-numeric:tabular-nums;font-feature-settings:"tnum";letter-spacing:-.03em;font-weight:500}
.num{font-family:var(--en);font-variant-numeric:tabular-nums;font-weight:500;letter-spacing:.02em}
.ko-en{display:block;font-family:var(--en);font-weight:500;letter-spacing:.01em}

/* ---------- Sections / grid ---------- */
.dark{background:var(--navy);color:var(--fg-d)}
.darker{background:var(--ink);color:var(--fg-d)}
.light{background:var(--ivory);color:var(--fg-l)}
.lighter{background:var(--paper);color:var(--fg-l)}
.sec{position:relative;padding:var(--sy) var(--gx)}
.sec.tight{padding-top:calc(var(--sy)*.6);padding-bottom:calc(var(--sy)*.6)}
/* R4: one full-bleed system — every section spans the viewport with the same side margin (--gx); no centred max-width column */
.wrap{max-width:none;margin:0}
.sec-head .side{max-width:460px}
.g{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(16px,2vw,32px)}
.c3{grid-column:auto/span 3}.c4{grid-column:auto/span 4}.c5{grid-column:auto/span 5}.c6{grid-column:auto/span 6}.c7{grid-column:auto/span 7}.c8{grid-column:auto/span 8}.c9{grid-column:auto/span 9}.c12{grid-column:auto/span 12}
.s2{grid-column-start:2}.s3{grid-column-start:3}.s4{grid-column-start:4}.s5{grid-column-start:5}.s6{grid-column-start:6}.s7{grid-column-start:7}.s8{grid-column-start:8}
@media (max-width:1100px){.c3,.c4{grid-column:auto/span 6}.c5,.c6,.c7{grid-column:auto/span 12}.s2,.s3,.s4,.s5,.s6,.s7,.s8{grid-column-start:auto}}
@media (max-width:760px){.c3,.c4,.c5,.c6,.c7,.c8,.c9{grid-column:auto/span 12}}
.rule{height:1px;border:0;margin:0}
.dark .rule,.darker .rule{background:var(--line-d)}
.light .rule,.lighter .rule{background:var(--line-l)}
.rule.strong{background:var(--line-d2)}.light .rule.strong,.lighter .rule.strong{background:var(--line-l2)}
.sec-head{display:grid;grid-template-columns:1fr auto;gap:24px 48px;align-items:end;margin-bottom:clamp(40px,5vw,80px)}
.sec-head .lbl{margin-bottom:18px}
.sec-head .side{max-width:420px;font-size:15px;line-height:1.7}
.dark .sec-head .side{color:var(--mute-d)}.light .sec-head .side{color:var(--mute-l)}
@media (max-width:860px){.sec-head{grid-template-columns:1fr}}
.row{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.between{justify-content:space-between}
.stack>*+*{margin-top:var(--st,16px)}
.mt1{margin-top:8px}.mt2{margin-top:16px}.mt3{margin-top:24px}.mt4{margin-top:40px}.mt5{margin-top:64px}.mt6{margin-top:96px}
.mw-s{max-width:460px}.mw-m{max-width:640px}.mw-l{max-width:860px}
.right{text-align:right}
.hide-m{display:initial}
@media (max-width:860px){.hide-m{display:none!important}}
.show-m{display:none}
@media (max-width:860px){.show-m{display:initial}}

/* ---------- Buttons / links ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;height:52px;padding:0 26px;border:1px solid transparent;font-weight:600;font-size:15px;letter-spacing:-.01em;white-space:nowrap;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease)}
.btn svg{width:16px;height:16px;flex:none;transition:transform .35s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn.red{background:var(--red);color:#fff}
.btn.red:hover{background:#d11e23}
.btn.navy{background:var(--navy);color:#fff}
.btn.navy:hover{background:var(--navy3)}
.btn.ivory{background:var(--ivory);color:var(--navy)}
.btn.ivory:hover{background:#fff}
.btn.ghost{border-color:var(--line-d2);color:var(--fg-d)}
.btn.ghost:hover{border-color:var(--fg-d)}
.light .btn.ghost,.lighter .btn.ghost{border-color:var(--line-l2);color:var(--fg-l)}
.light .btn.ghost:hover,.lighter .btn.ghost:hover{border-color:var(--fg-l)}
.btn.lg{height:60px;padding:0 34px;font-size:16px}
.btn.sm{height:44px;padding:0 18px;font-size:14px}
.link{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:15px;padding-bottom:4px;border-bottom:1px solid currentColor;transition:gap .35s var(--ease)}
.link svg{width:14px;height:14px}
.link:hover{gap:16px}
.arrow-link{display:inline-flex;align-items:center;gap:12px;font-weight:600}
.arrow-link svg{width:18px;height:18px;transition:transform .4s var(--ease)}
.arrow-link:hover svg{transform:translateX(6px)}

/* ---------- Badges ---------- */
.badge{display:inline-flex;align-items:center;gap:8px;height:26px;padding:0 10px;font-family:var(--en);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line-d2);white-space:nowrap}
.light .badge,.lighter .badge{border-color:var(--line-l2)}
.badge.soon{color:var(--mute-d);border-style:dashed}
.light .badge.soon,.lighter .badge.soon{color:var(--mute-l)}
.badge.red{border-color:var(--red);color:var(--red)}
.badge.blue{border-color:var(--blue2);color:var(--blue2)}
.light .badge.blue{border-color:var(--blue);color:var(--blue)}
.badge i{width:6px;height:6px;background:currentColor;display:inline-block}

/* ---------- Photo grade (cold, consistent) ---------- */
.ph{position:relative;overflow:hidden;background:var(--navy2)}
.ph img,.ph video{width:100%;height:100%;object-fit:cover;filter:grayscale(.28) saturate(.62) contrast(1.06) brightness(.94)}
.ph::before{content:"";position:absolute;inset:0;background:var(--navy);mix-blend-mode:color;opacity:.32;pointer-events:none;z-index:1}
.ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,14,28,.08),rgba(7,14,28,.42));mix-blend-mode:multiply;pointer-events:none;z-index:1}
.ph.flat::after{opacity:.5}
.ph.deep::after{background:linear-gradient(180deg,rgba(7,14,28,.25),rgba(7,14,28,.78))}
.ph.render img{filter:grayscale(.1) saturate(.7) contrast(1.05) brightness(.9)}
.ph.doc img{filter:grayscale(.9) contrast(1.05) brightness(.96)}
.ph .cap{position:absolute;left:20px;right:20px;bottom:18px;z-index:2;display:flex;justify-content:space-between;gap:16px;font-size:12px;letter-spacing:.06em;font-family:var(--en);font-weight:600;color:rgba(243,241,234,.86);text-transform:uppercase}
.ph>*{position:relative}
.ph .over{position:absolute;inset:0;z-index:2}
.ratio-16{aspect-ratio:16/9}.ratio-4{aspect-ratio:4/3}.ratio-3{aspect-ratio:3/2}.ratio-1{aspect-ratio:1}.ratio-21{aspect-ratio:21/9}.ratio-tall{aspect-ratio:3/4}
.ph.scale img,.ph.scale video{will-change:transform;transform:scale(1.12)}
[data-curtain]{clip-path:inset(0 0 100% 0)}
.no-js [data-curtain]{clip-path:none}
[data-reveal]{opacity:0;transform:translateY(28px)}
.no-js [data-reveal]{opacity:1;transform:none}

/* ---------- Header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:60;height:var(--header);display:flex;align-items:center;justify-content:space-between;padding:0 var(--gx);background:rgba(7,14,28,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-d);color:var(--fg-d);transition:transform .5s var(--ease),background .4s}
.hdr.hide{transform:translateY(-100%)}
.hdr .logo{display:flex;align-items:center;height:100%}
.hdr .logo img{height:34px;width:auto}
@media (max-width:860px){.hdr .logo img{height:28px}}
.nav{display:flex;align-items:center;gap:clamp(14px,1.8vw,32px);height:100%;margin:0 24px}
.nav>li{position:relative;height:100%;display:flex;align-items:center}
.nav>li>a{font-family:var(--en);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;display:flex;align-items:center;gap:8px;height:100%;color:rgba(243,241,234,.78);transition:color .3s;white-space:nowrap}
.nav>li>a:hover,.nav>li>a[aria-current]{color:#fff}
.nav>li>a .soon-dot{width:5px;height:5px;background:var(--mute-d);opacity:.7}
.nav>li>a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.nav>li>a[aria-current]::after,.nav>li:hover>a::after{transform:scaleX(1)}
.sub{position:absolute;top:100%;left:-24px;min-width:260px;padding:18px 0 18px;background:var(--ink);border:1px solid var(--line-d);border-top:0;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .3s,transform .3s,visibility .3s}
.nav>li:hover .sub,.nav>li:focus-within .sub{opacity:1;visibility:visible;transform:none}
.sub a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:9px 24px;font-size:14px;color:rgba(243,241,234,.8);transition:color .2s,background .2s}
.sub a:hover{color:#fff;background:rgba(243,241,234,.05)}
.sub a .badge{height:20px;padding:0 6px;font-size:12px}
.sub .en{font-family:var(--en);font-size:12px;letter-spacing:.06em;color:var(--mute-d)}
.hdr .tools{display:flex;align-items:center;gap:clamp(12px,1.6vw,26px);height:100%}
.hdr .tools .tel{font-family:var(--en);font-size:13px;font-weight:600;letter-spacing:.04em;color:rgba(243,241,234,.78);white-space:nowrap}
.hdr .tools .lang{white-space:nowrap}
@media (max-width:1560px){.hdr .tools .tel{display:none}}
.hdr .tools .tel:hover{color:#fff}
.lang{display:flex;align-items:center;gap:6px;font-family:var(--en);font-size:12px;font-weight:600;letter-spacing:.1em}
.lang button{padding:4px 2px;color:rgba(243,241,234,.5)}
.lang button[aria-pressed="true"]{color:#fff}
.lang span{color:rgba(243,241,234,.3)}
.icon-btn{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;color:rgba(243,241,234,.8);transition:color .2s}
.icon-btn:hover{color:#fff}
.icon-btn svg{width:18px;height:18px}
.hdr .btn.sm{height:40px}
.burger{display:none;width:40px;height:40px;position:relative}
.burger i{position:absolute;left:10px;width:20px;height:1.5px;background:#fff;transition:transform .4s var(--ease),top .4s var(--ease),opacity .3s}
.burger i:nth-child(1){top:14px}.burger i:nth-child(2){top:20px}.burger i:nth-child(3){top:26px}
.burger[aria-expanded="true"] i:nth-child(1){top:20px;transform:rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){top:20px;transform:rotate(-45deg)}
@media (max-width:1180px){.nav{display:none}.hdr .tools .tel,.hdr .tools .lang,.hdr .tools .search{display:none}.burger{display:block}}
@media (max-width:860px){.hdr .tools .btn.sm{display:none}}

/* mobile menu */
.mnav{position:fixed;inset:0;z-index:55;background:var(--ink);color:var(--fg-d);padding:calc(var(--header) + 24px) var(--gx) 40px;overflow:auto;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
.mnav.open{opacity:1;visibility:visible}
.mnav .grp{border-top:1px solid var(--line-d);padding:16px 0}
.mnav .grp>a{display:flex;justify-content:space-between;align-items:center;font-family:var(--en);font-size:24px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;padding:8px 0;white-space:nowrap}
.mnav .grp>a svg{width:18px;height:18px;flex:none;opacity:.7}
.mnav .grp ul{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;padding:6px 0 10px}
.mnav .grp ul a{font-size:14px;color:var(--mute-d);padding:5px 0;display:flex;gap:8px;align-items:center}
.mnav .foot{margin-top:28px;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;padding-top:20px;border-top:1px solid var(--line-d)}
.mnav .foot .lang button{font-size:13px}
.mnav .foot .tel{font-family:var(--en);font-weight:600}
@media (max-width:520px){.mnav .grp ul{grid-template-columns:1fr}}

/* ---------- Footer ---------- */
.ftr{background:var(--ink);color:var(--fg-d);padding:clamp(64px,8vw,120px) var(--gx) 40px;border-top:1px solid var(--line-d)}
.ftr .top{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:40px;padding-bottom:56px}
.ftr .top h4{font-family:var(--en);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute-d);margin-bottom:18px}
.ftr .top li{font-size:14px;padding:4px 0;color:rgba(243,241,234,.8)}
.ftr .top li a:hover{color:#fff}
.ftr .top li .badge{margin-left:8px;height:18px;padding:0 5px;font-size:12px}
.ftr .brand img{height:38px;width:auto;margin-bottom:22px}
.ftr .brand p{font-size:14px;line-height:1.7;color:rgba(243,241,234,.7);max-width:360px}
.ftr .brand .jsi{display:flex;align-items:center;gap:14px;margin-top:24px;font-size:13px;color:var(--mute-d)}
.ftr .brand .jsi img{height:28px;margin:0}
.ftr .mid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px 40px;padding:28px 0;border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d);font-size:13px;color:rgba(243,241,234,.7);line-height:1.8}
.ftr .mid address{font-style:normal}
.ftr .mid .social{display:flex;gap:14px;align-items:center}
.ftr .mid .social a{display:inline-flex;align-items:center;gap:8px;font-family:var(--en);font-weight:600;font-size:13px;letter-spacing:.06em;color:rgba(243,241,234,.8)}
.ftr .mid .social a svg{width:16px;height:16px}
.ftr .bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;padding-top:24px;font-size:12px;color:var(--mute-d)}
.ftr .bot .links{display:flex;gap:20px}
.ftr .bot .links a:hover{color:#fff}
@media (max-width:1000px){.ftr .top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ftr .top{grid-template-columns:1fr}}

/* ---------- Cursor ---------- */
.cur{position:fixed;left:0;top:0;z-index:100;pointer-events:none;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--fg-d);mix-blend-mode:difference;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),opacity .3s;opacity:0}
.cur.on{opacity:1}
.cur.link{width:48px;height:48px;margin:-24px 0 0 -24px;background:rgba(255,255,255,.9)}
.cur.play{width:88px;height:88px;margin:-44px 0 0 -44px;background:var(--ivory);mix-blend-mode:normal;display:flex;align-items:center;justify-content:center}
.cur.play::after{content:"PLAY";font-family:var(--en);font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--navy)}
.cur.hidden{opacity:0}
@media (hover:none),(pointer:coarse){.cur{display:none}}
body.has-cursor a,body.has-cursor button{cursor:none}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100svh;display:grid;grid-template-rows:1fr auto;padding:calc(var(--header) + 24px) var(--gx) 0;overflow:hidden;background:radial-gradient(120% 80% at 70% 60%,#15284a 0%,var(--navy) 40%,var(--ink) 100%)}
.hero .stage{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:end;gap:32px;min-height:0}
.hero .copy{position:relative;z-index:3;padding-bottom:clamp(32px,5vh,72px)}
.hero .copy .lbl{margin-bottom:28px;display:flex;gap:18px;align-items:center}
.hero .copy .lbl i{width:36px;height:1px;background:var(--red);display:inline-block}
.hero h1{font-weight:700;font-size:clamp(44px,6.4vw,104px);line-height:1.02;letter-spacing:-.045em}
.hero h1 .thin{font-weight:300;letter-spacing:-.035em}
.hero .copy p{margin-top:28px;max-width:440px;font-size:clamp(15px,1.15vw,18px);line-height:1.72;color:rgba(243,241,234,.78)}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.hero .machine{position:relative;z-index:2;align-self:end;margin-bottom:clamp(20px,4vh,48px);will-change:transform;padding:0 2%}
.hero .machine img{width:100%;height:auto;max-height:66vh;object-fit:contain;object-position:bottom center;filter:saturate(.6) contrast(1.04) brightness(1.02) drop-shadow(0 40px 60px rgba(0,0,0,.55));transform-origin:bottom center;position:relative;z-index:2}
.hero .machine .floor{position:absolute;left:-10%;right:-10%;bottom:-8%;height:55%;background:radial-gradient(55% 60% at 50% 55%,rgba(59,123,200,.26),rgba(59,123,200,.06) 50%,transparent 72%);filter:blur(24px);pointer-events:none;z-index:1}
.hero .machine::after{content:"";position:absolute;left:4%;right:4%;bottom:-2px;height:1px;background:linear-gradient(90deg,transparent,rgba(243,241,234,.35),transparent);z-index:1}
.hero .eng{position:absolute;inset:0;z-index:3;pointer-events:none;color:rgba(243,241,234,.7)}
.hero .eng text{font-family:var(--en);font-size:13px;font-weight:600;letter-spacing:.14em;fill:currentColor;paint-order:stroke;stroke:rgba(11,23,43,.9);stroke-width:4px;stroke-linejoin:round}
@media (max-width:760px){.hero .eng{display:none}}
/* JSON module callouts (3D renders) */
[data-callouts]{position:relative}
.co-layer{position:absolute;inset:0;pointer-events:none;z-index:3}
.co-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.co-svg polyline{fill:none;stroke:rgba(243,241,234,.55);stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.4s var(--ease)}
.co-layer.on .co-svg polyline{stroke-dashoffset:0}
.co-svg .co-dot{fill:var(--red);stroke:rgba(11,23,43,.6);stroke-width:1;vector-effect:non-scaling-stroke;r:.5}
.co{position:absolute;max-width:16%;transform:translateY(-50%);opacity:0;transition:opacity .8s var(--ease)}
.co.L{left:0;text-align:left}.co.R{right:0;text-align:right}
.co-layer.on .co{opacity:1}
.co span{display:flex;flex-direction:column;line-height:1.25;color:var(--fg-d);text-shadow:0 1px 2px rgba(7,14,28,.9),0 0 10px rgba(7,14,28,.9);background:rgba(11,23,43,.55);padding:3px 6px;backdrop-filter:blur(2px)}
.co.R span{align-items:flex-end}
.co span b{font-size:13px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}
.co span em{font-family:var(--en);font-style:normal;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(243,241,234,.62);white-space:nowrap}
.light .co span,.lighter .co span{color:var(--fg-l);text-shadow:none;background:rgba(243,241,234,.7)}.light .co span em{color:var(--mute-l)}.light .co-svg polyline{stroke:rgba(11,23,43,.55)}
@media (max-width:760px){.co-layer{display:none}}
.hero .eng line,.hero .eng path,.hero .eng circle,.hero .eng rect{stroke:currentColor;fill:none;stroke-width:1;vector-effect:non-scaling-stroke}
.hero .eng .tick{stroke:var(--red)}
.hero .eng .dot{fill:var(--red);stroke:none}
.hero .eng .dim{stroke-dasharray:3 4}
.hero .meta{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:24px;align-items:center;padding:22px 0 24px;border-top:1px solid var(--line-d);font-size:13px;color:var(--mute-d)}
.hero .meta b{display:block;color:var(--fg-d);font-weight:600;font-size:14px;letter-spacing:-.01em}
.hero .meta .scroll{display:flex;align-items:center;gap:12px;font-family:var(--en);font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.hero .meta .scroll i{width:1px;height:28px;background:var(--line-d2);position:relative;overflow:hidden;display:block}
.hero .meta .scroll i::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;background:var(--fg-d);animation:drop 2.2s var(--ease) infinite}
@keyframes drop{0%{top:-100%}60%{top:100%}100%{top:100%}}
.hero .watch{position:absolute;right:0;bottom:0;z-index:4}
@media (max-width:1100px){
  .hero .stage{grid-template-columns:1fr;align-items:start}
  .hero .machine{order:-1;margin:12px 0 0;}
  .hero .machine img{max-height:44vh}
  .hero .meta{grid-template-columns:1fr 1fr}
  .hero .meta .scroll{display:none}
}
@media (max-width:600px){.hero{min-height:auto}.hero .meta{grid-template-columns:1fr 1fr;font-size:12px}.hero .machine img{max-height:38vh}}

/* photographic full-bleed hero (v7 R3) */
.hero.photo{background:var(--ink)}
.hero.photo .bg{position:absolute;inset:0;z-index:0;margin:0}
.hero.photo .bg img{width:100%;height:100%;object-fit:cover;object-position:22% 50%;filter:grayscale(.2) saturate(.7) contrast(1.08) brightness(.84)}
.hero.photo .bg::after{background:linear-gradient(270deg,rgba(7,14,28,.94) 0%,rgba(7,14,28,.78) 32%,rgba(7,14,28,.22) 60%,rgba(7,14,28,.08) 100%),linear-gradient(180deg,rgba(7,14,28,.5),transparent 28%,transparent 70%,rgba(7,14,28,.78))}
.hero.photo .stage{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:end}
.hero.photo .copy{grid-column:2;padding-bottom:clamp(40px,8vh,96px);padding-left:clamp(0px,4vw,64px)}
.hero.photo h1{font-size:clamp(40px,5.4vw,88px)}
.hero.photo .copy p{max-width:480px;color:rgba(243,241,234,.84)}
.hero.photo .meta{border-top-color:rgba(243,241,234,.22)}
@media (max-width:1100px){.hero.photo .stage{grid-template-columns:1fr}.hero.photo .copy{grid-column:1;padding-left:0}.hero.photo .bg img{object-position:30% 50%}.hero.photo .bg::after{background:linear-gradient(180deg,rgba(7,14,28,.35),rgba(7,14,28,.6) 45%,rgba(7,14,28,.92) 78%)}}
@media (max-width:600px){.hero.photo{min-height:100svh}.hero.photo .bg::after{background:linear-gradient(180deg,rgba(7,14,28,.3),rgba(7,14,28,.55) 45%,rgba(7,14,28,.92) 75%)}.hero.photo h1{max-width:none}}

/* ---------- Statement (one line intro) ---------- */
.statement{padding:var(--sy) var(--gx)}
.statement .wrap{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,10fr);gap:32px}
.statement h2{font-weight:600;font-size:clamp(28px,3.9vw,60px);line-height:1.24;letter-spacing:-.035em;max-width:1180px}
.statement h2 em{font-style:normal;color:var(--blue)}
.statement .slogan{margin-top:48px;display:flex;flex-wrap:wrap;gap:12px 40px;align-items:baseline}
.statement .slogan b{font-family:var(--en);font-weight:700;font-size:clamp(18px,1.6vw,24px);letter-spacing:-.02em}
.statement .slogan span{font-size:14px;color:var(--mute-l)}
.statement .four{margin-top:56px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-l)}
.statement .four div{padding:22px 24px 26px 0;border-right:1px solid var(--line-l)}
.statement .four div:last-child{border-right:0}
.statement .four b{display:block;font-family:var(--en);font-weight:700;font-size:20px;letter-spacing:-.02em;margin-bottom:6px}
.statement .four span{font-size:14px;color:var(--mute-l)}
@media (max-width:1000px){.statement .wrap{grid-template-columns:1fr}.statement .four{grid-template-columns:1fr 1fr}.statement .four div{padding-right:16px}.statement .four div:nth-child(2n){border-right:0}}
@media (max-width:520px){.statement .four{grid-template-columns:1fr}.statement .four div{border-right:0;border-bottom:1px solid var(--line-l)}}

/* ---------- Product index (typographic rows with cursor image) ---------- */
.pindex{position:relative}
.pindex .rows{border-top:1px solid var(--line-d)}
.pindex .rowi{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,3fr) auto;gap:24px;align-items:center;padding:clamp(20px,2.4vw,34px) 0;border-bottom:1px solid var(--line-d);color:var(--fg-d);transition:padding .5s var(--ease)}
.pindex .rowi .nm{font-weight:700;font-size:clamp(28px,3.6vw,56px);letter-spacing:-.04em;line-height:1.05;display:flex;align-items:baseline;gap:18px;flex-wrap:wrap}
.pindex .rowi .nm .en{font-family:var(--en);font-weight:500;font-size:clamp(13px,1vw,16px);letter-spacing:.08em;text-transform:uppercase;color:var(--mute-d)}
.pindex .rowi .ds{font-size:14px;color:var(--mute-d);line-height:1.6}
.pindex .rowi .ar{width:48px;height:48px;border:1px solid var(--line-d2);display:flex;align-items:center;justify-content:center;transition:background .4s,color .4s,border-color .4s}
.pindex .rowi .ar svg{width:18px;height:18px;transition:transform .4s var(--ease)}
.pindex .rowi:hover .ar{background:var(--ivory);color:var(--navy);border-color:var(--ivory)}
.pindex .rowi:hover .ar svg{transform:rotate(-45deg)}
.pindex .rowi .badge{margin-left:8px;vertical-align:middle}
.pindex .float{position:fixed;left:0;top:0;z-index:40;width:min(34vw,460px);aspect-ratio:4/3;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.92);transition:opacity .4s var(--ease),transform .5s var(--ease);overflow:hidden;background:var(--navy2)}
.pindex .float.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.pindex .float img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s var(--ease);filter:grayscale(.25) saturate(.65) contrast(1.05) brightness(.92)}
.pindex .float img.on{opacity:1}
.pindex .float::after{content:"";position:absolute;inset:0;background:var(--navy);mix-blend-mode:color;opacity:.3}
@media (max-width:860px){.pindex .rowi{grid-template-columns:1fr auto}.pindex .rowi .ds{display:none}.pindex .float{display:none}}

/* ---------- Process (pinned stages) ---------- */
.proc{position:relative}
.proc .pin{position:relative;min-height:100svh;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:stretch;padding:calc(var(--header) + 16px) var(--gx) 40px}
.proc .txt{display:flex;flex-direction:column;justify-content:center;min-height:0}
.proc .txt .lbl{margin-bottom:28px}
.proc .stages{position:relative;min-height:220px}
.proc .stage-t{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease),visibility .6s}
.proc .stage-t.on{opacity:1;visibility:visible;transform:none}
.proc .stage-t h3{font-weight:700;font-size:clamp(40px,5.4vw,84px);letter-spacing:-.045em;line-height:1;display:flex;align-items:baseline;gap:20px;flex-wrap:wrap}
.proc .stage-t h3 .en{font-family:var(--en);font-size:clamp(13px,1vw,15px);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute-l)}
.proc .stage-t p{margin-top:24px;max-width:460px;font-size:clamp(15px,1.15vw,17px);line-height:1.75;color:#3a4458}
.proc .stage-t .eq{margin-top:28px;display:flex;flex-wrap:wrap;gap:8px}
.proc .stage-t .eq span{font-size:13px;padding:6px 10px;border:1px solid var(--line-l2);color:var(--fg-l)}
.proc .track{display:flex;gap:0;margin-top:40px;border-top:1px solid var(--line-l);padding-top:16px}
.proc .track button{flex:1;text-align:left;padding:8px 0;font-size:13px;font-weight:600;color:var(--mute-l);position:relative;transition:color .3s}
.proc .track button::before{content:"";position:absolute;top:-17px;left:0;right:0;height:1px;background:var(--navy);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.proc .track button.on{color:var(--fg-l)}
.proc .track button.on::before,.proc .track button.done::before{transform:scaleX(1)}
.proc .vis{position:relative;min-height:46vh;background:var(--navy);overflow:hidden}
.proc .vis .ph{position:absolute;inset:0;opacity:0;transition:opacity .9s var(--ease);background:var(--navy)}
.proc .vis .ph.on{opacity:1}
.proc .vis .ph video,.proc .vis .ph img{position:absolute;inset:0}
.proc .vis .tag{position:absolute;left:24px;top:22px;z-index:3;display:flex;gap:14px;align-items:center;color:rgba(243,241,234,.9);font-family:var(--en);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.proc .vis .tag i{width:8px;height:8px;background:var(--red);display:inline-block;animation:blink 1.6s steps(1) infinite}
@keyframes blink{50%{opacity:.25}}
.proc .arrowline{position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--line-d);z-index:3}
.proc .arrowline i{display:block;height:100%;width:0;background:var(--red);transition:width .6s var(--ease)}
@media (max-width:1000px){
  .proc .pin{grid-template-columns:1fr;min-height:auto;padding-top:var(--sy);padding-bottom:var(--sy)}
  .proc .vis{min-height:0;aspect-ratio:16/10;order:-1;margin-bottom:24px}
  .proc .stages{min-height:300px}
}
@media (max-width:600px){.proc .track button{font-size:12px}.proc .stages{min-height:330px}}

/* ---------- Industries ---------- */
.ind .list{border-top:1px solid var(--line-d)}
.ind .it{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr) auto;gap:24px 40px;align-items:start;padding:clamp(22px,2.6vw,38px) 0;border-bottom:1px solid var(--line-d);color:var(--fg-d)}
.ind .it .nm{font-weight:700;font-size:clamp(26px,3vw,46px);letter-spacing:-.04em;line-height:1.08}
.ind .it .nm .en{display:block;font-family:var(--en);font-weight:500;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute-d);margin-top:8px}
.ind .it .tags{display:flex;flex-wrap:wrap;gap:8px 10px;padding-top:8px}
.ind .it .tags span{font-size:13px;color:rgba(243,241,234,.78);padding:6px 11px;border:1px solid var(--line-d)}
.ind .it .ar{width:48px;height:48px;border:1px solid var(--line-d2);display:flex;align-items:center;justify-content:center;transition:background .4s,color .4s}
.ind .it .ar svg{width:18px;height:18px;transition:transform .4s var(--ease)}
.ind .it:hover .ar{background:var(--ivory);color:var(--navy)}
.ind .it:hover .ar svg{transform:rotate(-45deg)}
.ind .it.soon{color:var(--mute-d)}
.ind .it.soon .nm{color:rgba(243,241,234,.55)}
@media (max-width:860px){.ind .it{grid-template-columns:1fr auto}.ind .it .tags{grid-column:1/-1;padding-top:0}}

/* ---------- Figures ---------- */
.figs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-l);border-bottom:1px solid var(--line-l)}
.figs>div{padding:clamp(28px,3vw,48px) clamp(16px,2vw,32px) clamp(28px,3vw,48px) 0;border-right:1px solid var(--line-l)}
.figs>div:last-child{border-right:0}
.figs>div:nth-child(n+2){padding-left:clamp(16px,2vw,32px)}
.figs .v{font-family:var(--en);font-weight:500;font-size:clamp(56px,6.8vw,120px);letter-spacing:-.05em;line-height:.95;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:4px}
.figs .v small{font-size:.42em;letter-spacing:-.02em;font-weight:500}
.figs .v .u{font-family:var(--font);font-size:clamp(18px,1.6vw,26px);font-weight:600;letter-spacing:-.02em;margin-left:6px}
.figs .k{margin-top:18px;font-weight:600;font-size:15px}
.figs .d{margin-top:6px;font-size:13px;color:var(--mute-l);line-height:1.6}
@media (max-width:900px){.figs{grid-template-columns:1fr 1fr}.figs>div:nth-child(2n){border-right:0}.figs>div:nth-child(-n+2){border-bottom:1px solid var(--line-l)}.figs>div:nth-child(3){padding-left:0}}
@media (max-width:480px){.figs{grid-template-columns:1fr}.figs>div{border-right:0!important;border-bottom:1px solid var(--line-l);padding-left:0!important}.figs>div:last-child{border-bottom:0}}

/* ---------- Clients (typographic wordmarks) ---------- */
.clients .grp{display:grid;grid-template-columns:200px 1fr;gap:24px 40px;padding:28px 0;border-top:1px solid var(--line-l)}
.clients .grp:last-child{border-bottom:1px solid var(--line-l)}
.clients .grp h3{font-size:14px;font-weight:600;color:var(--mute-l);padding-top:6px}
.clients .grp ul{display:flex;flex-wrap:wrap;gap:10px 0}
.clients .grp li{font-weight:700;font-size:clamp(18px,1.9vw,30px);letter-spacing:-.035em;line-height:1.2;color:var(--fg-l);padding:2px 26px 2px 0;position:relative;transition:color .3s}
.clients .grp li:hover{color:var(--blue)}
.clients .grp li.en{font-family:var(--en);font-weight:700;letter-spacing:-.02em}
@media (max-width:860px){.clients .grp{grid-template-columns:1fr;gap:12px}.clients .grp li{padding-right:18px}}

/* ---------- Certificates ---------- */
.certs .docs{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.certs .docs .ph{aspect-ratio:1/1.41;background:#0f1b31}
.certs .docs .ph img{object-position:top;filter:grayscale(1) contrast(1.02) brightness(.82)}
.certs .docs .ph::before{opacity:.7}
.certs .docs .ph:hover img{filter:grayscale(.6) contrast(1.02) brightness(.95)}
.certs .ls{display:grid;grid-template-columns:repeat(3,1fr);gap:0 40px;border-top:1px solid var(--line-d)}
.certs .ls div{padding:22px 0;border-bottom:1px solid var(--line-d)}
.certs .ls .lbl{margin-bottom:10px}
.certs .ls b{display:block;font-size:17px;font-weight:600;letter-spacing:-.02em}
.certs .ls span{font-size:13px;color:var(--mute-d)}
@media (max-width:1000px){.certs .docs{grid-template-columns:repeat(3,1fr)}.certs .ls{grid-template-columns:1fr}}

/* ---------- Case highlights ---------- */
.cases .feat{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,3vw,56px);align-items:end}
.cases .feat .ph{aspect-ratio:16/10}
.cases .cap-blk{padding-bottom:12px}
.cases .cap-blk .lbl{margin-bottom:16px}
.cases .cap-blk h3{font-size:clamp(26px,2.8vw,42px);letter-spacing:-.035em;line-height:1.14}
.cases .cap-blk p{margin-top:18px;font-size:15px;line-height:1.75;color:var(--mute-l)}
.cases .cap-blk .link{margin-top:24px}
.cases .more{margin-top:clamp(32px,3vw,56px);display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,24px)}
.cases .more a{display:block;color:inherit}
.cases .more .ph{aspect-ratio:4/3;margin-bottom:14px}
.cases .more b{display:block;font-size:16px;letter-spacing:-.02em;font-weight:600}
.cases .more span{font-size:13px;color:var(--mute-l)}
@media (max-width:1000px){.cases .feat{grid-template-columns:1fr}.cases .more{grid-template-columns:1fr 1fr}}

/* ---------- Globe ---------- */
.globe{position:relative;overflow:hidden}
.globe .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,72px);align-items:center}
.globe canvas{width:100%;height:auto;aspect-ratio:1;max-width:min(880px,44vw);margin:0 auto}
.globe .ctry{border-top:1px solid var(--line-d);margin-top:32px}
.globe .ctry li{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--line-d);font-size:15px;cursor:default;transition:color .3s}
.globe .ctry li .en{font-family:var(--en);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute-d)}
.globe .ctry li.on,.globe .ctry li:hover{color:#fff}
.globe .ctry li.on .en{color:var(--red)}
.globe .legend{display:flex;gap:28px;margin-top:20px;font-size:12px;letter-spacing:.08em;font-family:var(--en);text-transform:uppercase;color:var(--mute-d)}
.globe .legend i{display:inline-block;width:8px;height:8px;margin-right:8px;vertical-align:middle}
@media (max-width:1000px){.globe .wrap{grid-template-columns:1fr}.globe canvas{max-width:520px}}

/* ---------- News ---------- */
.news .ls{border-top:1px solid var(--line-l)}
.news .ls li{display:grid;grid-template-columns:120px 1fr auto;gap:16px 32px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line-l)}
.news .ls .dt{font-family:var(--en);font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--mute-l)}
.news .ls b{font-size:17px;font-weight:600;letter-spacing:-.02em}
.news .ls span.ct{font-size:13px;color:var(--mute-l)}
.news .notice{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px;border:1px dashed var(--line-l2);font-size:14px;color:var(--mute-l)}
@media (max-width:700px){.news .ls li{grid-template-columns:1fr;gap:6px}}

/* ---------- CTA ---------- */
.cta-blk{position:relative;overflow:hidden;background:var(--navy)}
.cta-blk .wrap{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:40px;align-items:end}
.cta-blk h2{font-weight:700;font-size:clamp(36px,5.4vw,88px);letter-spacing:-.045em;line-height:1.02}
.cta-blk p{margin-top:24px;max-width:520px;font-size:clamp(15px,1.15vw,18px);line-height:1.72;color:rgba(243,241,234,.78)}
.cta-blk .acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.cta-blk .ctc{border-left:1px solid var(--line-d);padding-left:32px;font-size:14px;color:var(--mute-d);line-height:2}
.cta-blk .ctc b{display:block;color:var(--fg-d);font-family:var(--en);font-size:clamp(20px,1.8vw,28px);font-weight:600;letter-spacing:-.02em;line-height:1.3}
.cta-blk .ctc a:hover{color:#fff}
.cta-blk .bg{position:absolute;inset:0;z-index:1;opacity:.22}
.cta-blk .bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(.7) contrast(1.1) brightness(.7)}
.cta-blk .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--navy) 20%,rgba(11,23,43,.3))}
@media (max-width:1000px){.cta-blk .wrap{grid-template-columns:1fr}.cta-blk .ctc{border-left:0;padding-left:0;border-top:1px solid var(--line-d);padding-top:24px}}

/* ---------- Page hero (sub pages) ---------- */
.phero{position:relative;padding:calc(var(--header) + clamp(64px,9vw,140px)) var(--gx) clamp(48px,6vw,96px);background:var(--ink);overflow:hidden}
.phero .crumb{display:flex;gap:12px;align-items:center;font-family:var(--en);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute-d);margin-bottom:clamp(28px,4vw,56px)}
.phero .crumb a:hover{color:#fff}
.phero h1{font-weight:700;font-size:clamp(44px,7vw,112px);letter-spacing:-.045em;line-height:1}
.phero h1 .en{display:block;font-family:var(--en);font-weight:500;font-size:clamp(13px,1vw,15px);letter-spacing:.18em;text-transform:uppercase;color:var(--mute-d);margin-bottom:22px}
.phero .intro{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:end;margin-top:clamp(28px,4vw,56px)}
.phero .intro p{font-size:clamp(16px,1.3vw,20px);line-height:1.65;color:rgba(243,241,234,.8);max-width:560px}
.phero .intro .jump{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.phero .intro .jump a{font-size:13px;padding:8px 12px;border:1px solid var(--line-d);color:rgba(243,241,234,.78);transition:border-color .3s,color .3s}
.phero .intro .jump a:hover{border-color:var(--fg-d);color:#fff}
.phero .bgimg{position:absolute;inset:0;z-index:0;opacity:.28}
.phero .bgimg img{width:100%;height:100%;object-fit:cover;filter:grayscale(.6) saturate(.5) contrast(1.05) brightness(.6)}
.phero .bgimg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,14,28,.5),var(--ink) 95%)}
.phero>*{position:relative;z-index:1}
@media (max-width:900px){.phero .intro{grid-template-columns:1fr}.phero .intro .jump{justify-content:flex-start}}

/* ---------- Sub-page blocks ---------- */
.two{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,80px);align-items:start}
.two.rev{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.two .sticky{position:sticky;top:calc(var(--header) + 32px)}
@media (max-width:900px){.two,.two.rev{grid-template-columns:1fr}.two .sticky{position:static}}
.prose p+p{margin-top:1.1em}
.prose{font-size:clamp(15px,1.15vw,17px);line-height:1.85}
.light .prose,.lighter .prose{color:#2b3446}
.dark .prose{color:rgba(243,241,234,.82)}
.sig{margin-top:40px;display:flex;align-items:baseline;gap:16px}
.sig b{font-size:22px;letter-spacing:-.03em}
.sig span{font-size:13px;color:var(--mute-l)}
.kv{border-top:1px solid var(--line-l)}
.kv div{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line-l);font-size:15px}
.kv dt{color:var(--mute-l);font-weight:500}
.dark .kv{border-color:var(--line-d)}.dark .kv div{border-color:var(--line-d)}.dark .kv dt{color:var(--mute-d)}
@media (max-width:520px){.kv div{grid-template-columns:1fr;gap:4px}}
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-d)}
.values div{background:var(--navy);padding:clamp(24px,2.6vw,40px) clamp(18px,2vw,32px)}
.values .n{font-family:var(--en);font-size:12px;letter-spacing:.16em;color:var(--red);font-weight:600}
.values b{display:block;margin-top:40px;font-family:var(--en);font-size:clamp(22px,2vw,30px);font-weight:700;letter-spacing:-.02em}
.values .ko{display:block;font-size:17px;font-weight:600;margin-top:4px}
.values p{margin-top:16px;font-size:14px;line-height:1.7;color:var(--mute-d)}
@media (max-width:900px){.values{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.values{grid-template-columns:1fr}}

/* timeline */
.tl{border-top:1px solid var(--line-l)}
.tl .dec{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:24px 40px;padding:clamp(28px,3vw,48px) 0;border-bottom:1px solid var(--line-l)}
.tl .dec h3{font-family:var(--en);font-size:clamp(40px,5vw,80px);font-weight:500;letter-spacing:-.05em;line-height:.95;position:sticky;top:calc(var(--header) + 24px)}
.tl .dec h3 small{display:block;font-family:var(--font);font-size:15px;font-weight:600;letter-spacing:-.01em;margin-top:14px;color:var(--mute-l)}
.tl .dec ul li{display:grid;grid-template-columns:72px 1fr;gap:16px;padding:10px 0;border-bottom:1px solid var(--line-l);font-size:15px;line-height:1.6}
.tl .dec ul li:last-child{border-bottom:0}
.tl .dec ul li b{font-family:var(--en);font-weight:600;color:var(--blue);letter-spacing:.02em}
.tl .dec .ph{aspect-ratio:3/2;margin-bottom:24px}
@media (max-width:860px){.tl .dec{grid-template-columns:1fr}.tl .dec h3{position:static}}

/* patents list */
.plist{columns:2;column-gap:48px}
.plist li{break-inside:avoid;display:grid;grid-template-columns:52px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-l);font-size:14px;line-height:1.55}
.plist li b{font-family:var(--en);font-weight:600;color:var(--mute-l);font-size:13px}
.plist li span.k{display:block;font-size:12px;color:var(--mute-l);margin-top:2px;font-family:var(--en);letter-spacing:.04em}
@media (max-width:760px){.plist{columns:1}}

/* teams */
.teams{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line-l)}
.teams div{background:var(--ivory);padding:28px 20px 32px}
.teams b{display:block;font-size:19px;letter-spacing:-.02em}
.teams .en{display:block;font-family:var(--en);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute-l);margin-top:6px}
.teams p{margin-top:18px;font-size:14px;line-height:1.7;color:#3a4458}
@media (max-width:1000px){.teams{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){.teams{grid-template-columns:1fr}}

/* map / location */
.loc{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,3vw,56px)}
.loc .map{position:relative;background:var(--navy);aspect-ratio:16/10;overflow:hidden;color:var(--fg-d)}
.loc .map svg{width:100%;height:100%}
.loc .map .pin-lbl{position:absolute;left:24px;bottom:22px;font-size:13px;line-height:1.6;color:rgba(243,241,234,.8)}
.loc .map .pin-lbl b{display:block;font-size:15px;color:#fff}
.loc .ext{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
@media (max-width:900px){.loc{grid-template-columns:1fr}}

/* product cards grid (products page) */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-l)}
.pgrid a,.pgrid div.card{display:flex;flex-direction:column;background:var(--ivory);padding:clamp(22px,2.4vw,36px);min-height:380px;color:var(--fg-l);position:relative;transition:background .4s}
.pgrid a:hover{background:var(--paper)}
.pgrid .ph{aspect-ratio:16/10;margin-bottom:24px;background:#dcd9d0}
.pgrid .ph img{object-fit:contain;padding:7%;filter:grayscale(.2) saturate(.7) contrast(1.05) drop-shadow(0 18px 24px rgba(11,23,43,.25))}
.pgrid .ph::before{opacity:.12}.pgrid .ph::after{opacity:.2}
.pgrid h3{font-size:clamp(22px,2vw,30px);letter-spacing:-.035em;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.pgrid h3 .en{font-family:var(--en);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute-l);font-weight:600}
.pgrid p{margin-top:12px;font-size:14px;line-height:1.7;color:#3a4458;flex:1}
.pgrid .mods{margin-top:16px;display:flex;flex-wrap:wrap;gap:6px}
.pgrid .mods span{font-family:var(--en);font-size:12px;letter-spacing:.06em;padding:4px 8px;border:1px solid var(--line-l2);color:var(--fg-l)}
.pgrid .foot{margin-top:22px;display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600}
.pgrid .foot svg{width:16px;height:16px}
.pgrid [data-ind]{transition:opacity .4s var(--ease)}
.pgrid.filtered a:not(.hit),.pgrid.filtered div.card:not(.hit){opacity:.22}
@media (max-width:1000px){.pgrid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.pgrid{grid-template-columns:1fr}.pgrid a{min-height:0}}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{height:40px;padding:0 16px;border:1px solid var(--line-l2);font-size:14px;font-weight:600;transition:background .3s,color .3s,border-color .3s}
.chips button[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}
.chips button:hover{border-color:var(--navy)}
.dark .chips button{border-color:var(--line-d2)}.dark .chips button[aria-pressed="true"]{background:var(--ivory);color:var(--navy);border-color:var(--ivory)}
.toggle{display:inline-flex;border:1px solid var(--line-l2)}
.toggle button{height:44px;padding:0 20px;font-size:14px;font-weight:600;color:var(--mute-l)}
.toggle button[aria-pressed="true"]{background:var(--navy);color:#fff}

/* spec table */
.spec{border-top:1px solid var(--line-d)}
.spec div{display:grid;grid-template-columns:220px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid var(--line-d);font-size:15px}
.spec dt{color:var(--mute-d)}
.light .spec,.lighter .spec{border-color:var(--line-l)}.light .spec div,.lighter .spec div{border-color:var(--line-l)}.light .spec dt,.lighter .spec dt{color:var(--mute-l)}
@media (max-width:560px){.spec div{grid-template-columns:1fr;gap:4px}}

/* process diagram (product detail) */
.pflow{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line-d)}
.pflow div{background:var(--navy);padding:clamp(20px,2vw,32px) clamp(16px,1.6vw,24px);min-height:220px;display:flex;flex-direction:column}
.pflow svg{width:56px;height:56px;color:var(--fg-d);margin-bottom:auto}
.pflow svg *{fill:none;stroke:currentColor;stroke-width:1.2;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.pflow b{display:block;font-size:20px;letter-spacing:-.025em;margin-top:28px}
.pflow .en{font-family:var(--en);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute-d);margin-top:4px;display:block}
.pflow p{font-size:13px;line-height:1.65;color:var(--mute-d);margin-top:12px}
@media (max-width:1000px){.pflow{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){.pflow{grid-template-columns:1fr 1fr}.pflow div{min-height:0}}

/* models */
.models{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-l)}
.models div{background:var(--ivory);padding:26px 22px 30px}
.models b{display:block;font-family:var(--en);font-size:clamp(20px,1.8vw,26px);font-weight:700;letter-spacing:-.02em}
.models span{display:block;font-size:13px;color:var(--mute-l);margin-top:6px}
.models p{font-size:14px;line-height:1.65;color:#3a4458;margin-top:16px}
@media (max-width:900px){.models{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.models{grid-template-columns:1fr}}

/* video gallery */
.vgal{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,24px)}
.vgal .vtile{display:block;color:inherit}
.vgal .ph{aspect-ratio:16/9;margin-bottom:14px}
.vgal b{display:block;font-size:16px;font-weight:600;letter-spacing:-.02em}
.vgal span{font-size:13px;color:var(--mute-d)}
.light .vgal span,.lighter .vgal span{color:var(--mute-l)}
.playmark{position:absolute;left:50%;top:50%;z-index:3;width:64px;height:64px;margin:-32px 0 0 -32px;border:1px solid rgba(243,241,234,.7);display:flex;align-items:center;justify-content:center;color:#fff;transition:background .4s,transform .4s var(--ease)}
.playmark svg{width:16px;height:16px;margin-left:3px}
.vtile:hover .playmark,.vbig:hover .playmark{background:var(--ivory);color:var(--navy);transform:scale(1.06)}
.vbig{display:block;position:relative;color:inherit}
.vbig .ph{aspect-ratio:21/9}
.vbig .ph .cap{bottom:24px;left:28px;right:28px}
.vbig .ph .cap b{font-family:var(--font);font-size:clamp(16px,1.6vw,22px);letter-spacing:-.02em;text-transform:none;font-weight:600}
@media (max-width:900px){.vgal{grid-template-columns:1fr}.vbig .ph{aspect-ratio:16/9}}

/* ---------- Steps (service) ---------- */
.steps{counter-reset:s;border-top:1px solid var(--line-l)}
.steps li{display:grid;grid-template-columns:72px minmax(0,4fr) minmax(0,7fr);gap:16px 32px;padding:clamp(20px,2.4vw,30px) 0;border-bottom:1px solid var(--line-l);align-items:start}
.steps li::before{counter-increment:s;content:counter(s,decimal-leading-zero);font-family:var(--en);font-size:14px;font-weight:600;letter-spacing:.08em;color:var(--blue);padding-top:6px}
.steps li b{font-size:clamp(20px,1.9vw,28px);letter-spacing:-.03em;line-height:1.25}
.steps li p{font-size:15px;line-height:1.75;color:#3a4458}
@media (max-width:860px){.steps li{grid-template-columns:48px 1fr}.steps li p{grid-column:2}}
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line-d)}
.svc-grid article{background:var(--navy);padding:clamp(28px,3vw,48px)}
.svc-grid h3{font-size:clamp(24px,2.2vw,34px);letter-spacing:-.03em;display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.svc-grid h3 .en{font-family:var(--en);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute-d);font-weight:600}
.svc-grid p{margin-top:18px;font-size:15px;line-height:1.75;color:rgba(243,241,234,.78)}
.svc-grid ul{margin-top:20px;border-top:1px solid var(--line-d)}
.svc-grid ul li{padding:10px 0;border-bottom:1px solid var(--line-d);font-size:14px;display:flex;justify-content:space-between;gap:16px}
.svc-grid ul li span{color:var(--mute-d)}
@media (max-width:860px){.svc-grid{grid-template-columns:1fr}}
.files{border-top:1px solid var(--line-l)}
.files li{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line-l)}
.files li b{display:block;font-size:17px;letter-spacing:-.02em}
.files li span{font-size:13px;color:var(--mute-l)}
.faq details{border-bottom:1px solid var(--line-l)}
.faq details:first-child{border-top:1px solid var(--line-l)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr 32px;gap:16px;align-items:center;padding:22px 0;font-size:clamp(17px,1.4vw,20px);font-weight:600;letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{width:32px;height:32px;border:1px solid var(--line-l2);display:flex;align-items:center;justify-content:center;position:relative;transition:transform .4s var(--ease)}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;background:currentColor;width:12px;height:1px}
.faq summary i::after{transform:rotate(90deg);transition:transform .4s var(--ease)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq .a{padding:0 0 24px;font-size:15px;line-height:1.8;color:#3a4458;max-width:760px}

/* ---------- Forms ---------- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:20px 24px}
.form .full{grid-column:1/-1}
.fld{display:flex;flex-direction:column;gap:8px}
.fld label{font-size:13px;font-weight:600;display:flex;gap:6px;align-items:center}
.fld label .req{color:var(--red)}
.fld label .opt{color:var(--mute-l);font-weight:500}
.fld input,.fld select,.fld textarea{width:100%;height:56px;padding:0 16px;border:1px solid var(--line-l2);background:#fff;font:inherit;font-size:15px;color:var(--fg-l);border-radius:0;appearance:none;-webkit-appearance:none;transition:border-color .3s,box-shadow .3s}
.fld textarea{height:auto;min-height:160px;padding:14px 16px;resize:vertical;line-height:1.6}
.fld select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230B172B' stroke-width='1.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:0;border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}
.fld input::placeholder,.fld textarea::placeholder{color:#9aa1ae}
.fld .hint{font-size:12px;color:var(--mute-l);line-height:1.5}
.fld.err input,.fld.err select,.fld.err textarea{border-color:var(--red);box-shadow:0 0 0 1px var(--red)}
.fld .msg{display:none;font-size:12px;color:var(--red);align-items:center;gap:6px}
.fld .msg svg{width:14px;height:14px}
.fld.err .msg{display:flex}
.fld.err label{color:var(--red)}
.fld.ok input,.fld.ok select{border-color:var(--blue)}
.drop{border:1px dashed var(--line-l2);padding:28px 20px;text-align:center;font-size:14px;color:var(--mute-l);cursor:pointer;transition:border-color .3s,background .3s;background:#fff}
.drop:hover,.drop.over{border-color:var(--navy);background:var(--paper)}
.drop b{display:block;color:var(--fg-l);font-size:15px;margin-bottom:4px}
.drop input{display:none}
.drop .fl{margin-top:12px;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.drop .fl span{font-family:var(--en);font-size:12px;padding:4px 8px;border:1px solid var(--line-l);color:var(--fg-l)}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.6;cursor:pointer}
.check input{width:18px;height:18px;margin:3px 0 0;flex:none;accent-color:var(--navy)}
.check a{text-decoration:underline;text-underline-offset:3px}
.chk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 20px}
.chk-grid label{display:flex;gap:10px;align-items:center;font-size:14px;cursor:pointer}
.chk-grid input{width:16px;height:16px;accent-color:var(--navy);margin:0}
@media (max-width:760px){.form{grid-template-columns:1fr}.chk-grid{grid-template-columns:1fr 1fr}}
.formside{position:sticky;top:calc(var(--header) + 32px)}
.formside .ctc{border-top:1px solid var(--line-l);margin-top:32px}
.formside .ctc div{padding:16px 0;border-bottom:1px solid var(--line-l);font-size:14px;color:var(--mute-l)}
.formside .ctc b{display:block;color:var(--fg-l);font-family:var(--en);font-size:19px;font-weight:600;letter-spacing:-.01em;margin-top:2px}
.formside .ctc b.ko{font-family:var(--font)}

/* ---------- Modals ---------- */
.modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s}
.modal.open{opacity:1;visibility:visible}
.modal .bd{position:absolute;inset:0;background:rgba(7,14,28,.86);backdrop-filter:blur(6px)}
.modal .bx{position:relative;z-index:1;width:min(560px,100%);background:var(--ivory);color:var(--fg-l);padding:clamp(28px,4vw,48px);transform:translateY(24px);transition:transform .5s var(--ease)}
.modal.open .bx{transform:none}
.modal .bx .lbl{margin-bottom:16px}
.modal .bx h3{font-size:clamp(24px,2.4vw,32px);letter-spacing:-.035em;line-height:1.2}
.modal .bx p{margin-top:16px;font-size:15px;line-height:1.75;color:#3a4458}
.modal .bx .acts{margin-top:28px;display:flex;flex-wrap:wrap;gap:10px}
.modal .x{position:absolute;right:16px;top:16px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--fg-l)}
.modal .x svg{width:18px;height:18px}
.modal.video .bx{width:min(1280px,100%);background:#000;padding:0;color:#fff}
.modal.video video{width:100%;aspect-ratio:16/9;background:#000}
.modal.video .x{color:#fff;top:-48px;right:0}
.modal.video .vt{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px 18px;font-size:14px;background:var(--ink)}
.modal.video .vt span{color:var(--mute-d);font-size:12px;font-family:var(--en);letter-spacing:.08em;text-transform:uppercase}
.modal.video .vlist{display:flex;gap:8px;flex-wrap:wrap;padding:0 18px 16px;background:var(--ink)}
.modal.video .vlist button{font-size:13px;padding:8px 12px;border:1px solid var(--line-d);color:rgba(243,241,234,.8)}
.modal.video .vlist button[aria-pressed="true"]{background:var(--ivory);color:var(--navy);border-color:var(--ivory)}
.modal.search .bx{background:var(--ink);color:#fff;width:min(760px,100%)}
.modal.search .bx p{color:var(--mute-d)}
.modal.search input{width:100%;height:64px;background:transparent;border:0;border-bottom:1px solid var(--line-d2);color:#fff;font:inherit;font-size:clamp(22px,2.4vw,30px);letter-spacing:-.02em;padding:0}
.modal.search input:focus{outline:0;border-color:#fff}
.modal.search .x{color:#fff}
.toast{position:fixed;left:50%;bottom:28px;z-index:95;transform:translate(-50%,20px);opacity:0;visibility:hidden;background:var(--ivory);color:var(--navy);padding:14px 20px;font-size:14px;display:flex;gap:14px;align-items:center;box-shadow:0 20px 50px rgba(0,0,0,.35);transition:opacity .4s var(--ease),transform .4s var(--ease),visibility .4s;max-width:calc(100% - 40px)}
.toast.on{opacity:1;visibility:visible;transform:translate(-50%,0)}
.toast i{width:8px;height:8px;background:var(--red);flex:none}

/* ---------- Loader ---------- */
.ld{position:fixed;inset:0;z-index:120;background:var(--ink);display:flex;align-items:flex-end;justify-content:space-between;padding:32px var(--gx);color:var(--fg-d);transition:transform .9s var(--ease),visibility .9s;transform:translateY(0)}
.ld.off{transform:translateY(-100%);visibility:hidden}
.ld .w{font-weight:700;font-size:clamp(28px,4vw,64px);letter-spacing:-.045em;line-height:1}
.ld .n{font-family:var(--en);font-size:13px;letter-spacing:.14em;color:var(--mute-d)}
.ld .bar{position:absolute;left:0;bottom:0;height:2px;background:var(--red);width:0;transition:width .6s var(--ease)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  [data-reveal]{opacity:1;transform:none}[data-curtain]{clip-path:none}.ph.scale img,.ph.scale video{transform:none}
  .cur{display:none}
}

/* ---------- R5: subpages — two-tier. Hero stays full-bleed (same as home); everything below sits in one centred 1440px container. Header/footer keep the home system. ---------- */
body.subpage .wrap{max-width:1440px;margin:0 auto}
body.subpage .phero .wrap,body.subpage .ftr .wrap,body.subpage .hero .wrap{max-width:none;margin:0}
/* body image rules: grid-column placement, fixed 3:2 / 16:9, capped heights */
body.subpage .vbig .ph{aspect-ratio:16/9;width:100%}
body.subpage .wrap>.vbig{display:block;max-width:1280px;margin:0 auto}
body.subpage .indsec .body .ph,body.subpage .caselist .media .ph,body.subpage .two .ph.ratio-4,body.subpage .cases .feat .ph{aspect-ratio:3/2}
body.subpage .tl .dec .ph{aspect-ratio:16/9;max-height:520px}
body.subpage .gallery{grid-template-columns:repeat(3,1fr)}
body.subpage .gallery .ph{grid-row:auto;grid-column:auto;aspect-ratio:3/2}
body.subpage .d3grid .ph{aspect-ratio:3/2}
body.subpage .xp{max-width:1120px;margin:16px auto 0}
body.subpage .v3d{max-height:640px;max-width:1280px;margin:0 auto}
body.subpage .loc .map{max-height:560px}
body.subpage .pgrid .ph{aspect-ratio:3/2}
body.subpage .vgal .ph{aspect-ratio:16/9}
body.subpage .certs .docs .ph{max-height:360px}
@media (max-width:760px){body.subpage .gallery{grid-template-columns:1fr 1fr}body.subpage .gallery .ph:first-child{grid-column:span 2}}

/* R5b: header must never overflow at 1440 — nav shrinks its gaps/tracking before anything else */
.nav{flex:1 1 auto;min-width:0;justify-content:center;margin:0 16px}
@media (max-width:1560px){.nav{gap:clamp(8px,1.1vw,22px)}.nav>li>a{letter-spacing:.07em}.hdr .tools{gap:clamp(8px,1vw,18px)}}