/* =========================================================
   81/82 — OWN BUSINESS page
   depends on styles.css (tokens / header / reveal / buttons / footer)
   tone: 実践 / プロダクト / 市場創造  — brand navy + FLYING sky accent
   ========================================================= */
.ob{--sky:#4F7FD6;--sky-pale:#E9F0FC;--sky-ink:#2A55A8}
.ob .sec{padding:180px 0}
.ob .h2{font-size:clamp(32px,3.9vw,56px)}
.ob-head{display:grid;grid-template-columns:1.15fr 1fr;gap:80px;align-items:end}
.ob-head .lead{margin-top:0}

/* ---------- HERO ---------- */
.ob-hero{height:96vh;min-height:660px;position:relative;overflow:hidden;background:var(--navy);color:#fff}
.ob-hero .hero-bg img{object-position:62% 50%;animation:heroZoom 26s cubic-bezier(.3,0,.2,1) forwards}
.ob-hero .hero-shade{background:
  radial-gradient(70% 85% at 0% 100%,rgba(8,18,52,.9) 0%,rgba(8,18,52,.62) 42%,rgba(8,18,52,0) 78%),
  linear-gradient(90deg,rgba(8,18,52,.6) 0%,rgba(8,18,52,.28) 40%,rgba(8,18,52,0) 62%),
  linear-gradient(180deg,rgba(10,22,64,.4) 0%,rgba(10,22,64,0) 18%)}
.ob-hero .hero-copy{max-width:900px}
.ob-hero h1{font-size:clamp(36px,4.6vw,72px);font-weight:500;line-height:1.3;letter-spacing:.06em;text-shadow:0 2px 24px rgba(8,18,52,.55)}
.ob-hero .intro{margin-top:30px;font-size:clamp(14px,1.05vw,16px);line-height:2.15;letter-spacing:.06em;color:rgba(255,255,255,.9);text-shadow:0 1px 16px rgba(10,22,64,.4)}
.ob-kicker{display:flex;flex-direction:column;gap:8px;margin-bottom:34px}
.ob-kicker .a{display:flex;align-items:center;gap:14px;font-family:var(--latin);font-size:13px;letter-spacing:.36em}
.ob-kicker .a::before{content:"";width:36px;height:1px;background:currentColor}
.ob-kicker .b{font-family:var(--latin);font-size:10.5px;letter-spacing:.3em;color:rgba(255,255,255,.7);padding-left:50px}
.ob-crumb{position:absolute;top:110px;left:clamp(28px,5.5vw,96px);z-index:3;font-family:var(--latin);font-size:10.5px;letter-spacing:.28em;color:rgba(255,255,255,.75)}
.ob-crumb a:hover{color:#fff}
.ob-crumb span{margin:0 10px;opacity:.5}
.ob-tag{position:absolute;right:clamp(80px,8vw,140px);bottom:clamp(44px,7vh,84px);z-index:3;font-family:var(--serif);font-size:clamp(18px,1.6vw,24px);line-height:1.25;text-align:right;color:rgba(255,255,255,.92);letter-spacing:.02em}

/* ---------- 02 OUR OWN BUSINESS ---------- */
.oo{background:#fff}
.oo-body{font-size:16.5px;line-height:2.2;color:#3B4866}
.oo-body .q{color:var(--navy);font-weight:500;font-size:clamp(17px,1.4vw,20px);line-height:2.1;letter-spacing:.06em;margin-bottom:28px}
.oo-pillars{margin-top:130px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,48px)}
.oo-pl{position:relative;display:block;border-radius:28px;overflow:hidden;aspect-ratio:5/4;color:#fff;isolation:isolate;background:var(--navy)}
.oo-pl .ph{position:absolute;inset:0;z-index:-2}
.oo-pl .ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);filter:saturate(.85);transition:transform 1.6s var(--ease),filter 1.6s var(--ease)}
.oo-pl:first-child .ph img{object-position:60% 50%}
.oo-pl::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,22,64,.35) 0%,rgba(10,22,64,0) 32%,rgba(10,22,64,.15) 55%,rgba(10,22,64,.82) 100%)}
.oo-pl:hover .ph img{transform:scale(1.07);filter:saturate(1)}
.oo-pl .tx{position:absolute;left:40px;right:40px;bottom:40px}
.oo-pl .no{position:absolute;left:0;top:calc(-1 * (100% + 0px));font-family:var(--latin);font-size:11px;letter-spacing:.32em}
.oo-pl .en{font-family:var(--serif);font-size:clamp(44px,5vw,80px);line-height:.98}
.oo-pl h3{margin-top:22px;font-size:clamp(16px,1.35vw,20px);font-weight:500;letter-spacing:.12em;line-height:1.7;display:flex;gap:16px}
.oo-pl h3::before{content:"";width:28px;height:1px;background:currentColor;margin-top:.9em;flex-shrink:0}
.oo-pl .sub{margin-top:18px;font-family:var(--latin);font-size:10.5px;letter-spacing:.24em;color:rgba(255,255,255,.7)}
.oo-pl>.ar{position:absolute;top:32px;right:32px;width:56px;height:56px;border-radius:50%;border:1px solid rgba(255,255,255,.6);display:grid;place-items:center;transition:background .4s,color .4s,transform .6s var(--ease)}
.oo-pl:hover>.ar{background:#fff;color:var(--navy);transform:rotate(90deg)}
.oo-pl .tx .no{position:static;margin-bottom:18px;display:block}

/* ---------- 03 FLYING SERIES ---------- */
.fly{background:linear-gradient(180deg,var(--pale) 0%,#fff 100%);padding:180px 0 0;overflow:hidden}
.fly-mark{display:flex;align-items:baseline;gap:18px;font-family:var(--latin);font-weight:500;font-size:clamp(80px,13vw,210px);line-height:.85;letter-spacing:.08em;color:var(--navy);margin-bottom:90px;white-space:nowrap}
.fly-mark .pl{font-size:.32em;color:var(--sky);transform:translateY(-.9em);letter-spacing:0}
.fly-mark small{font-size:.11em;letter-spacing:.4em;color:var(--bluegray);font-weight:400}
.fly-index{margin-top:100px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--navy)}
.fly-index a{padding:26px 24px 26px 0;display:flex;align-items:baseline;gap:16px;font-family:var(--latin);font-size:14px;letter-spacing:.18em;color:var(--navy);border-bottom:1px solid var(--line);transition:color .3s}
.fly-index a+a{padding-left:24px;border-left:1px solid var(--line)}
.fly-index a b{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--sky)}
.fly-index a span{margin-left:auto;font-size:10px;letter-spacing:.28em;color:var(--bluegray)}
.fly-index a:hover{color:var(--sky-ink)}

.fx{display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:clamp(48px,6vw,110px);margin-top:180px;padding-right:max(40px,calc((100vw - 1240px)/2 + 40px))}
.fx-r{grid-template-columns:1fr 1.25fr;padding-right:0;padding-left:max(40px,calc((100vw - 1240px)/2 + 40px))}
.fx-r .fx-ph{order:2;border-radius:28px 0 0 28px}
.fx-ph{position:relative;aspect-ratio:4/3.1;border-radius:0 28px 28px 0;overflow:hidden;background:var(--navy-2)}
.fx-ph img,.fx-ph image-slot{width:100%;height:100%;object-fit:cover;display:block}
.fx-ph image-slot{background:repeating-linear-gradient(135deg,#E3EAF4 0 12px,#EDF2F8 12px 24px)}
.fx-stage{position:absolute;left:28px;top:28px;padding:9px 16px;border-radius:999px;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);font-family:var(--latin);font-size:10.5px;letter-spacing:.28em;color:var(--navy);pointer-events:none}
.fx-r .fx-stage{left:auto;right:28px}
.fx-no{font-family:var(--serif);font-size:clamp(60px,6vw,96px);line-height:1;color:var(--sky);display:flex;align-items:flex-start;gap:14px}
.fx-no span{font-family:var(--latin);font-size:11px;letter-spacing:.34em;color:var(--bluegray);margin-top:.9em}
.fx-name{margin-top:22px;font-size:clamp(22px,2vw,28px);font-weight:500;letter-spacing:.08em;line-height:1.4;color:#111}
.fx-tx h3,.fapp-head h3{margin-top:14px;font-size:clamp(20px,1.8vw,26px);font-weight:500;line-height:1.55;letter-spacing:.06em;color:var(--navy);word-break:auto-phrase}
.fx-num{margin-top:40px;padding:26px 0;border-top:1px solid var(--navy);border-bottom:1px solid var(--line)}
.fx-num .v{font-family:var(--serif);font-size:clamp(56px,5.6vw,88px);line-height:1;color:var(--navy);white-space:nowrap;letter-spacing:-.01em}
.fx-num .v i{font-style:normal;color:var(--sky)}
.fx-num .v small{font-family:var(--latin);font-size:13px;letter-spacing:.22em;color:var(--sky);margin-left:12px;vertical-align:.7em}
.fx-num .k{margin-top:12px;font-family:var(--latin);font-size:11px;letter-spacing:.3em;color:var(--bluegray)}
.fx-tx>p{margin-top:28px;font-size:15.5px;line-height:2.1;color:#3B4866;max-width:520px}
.fx-role{list-style:none;margin-top:26px;display:flex;flex-wrap:wrap;gap:8px}
.fx-role li{font-family:var(--latin);font-size:11px;letter-spacing:.2em;color:var(--sky-ink);background:var(--sky-pale);padding:8px 16px;border-radius:999px}

/* APP stage */
.fapp{margin-top:200px;padding:160px 0 180px;background:var(--navy);color:#fff;position:relative;overflow:hidden}
.fapp::before{content:"";position:absolute;left:50%;top:58%;width:1100px;height:1100px;transform:translate(-50%,-50%);border-radius:50%;border:1px solid rgba(255,255,255,.07);box-shadow:inset 0 0 0 160px rgba(79,127,214,.03),0 0 0 160px rgba(255,255,255,.015)}
.fapp .wrap{position:relative}
.fapp-head{display:grid;grid-template-columns:1.15fr 1fr;gap:80px;align-items:end}
.fapp .fx-name{color:var(--bluegray-2)}
.fapp .fx-no span{color:var(--bluegray-2)}
.fapp-head h3{color:#fff}
.fapp-head p{font-size:15.5px;line-height:2.1;color:#C3CDDD}
.fapp-stage{margin-top:90px;display:grid;grid-template-columns:1fr 330px 1fr;gap:clamp(32px,5vw,90px);align-items:center}
.phone{position:relative;width:330px;aspect-ratio:9/19;justify-self:center;transform:translateY(60px) rotate(-4deg);opacity:0;transition:transform 1.6s var(--ease),opacity 1.2s var(--ease)}
.fapp-stage.in .phone{transform:none;opacity:1}
.phone .body{position:absolute;inset:0;border-radius:52px;background:#0D1328;padding:12px;box-shadow:0 0 0 1.5px #3A4566,0 60px 120px -40px rgba(0,0,0,.7),0 0 0 8px rgba(255,255,255,.03)}
.phone .scr{width:100%;height:100%;border-radius:42px;overflow:hidden;background:#fff}
.phone .scr img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
.phone .glow{position:absolute;inset:10% -30%;background:radial-gradient(closest-side,rgba(79,127,214,.45),rgba(79,127,214,0));filter:blur(20px);z-index:-1}
.fapp-feat{list-style:none;display:flex;flex-direction:column;gap:56px}
.fapp-feat.l{text-align:right}
.fapp-feat li{position:relative;opacity:0;transform:translateY(16px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(.6s + var(--i) * .12s)}
.fapp-stage.in .fapp-feat li{opacity:1;transform:none}
.fapp-feat b{display:block;font-family:var(--latin);font-weight:500;font-size:13px;letter-spacing:.24em}
.fapp-feat span{display:block;margin-top:8px;font-size:15px;color:#C3CDDD;letter-spacing:.08em}
.fapp-feat li::after{content:"";position:absolute;top:.55em;width:clamp(20px,3vw,60px);height:1px;background:rgba(255,255,255,.3)}
.fapp-feat.l li::after{right:calc(-1 * clamp(32px,5vw,90px));width:clamp(24px,4vw,76px)}
.fapp-feat.r li::after{left:calc(-1 * clamp(32px,5vw,90px));width:clamp(24px,4vw,76px)}
.fapp-feat li::before{content:"";position:absolute;top:calc(.55em - 3px);width:7px;height:7px;border-radius:50%;background:var(--sky)}
.fapp-feat.l li::before{right:-14px}
.fapp-feat.r li::before{left:-14px}
.fapp-feat.l li{padding-right:0}
.fapp-stage-lbl{margin-top:90px;display:flex;justify-content:center;align-items:center;gap:18px;font-family:var(--latin);font-size:11px;letter-spacing:.32em;color:var(--bluegray-2)}
.fapp-stage-lbl i{width:60px;height:1px;background:rgba(255,255,255,.25)}

/* ---------- 04 ECOSYSTEM ---------- */
.eco{background:#fff}
.eco .lead strong{display:block;font-size:clamp(20px,1.9vw,27px);font-weight:500;line-height:1.75;letter-spacing:.06em;color:var(--navy)}
.eco-dia{margin-top:120px;position:relative}
.eco-brace{position:relative;width:60%;height:34px;border:1px solid var(--sky);border-bottom:0;border-radius:12px 12px 0 0;margin-bottom:28px;opacity:0;transition:opacity 1s var(--ease) .2s}
.eco-dia.in .eco-brace{opacity:1}
.eco-brace span{position:absolute;left:50%;top:-8px;transform:translateX(-50%);background:#fff;padding:0 16px;font-family:var(--latin);font-size:10.5px;letter-spacing:.28em;color:var(--sky-ink);white-space:nowrap}
.eco-flow{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:0}
.eco-flow li{position:relative;padding:0 18px;text-align:center;opacity:0;transform:translateY(20px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(.3s + var(--i) * .22s)}
.eco-dia.in .eco-flow li{opacity:1;transform:none}
.eco-flow li:not(:last-child)::after{content:"→";position:absolute;right:-8px;top:calc(clamp(120px,11vw,160px)/2 + 14px);transform:translateY(-50%);color:var(--bluegray-2);font-size:16px}
.eco-flow .st{font-family:var(--latin);font-size:10.5px;letter-spacing:.28em;color:var(--bluegray);height:28px}
.eco-flow .nm{width:clamp(120px,11vw,160px);aspect-ratio:1;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:clamp(13px,1.1vw,15.5px);font-weight:500;letter-spacing:.06em;line-height:1.5}
.eco-flow .t .nm{background:var(--navy);color:#fff;box-shadow:0 0 0 8px rgba(79,127,214,.12)}
.eco-flow .d .nm{background:var(--sky-pale);color:var(--sky-ink);border:1px dashed var(--sky)}
.eco-flow .n .nm{background:#fff;color:var(--navy);border:1px solid var(--navy)}
.eco-flow p{margin-top:22px;font-size:13.5px;line-height:1.9;color:#3B4866;letter-spacing:.04em}
.eco-loop{margin:44px 0 0 10%;width:80%;height:46px;border:1px solid var(--line);border-top:0;border-radius:0 0 46px 46px;position:relative;opacity:0;transition:opacity 1s var(--ease) 1.6s}
.eco-dia.in .eco-loop{opacity:1}
.eco-loop span{position:absolute;left:50%;bottom:-11px;transform:translateX(-50%);background:#fff;padding:0 14px;font-size:13px;letter-spacing:.1em;color:var(--bluegray)}
.eco-state{margin-top:130px;display:grid;grid-template-columns:1.15fr 1fr;gap:80px;align-items:end;border-top:1px solid var(--navy);padding-top:52px}
.eco-state .big{font-size:clamp(22px,2.2vw,31px);font-weight:500;letter-spacing:.05em;line-height:1.6;color:var(--navy)}
.eco-state p:not(.big){font-size:16px;line-height:2.2;color:#3B4866}
.eco-state strong{color:var(--navy);font-weight:500;background:linear-gradient(transparent 62%,var(--sky-pale) 62%)}

/* ---------- 05 PROJECT (tone change: dark, full-bleed photo) ---------- */
.pj{background:var(--navy);color:#fff;padding:180px 0 0}
.pj .h2{color:#fff}
.pj .eyebrow{color:var(--bluegray-2)}
.pj .lead{color:#C3CDDD}
.pj-intro{padding-bottom:140px}
.pjx{position:relative;min-height:112vh;overflow:hidden;display:flex;align-items:flex-end;isolation:isolate}
.pjx-ph{position:absolute;inset:-8% 0;z-index:-2}
.pjx-ph img{width:100%;height:100%;object-fit:cover}
.pjx-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,22,64,.85) 0%,rgba(10,22,64,.1) 26%,rgba(10,22,64,.15) 55%,rgba(10,22,64,.9) 100%),linear-gradient(90deg,rgba(10,22,64,.55) 0%,rgba(10,22,64,0) 55%)}
.pjx.r .pjx-shade{background:linear-gradient(180deg,rgba(10,22,64,.85) 0%,rgba(10,22,64,.1) 26%,rgba(10,22,64,.15) 55%,rgba(10,22,64,.9) 100%),linear-gradient(270deg,rgba(10,22,64,.6) 0%,rgba(10,22,64,0) 55%)}
.pjx-in{width:100%;padding-bottom:110px;display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:end}
.pjx-no{grid-column:1/-1;font-family:var(--latin);font-size:12px;letter-spacing:.34em;color:rgba(255,255,255,.75);align-self:start}
.pjx-no b{font-family:var(--serif);font-weight:400;font-size:22px;color:#fff;margin-left:6px;letter-spacing:0}
.pjx-name{font-family:var(--latin);font-weight:500;font-size:clamp(52px,7.4vw,124px);line-height:.95;letter-spacing:.02em;text-shadow:0 4px 40px rgba(8,18,52,.4)}
.pjx-card{background:rgba(10,22,64,.48);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:40px 40px 36px}
.pjx-card h3{font-size:clamp(20px,1.8vw,26px);font-weight:500;line-height:1.65;letter-spacing:.06em;word-break:auto-phrase}
.pjx-card p{margin-top:20px;font-size:14.5px;line-height:2.05;color:#D3DBE7}
.pjx-kw{list-style:none;margin-top:24px;display:flex;flex-wrap:wrap;gap:8px}
.pjx-news{display:inline-flex;align-items:center;gap:14px;margin-top:28px;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.55);font-family:var(--latin);font-size:11.5px;letter-spacing:.24em;color:#fff;transition:border-color .4s}
.pjx-news i{font-style:normal;transition:transform .5s var(--ease)}
.pjx-news:hover{border-color:#fff}
.pjx-news:hover i{transform:translateX(6px)}
.pjx-news:focus-visible{outline:2px solid #fff;outline-offset:4px}
.pjx-kw li{font-family:var(--latin);font-size:10.5px;letter-spacing:.2em;padding:7px 14px;border:1px solid rgba(255,255,255,.35);border-radius:999px}
.pjx.r .pjx-in{grid-template-columns:1fr 1.2fr}
.pjx.r .pjx-name{order:2;text-align:right}
.pjx.r .pjx-card{order:1}
.pjx-geo{position:absolute;right:clamp(28px,4vw,60px);top:clamp(40px,6vh,70px);font-family:var(--latin);font-size:10.5px;letter-spacing:.3em;color:rgba(255,255,255,.65);writing-mode:vertical-rl}
.pjx.r .pjx-geo{right:auto;left:clamp(28px,4vw,60px)}

/* ---------- 06 BUSINESS SYSTEM ---------- */
.sy{background:var(--pale);overflow:hidden}
.sy-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center}
.sy-key{margin-top:50px;font-size:clamp(22px,2.2vw,31px);font-weight:500;line-height:1.75;letter-spacing:.06em;color:var(--navy);padding-left:24px;border-left:2px solid var(--sky)}
.sy-body{margin-top:32px;font-size:16px;line-height:2.2;color:#3B4866}
.sy-ring{position:relative;width:min(100%,640px);aspect-ratio:1;justify-self:center}
.sy-ring svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sy-ring .base{fill:none;stroke:var(--line);stroke-width:.4}
.sy-ring .draw{fill:none;stroke:var(--navy);stroke-width:.5;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset 2.6s var(--ease) .2s}
.sy-ring.in .draw{stroke-dashoffset:0}
.sy-ring .inner{fill:#fff;stroke:var(--line);stroke-width:.3}
.sy-orbit{position:absolute;inset:12%;border-radius:50%;animation:syspin 14s linear infinite;pointer-events:none}
.sy-orbit i{position:absolute;left:50%;top:-5px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--sky);box-shadow:0 0 0 6px rgba(79,127,214,.18)}
@keyframes syspin{to{transform:rotate(360deg)}}
.sy-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center}
.sy-center .mk{font-family:var(--serif);font-size:clamp(40px,4.4vw,64px);line-height:1;color:var(--navy)}
.sy-center .t{margin-top:14px;font-family:var(--latin);font-size:10px;letter-spacing:.32em;color:var(--bluegray);line-height:1.9}
.sy-node{position:absolute;width:31%;padding:18px 18px 16px;background:#fff;border-radius:18px;box-shadow:0 0 0 1px var(--line),0 24px 50px -34px rgba(10,22,64,.45);transform:translate(-50%,-50%) scale(.92);opacity:0;transition:opacity .9s var(--ease),transform .9s var(--ease);text-align:left}
.sy-ring.in .sy-node{opacity:1;transform:translate(-50%,-50%)}
.sy-node .k{display:block;font-family:var(--latin);font-size:10px;letter-spacing:.24em;color:var(--sky-ink);font-weight:500}
.sy-node b{display:block;margin-top:8px;font-size:clamp(17px,1.5vw,21px);font-weight:500;color:var(--navy);letter-spacing:.08em}
.sy-node small{display:block;margin-top:4px;font-size:12.5px;color:var(--bluegray);line-height:1.6}
.sy-node.fly{background:var(--navy);box-shadow:0 0 0 8px rgba(79,127,214,.12),0 30px 60px -30px rgba(10,22,64,.6)}
.sy-node.fly .k{color:#8FB0EA}.sy-node.fly b{color:#fff}.sy-node.fly small{color:#B9C4D6}
.sy-node.n0{left:50%;top:12%;transition-delay:.4s}
.sy-node.n1{left:88%;top:50%;transition-delay:.8s}
.sy-node.n2{left:50%;top:88%;transition-delay:1.2s}
.sy-node.n3{left:12%;top:50%;transition-delay:1.6s}
.sy-ret{position:absolute;left:10%;top:17%;transform:translate(-50%,-50%);font-family:var(--latin);font-size:10px;letter-spacing:.24em;color:var(--sky-ink);font-weight:500;text-align:center;line-height:1.7;opacity:0;transition:opacity 1s var(--ease) 2.2s;white-space:nowrap}
.sy-ret span{font-family:var(--sans);font-size:11.5px;letter-spacing:.04em;color:var(--bluegray);font-weight:400}
.sy-ring.in .sy-ret{opacity:1}

/* ---------- 07 WHY WE BUILD ---------- */
.wb{background:#fff}
.wb-body p{margin-top:30px;font-size:16px;line-height:2.2;color:#3B4866}
.wb-steps{list-style:none;counter-reset:s}
.wb-steps li{counter-increment:s;display:flex;gap:18px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line);font-size:clamp(16px,1.3vw,19px);font-weight:500;color:var(--navy);letter-spacing:.06em}
.wb-steps li::before{content:"0" counter(s);font-family:var(--serif);font-size:14px;color:var(--sky);font-weight:400}
.wb-words{margin-top:150px;border-top:1px solid var(--navy)}
.wb-words .w{display:flex;justify-content:space-between;align-items:center;gap:40px;padding:30px 0;border-bottom:1px solid var(--line);color:var(--line);transition:color .6s var(--ease)}
.wb-words .t{font-family:var(--serif);font-size:clamp(64px,10vw,164px);line-height:1;letter-spacing:-.005em;transform:translateX(-30px);opacity:0;transition:transform 1.2s var(--ease),opacity 1.2s var(--ease)}
.wb-words .w:nth-child(2) .t{transition-delay:.18s}.wb-words .w:nth-child(3) .t{transition-delay:.36s}
.wb-words.in .t{transform:none;opacity:1}
.wb-words .s{font-family:var(--latin);font-size:12px;letter-spacing:.26em;color:var(--bluegray);white-space:nowrap}
.wb-words .w:nth-child(3) .s{font-family:var(--sans);letter-spacing:.08em;font-size:14px}
.wb-words .w{color:#C9D3E1}
.wb-words .w.on{color:var(--navy)}
.wb-words a.w:hover{color:var(--accent)}
.wb-words .w.on .s{color:var(--sky-ink)}
.wb-note{margin-top:56px;font-size:16px;line-height:2.2;color:#3B4866;text-align:right}

/* ---------- 08 CLOSING ---------- */
.ocl{position:relative;overflow:hidden;background:var(--navy);color:#fff;padding:230px 0 200px;text-align:center}
.ocl-bg{position:absolute;inset:-8% 0;z-index:0}
.ocl-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(.5) brightness(.5)}
.ocl::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,22,64,.86),rgba(10,22,64,.74) 50%,rgba(10,22,64,.94))}
.ocl .wrap{position:relative;z-index:2}
.ocl .small{font-family:var(--latin);font-size:12px;letter-spacing:.34em;color:var(--bluegray-2)}
.ocl h2{font-size:clamp(38px,5vw,74px);font-weight:500;line-height:1.5;letter-spacing:.06em;margin:44px 0 56px}
.ocl-list{list-style:none;display:inline-flex;flex-direction:column;gap:6px;font-size:clamp(16px,1.4vw,20px);line-height:2;letter-spacing:.08em;color:#C3CDDD}
.ocl-list b{color:#fff;font-weight:500}
.ocl-end{margin-top:30px;font-size:16px;letter-spacing:.1em;color:#D3DBE7}
.ocl-brand{margin:110px auto 0;padding-top:56px;border-top:1px solid rgba(255,255,255,.2);max-width:560px}
.ocl-brand .mk{font-family:var(--serif);font-size:56px;line-height:1}
.ocl-brand .cp{margin-top:24px;font-size:clamp(20px,1.9vw,26px);font-weight:500;letter-spacing:.12em;line-height:1.8}
.ocl .cta{margin-top:64px}
.ocl .btn-hero{font-size:15.5px;padding:22px 24px 22px 40px;gap:26px}
.ocl .btn-hero .circ{width:40px;height:40px}

/* ---------- responsive ---------- */
@media (max-width:1100px) and (min-width:961px){
  .fapp-stage{grid-template-columns:1fr 280px 1fr}
  .phone{width:280px}
  .sy-node small{display:none}
}
@media (max-width:960px){
  .ob .sec{padding:120px 0}
  .ob-head,.fapp-head,.eco-state{grid-template-columns:1fr;gap:32px}
  .ob-crumb{top:84px}
  .ob-tag{display:none}
  .oo-pillars{grid-template-columns:1fr;margin-top:80px}
  .oo-pl{aspect-ratio:4/4.4;border-radius:22px}
  .oo-pl .tx{left:28px;right:28px;bottom:28px}
  .fly{padding-top:120px}
  .fly-mark{margin-bottom:56px}
  .fly-index{grid-template-columns:1fr}
  .fly-index a+a{padding-left:0;border-left:0}
  .fx,.fx-r{grid-template-columns:1fr;padding:0 24px;margin-top:110px;gap:40px}
  .fx-r .fx-ph{order:0}
  .fx-ph,.fx-r .fx-ph{border-radius:22px}
  .fapp{margin-top:120px;padding:110px 0}
  .fapp-stage{grid-template-columns:1fr;gap:48px;margin-top:64px}
  .phone{width:min(280px,76vw)}
  .fapp-feat{display:grid;grid-template-columns:1fr 1fr;gap:28px}
  .fapp-feat.l{text-align:left;order:2}
  .fapp-feat.r{order:3}
  .fapp-feat li::after,.fapp-feat li::before{display:none}
  .eco-brace,.eco-loop{display:none}
  .eco-flow{grid-template-columns:1fr;gap:28px;border-left:1px solid var(--line);margin-left:8px}
  .eco-flow li{display:grid;grid-template-columns:96px 1fr;column-gap:24px;text-align:left;padding:0 0 0 24px;align-items:center}
  .eco-flow li::after{display:none}
  .eco-flow .st{grid-column:2;height:auto}
  .eco-flow .nm{grid-row:1/3;width:96px;font-size:12px}
  .eco-flow p{grid-column:2;margin-top:6px}
  .pj{padding-top:120px}
  .pj-intro{padding-bottom:80px}
  .pjx{min-height:auto;padding-top:46vh}
  .pjx-in,.pjx.r .pjx-in{grid-template-columns:1fr;gap:28px;padding-bottom:64px}
  .pjx.r .pjx-name{order:0;text-align:left}
  .pjx-card{padding:28px 24px}
  .pjx-geo{display:none}
  .sy-grid{grid-template-columns:1fr}
  .sy-node{width:40%;padding:12px}
  .sy-node small,.sy-ret{display:none}
  .wb-words{margin-top:90px}
  .wb-words .w{flex-direction:column;align-items:flex-start;gap:8px}
  .wb-note{text-align:left}
  .ocl{padding:160px 0}
}
@media (prefers-reduced-motion:reduce){
  .sy-orbit{animation:none}
}