:root{
  --navy:#071633;
  --navy2:#0c2148;
  --ink:#101623;
  --gold:#b98a2e;
  --gold-l:#d8b25f;
  --cream:#f4efe4;
  --paper:#faf7f0;
  --beige:#aca68f;
  --line:rgba(7,22,51,.14);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Zen Kaku Gothic New',sans-serif;
  background:var(--paper);color:var(--ink);overflow-x:hidden;
}
::selection{background:var(--gold);color:#fff}
img{max-width:100%}

/* ===== film grain ===== */
body::after{
  content:"";position:fixed;inset:-50%;z-index:999;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 8s steps(10) infinite;
}
@keyframes grain{
  0%,100%{transform:translate(0,0)}10%{transform:translate(-5%,-5%)}20%{transform:translate(-10%,5%)}
  30%{transform:translate(5%,-10%)}40%{transform:translate(-5%,15%)}50%{transform:translate(-10%,5%)}
  60%{transform:translate(15%,0)}70%{transform:translate(0,10%)}80%{transform:translate(-15%,0)}90%{transform:translate(10%,5%)}
}

/* ===== cursor ===== */
.cursor{
  position:fixed;width:36px;height:36px;border:2px dashed var(--gold);border-radius:50%;
  z-index:1001;pointer-events:none;transform:translate(-50%,-50%);
  transition:width .25s,height .25s,background .25s;
  animation:spin 10s linear infinite;display:none;
}
@media(pointer:fine){.cursor{display:block}}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.cursor.hot{width:60px;height:60px;background:rgba(185,138,46,.12)}

/* ===== header ===== */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 0 0 32px;height:76px;
  transition:background .3s,box-shadow .3s;
}
header.scrolled{background:rgba(250,247,240,.92);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
header.on-dark:not(.scrolled){color:var(--cream)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.logo b{font-family:'Archivo',sans-serif;font-weight:800;font-size:27px;letter-spacing:.02em}
.logo span{font-size:10px;letter-spacing:.28em;color:var(--gold)}
.hd-btns{display:flex;height:100%}
.hd-btns a,.hd-btns button{
  width:76px;height:76px;display:grid;place-items:center;border:none;cursor:pointer;
  font-size:30px;transition:background .3s,color .3s;text-decoration:none;
}
.hd-mail{background:var(--navy);color:var(--cream)}
.hd-mail:hover{background:var(--gold)}
.hd-menu{background:var(--paper);color:var(--navy)}
.hd-menu:hover{background:var(--gold);color:#fff}

/* ===== overlay menu ===== */
.menu-ov{
  position:fixed;inset:0;z-index:200;background:var(--navy);color:var(--cream);
  display:flex;flex-direction:column;justify-content:center;padding:0 10vw;
  clip-path:circle(0 at calc(100% - 32px) 32px);transition:clip-path .6s cubic-bezier(.7,0,.3,1);
  visibility:hidden;
}
.menu-ov.open{clip-path:circle(150% at calc(100% - 32px) 32px);visibility:visible}
.menu-ov::before{
  content:"";position:absolute;inset:0;opacity:.06;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
.menu-ov a{
  display:flex;align-items:baseline;gap:22px;text-decoration:none;color:var(--cream);
  padding:14px 0;border-bottom:1px dashed rgba(216,178,95,.3);position:relative;
  transition:padding-left .3s;
}
.menu-ov a:hover{padding-left:16px}
.menu-ov a b{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-size:clamp(28px,4.4vh,42px)}
.menu-ov a span{font-size:12px;letter-spacing:.25em;color:var(--gold-l)}
.menu-close{
  position:absolute;top:0;right:0;width:76px;height:76px;background:var(--gold);border:none;
  color:var(--navy);font-size:22px;cursor:pointer;
}

/* ===== hero (top) ===== */
.hero{
  position:relative;background:var(--paper);
  padding:150px 6vw 70px;
}
.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:start}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}
.hero h1{
  font-family:'Shippori Mincho',serif;font-weight:800;
  font-size:clamp(34px,4.6vw,64px);line-height:1.5;letter-spacing:.04em;color:var(--navy);
}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln i{display:block;font-style:normal;transform:translateY(110%);animation:rise 1s cubic-bezier(.19,1,.22,1) forwards}
.hero h1 .ln:nth-child(2) i{animation-delay:.15s}
@keyframes rise{to{transform:none}}
.hero h1 .gold{color:var(--gold);position:relative;white-space:nowrap}
.hero h1 .gold svg{position:absolute;left:0;right:0;bottom:-.06em;width:100%;height:.14em;overflow:visible}
.hero h1 .gold path{
  stroke:var(--gold);stroke-width:3;fill:none;stroke-dasharray:8 8;
  stroke-dashoffset:600;animation:sew 2.4s .7s ease forwards;
}
@keyframes sew{to{stroke-dashoffset:0}}
.hero-sub{
  font-size:15px;line-height:2.3;color:#2c3446;padding-top:14px;
  opacity:0;animation:fade 1s .7s forwards;
}
.hero-sub b{color:var(--gold);font-weight:700}
@keyframes fade{to{opacity:1}}
.hero-cta{display:flex;justify-content:flex-end;margin-top:34px;opacity:0;animation:fade 1s 1s forwards}
.btn{
  display:inline-flex;align-items:center;gap:10px;text-decoration:none;cursor:pointer;
  background:var(--navy);color:#fff;font-weight:700;font-size:14px;letter-spacing:.18em;
  font-family:'Archivo',sans-serif;font-style:italic;
  padding:16px 34px;border:none;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);
  transition:background .3s,transform .2s;
}
.btn:hover{background:var(--gold);transform:translateY(-2px)}
.btn.gold{background:var(--gold);color:var(--navy)}
.btn.gold:hover{background:var(--gold-l)}
.hero-visual{
  position:relative;margin-top:64px;background:var(--navy);overflow:hidden;
  min-height:46vh;display:grid;place-items:center;
}
.hero-visual::before{
  content:"";position:absolute;inset:0;opacity:.08;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
.hero-visual::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 60% at 70% 30%,rgba(185,138,46,.25),transparent 65%);
}
.hero-visual .big{
  position:relative;z-index:2;text-align:center;
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(64px,11vw,170px);line-height:.95;
  color:transparent;-webkit-text-stroke:1.5px rgba(216,178,95,.55);
  user-select:none;
}
.hero-visual .big em{
  display:block;font-style:italic;font-size:.34em;letter-spacing:.5em;
  color:var(--gold-l);-webkit-text-stroke:0;margin-top:18px;
}
.scissors{position:absolute;z-index:1;width:min(46vw,520px);opacity:.5}
.scissors path{stroke:var(--gold-l);stroke-width:2.5;fill:none;stroke-linecap:round}
.scissors .dash{stroke-dasharray:6 10;animation:cutline 3s linear infinite}
@keyframes cutline{to{stroke-dashoffset:-64}}

/* ===== story (top) ===== */
#story-top{background:var(--navy);color:var(--cream);overflow:hidden}
#story-top::before{
  content:"";position:absolute;inset:0;opacity:.05;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
.story-grid{
  display:grid;grid-template-columns:auto 1fr;gap:48px;align-items:start;
  position:relative;z-index:2;max-width:1100px;
}
@media(max-width:860px){.story-grid{grid-template-columns:1fr}}
.story-badge{
  display:inline-block;background:var(--gold);color:#fff;
  font-family:'Shippori Mincho',serif;font-weight:800;
  font-size:clamp(22px,2.6vw,32px);letter-spacing:.04em;
  padding:14px 26px;position:relative;
  box-shadow:6px 6px 0 rgba(216,178,95,.25);
}
.story-badge::after{
  content:"";position:absolute;left:8px;right:8px;bottom:6px;
  border-bottom:2px dashed rgba(255,255,255,.5);
}
.story-text{font-size:14.5px;line-height:2.3;color:rgba(244,239,228,.88)}
.story-text b{color:var(--gold-l);font-weight:700}
.story-cta{display:flex;justify-content:flex-end;margin-top:44px;position:relative;z-index:2}
.story-img{
  position:relative;z-index:2;margin:56px auto 0;max-width:760px;
  background:var(--navy2);border:1px solid rgba(216,178,95,.35);
  min-height:300px;display:grid;place-items:center;overflow:hidden;
}
.story-img::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse 50% 60% at 50% 45%,rgba(216,178,95,.30),transparent 65%),
    radial-gradient(ellipse 70% 70% at 80% 20%,rgba(120,160,255,.15),transparent 60%);
}
.story-img span{
  position:relative;font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(22px,3vw,36px);letter-spacing:.2em;
  color:transparent;-webkit-text-stroke:1px var(--gold-l);
}
.story-img::after{
  content:"";position:absolute;left:20px;right:20px;bottom:20px;
  border-bottom:2px dashed rgba(216,178,95,.5);
}

/* ===== real assets ===== */
.logo img{height:46px;width:auto;align-self:center}
.hero-video{position:relative;margin-top:64px;overflow:hidden;background:var(--navy)}
.hero-video video{width:100%;max-height:70vh;object-fit:cover;display:block}
.hero-video::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:6px;
  background:repeating-linear-gradient(90deg,var(--gold) 0 14px,transparent 14px 24px);
}
.story-img img,.svc-visual img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.svc-visual{padding:0}
.story-img{min-height:0;padding:0;height:400px}
.cl-inner img{height:80px;width:auto;max-width:170px;object-fit:contain;vertical-align:middle;margin:0 32px;background:#fff;padding:8px 14px;border-radius:6px}
.wimg{margin:10px -26px 0;overflow:hidden}
.wcard .wimg img{width:100%;height:140px;object-fit:cover;display:block;transition:transform .4s}
.wcard:hover .wimg img{transform:scale(1.06)}
.mini-rail .wimg{margin:8px -20px 0}
.mini-rail .wimg img{height:100px}

/* ===== story logo visual (scissors × Tailor Base) ===== */
.story-logo{
  position:relative;z-index:2;margin:56px auto 0;max-width:760px;min-height:380px;
  background:var(--navy2);border:1px solid rgba(216,178,95,.35);
  display:grid;place-items:center;overflow:hidden;
}
.story-logo::before{
  content:"";position:absolute;inset:0;opacity:.08;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
.story-logo::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 60% at 70% 30%,rgba(185,138,46,.28),transparent 65%);
}
.story-logo .scissors{position:absolute;z-index:1;width:min(60%,480px);opacity:.5}
.story-logo .scissors path{stroke:var(--gold-l);stroke-width:2.5;fill:none;stroke-linecap:round}
.story-logo .scissors .dash{stroke-dasharray:6 10;animation:cutline 3s linear infinite}
@keyframes cutline{to{stroke-dashoffset:-64}}
.story-logo .big{
  position:relative;z-index:2;text-align:center;
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(56px,8vw,110px);line-height:.95;
  color:transparent;-webkit-text-stroke:1.5px rgba(216,178,95,.65);
  user-select:none;
  animation:logofloat 5s ease-in-out infinite;
}
@keyframes logofloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.story-logo .big em{
  display:block;font-style:italic;font-size:.24em;letter-spacing:.5em;
  color:var(--gold-l);-webkit-text-stroke:0;margin-top:16px;
}

/* ===== canvas particle network ===== */
.netcv{position:absolute;inset:0;z-index:1;pointer-events:none}

/* ===== works rail arrows ===== */
.rail-nav{display:flex;gap:12px;justify-content:flex-end;margin-bottom:18px;position:relative;z-index:2}
.rail-nav button{
  width:46px;height:46px;border:2px dashed var(--gold);background:transparent;color:var(--gold);
  font-size:18px;cursor:pointer;border-radius:50%;transition:background .3s,color .3s,border-style .3s;
}
.rail-nav button:hover{background:var(--gold);color:#fff;border-style:solid}

/* ===== mini works rail (service page) ===== */
.mini-label{
  display:inline-flex;align-items:center;gap:10px;margin-top:30px;
  font-size:12px;font-weight:700;letter-spacing:.25em;color:var(--gold);
}
.mini-label::before{content:"";width:30px;border-top:2px dashed var(--gold)}
.mini-rail{display:flex;gap:18px;overflow-x:auto;padding:16px 4px 20px}
.mini-rail::-webkit-scrollbar{height:6px}
.mini-rail::-webkit-scrollbar-thumb{background:var(--gold);border-radius:10px}
.mini-rail .wcard{min-width:260px;max-width:260px;padding:24px 20px}
.mini-rail .wcard h4{font-size:13.5px}

/* ===== marquee ===== */
.marquee{
  background:var(--gold);color:var(--navy);overflow:hidden;white-space:nowrap;
  padding:13px 0;transform:rotate(-1.2deg);margin:-20px -2vw 0;position:relative;z-index:5;
  box-shadow:0 10px 30px rgba(7,22,51,.18);
}
.marquee-inner{display:inline-block;animation:mq 28s linear infinite;font-family:'Archivo',sans-serif;font-weight:800;font-size:14px;letter-spacing:.18em}
.marquee-inner em{font-style:normal;color:var(--paper);margin:0 18px}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ===== page head (subpages) ===== */
.page-head{
  background:var(--navy);color:var(--cream);position:relative;overflow:hidden;
  padding:170px 6vw 80px;
}
.page-head::before{
  content:"";position:absolute;inset:0;opacity:.06;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
.page-head::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 50% 70% at 85% 20%,rgba(185,138,46,.2),transparent 60%);
}
.page-head h1{
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(52px,8vw,100px);line-height:1;position:relative;z-index:2;
}
.page-head .jp{
  display:inline-flex;align-items:center;gap:12px;margin-top:18px;position:relative;z-index:2;
  font-size:13px;font-weight:700;letter-spacing:.3em;color:var(--gold-l);
}
.page-head .jp::before{content:"";width:40px;border-top:2px dashed var(--gold-l)}
.crumbs{
  position:relative;z-index:2;margin-top:36px;font-family:'Archivo',sans-serif;
  font-size:11px;letter-spacing:.2em;color:rgba(244,239,228,.65);
}
.crumbs a{color:var(--gold-l);text-decoration:none}
.crumbs a:hover{text-decoration:underline dashed}
.page-head .wm{
  position:absolute;right:-2vw;bottom:-4vw;z-index:1;
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(100px,18vw,260px);line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(216,178,95,.15);
  user-select:none;pointer-events:none;
}

/* ===== sections common ===== */
section{padding:110px 6vw;position:relative}
.sec-head{display:flex;align-items:baseline;gap:24px;flex-wrap:wrap;margin-bottom:64px;position:relative;z-index:2}
.sec-head h2{
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(44px,6vw,80px);letter-spacing:-.01em;
}
.sec-head .jp{
  font-size:13px;font-weight:700;letter-spacing:.25em;color:var(--gold);
  display:inline-flex;align-items:center;gap:12px;
}
.sec-head .jp::before{content:"";width:40px;border-top:2px dashed var(--gold)}
.sec-head.light h2{color:var(--cream)}
.sec-head.light .jp{color:var(--gold-l)}
.watermark{
  position:absolute;top:40px;right:-2vw;z-index:0;pointer-events:none;user-select:none;
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(80px,14vw,200px);line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(7,22,51,.07);
}
.watermark.light{-webkit-text-stroke:1px rgba(244,239,228,.09)}
.rv{opacity:0;transform:translateY(36px);transition:opacity .8s ease,transform .8s ease}
.rv.on{opacity:1;transform:none}
.center-btn{text-align:center;margin-top:56px}

/* ===== service (top) ===== */
#service{background:var(--navy);color:var(--cream)}
#service::before{
  content:"";position:absolute;inset:0;opacity:.05;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
.svc{
  position:relative;z-index:2;
  display:grid;grid-template-columns:120px 1fr 1fr;gap:40px;align-items:center;
  padding:56px 0;border-top:2px dashed rgba(216,178,95,.35);
}
.svc:last-of-type{border-bottom:2px dashed rgba(216,178,95,.35)}
.svc:nth-child(even) .svc-visual{order:-1}
.svc:nth-child(even){grid-template-columns:1fr 120px 1fr}
.svc-num{
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-size:56px;
  color:transparent;-webkit-text-stroke:1.5px var(--gold-l);
}
.svc-body h3{font-size:clamp(20px,2.4vw,28px);font-weight:900;letter-spacing:.04em;margin-bottom:8px}
.svc-body small{display:block;font-family:'Archivo',sans-serif;font-weight:600;font-size:11px;letter-spacing:.3em;color:var(--gold-l);margin-bottom:20px}
.svc-body p{font-size:14px;line-height:2.2;color:rgba(244,239,228,.85)}
.svc-visual{
  position:relative;height:300px;background:var(--navy2);overflow:hidden;
  border:1px solid rgba(216,178,95,.3);
  display:grid;place-items:center;transition:transform .35s;
}
.svc:hover .svc-visual{transform:translateY(-6px) rotate(-.5deg)}
.svc-visual::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 70% 70% at 30% 30%,rgba(185,138,46,.25),transparent 60%);
}
.svc-visual span{
  position:relative;font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(20px,2.4vw,30px);letter-spacing:.1em;
  color:transparent;-webkit-text-stroke:1px var(--gold-l);
}
.svc-visual::after{
  content:"";position:absolute;left:14px;right:14px;bottom:14px;
  border-bottom:2px dashed rgba(216,178,95,.5);
}
@media(max-width:900px){
  .svc,.svc:nth-child(even){grid-template-columns:1fr;gap:20px}
  .svc:nth-child(even) .svc-visual{order:0}
  .svc-visual{height:220px}
}

/* ===== clients ===== */
.clients{background:var(--paper);padding:80px 0;overflow:hidden}
.clients h3{text-align:center;font-size:17px;font-weight:900;letter-spacing:.2em;margin-bottom:40px;color:var(--navy)}
.cl-marquee{overflow:hidden;white-space:nowrap}
.cl-inner{display:inline-block;animation:mq 32s linear infinite}
.cl-inner span{
  font-family:'Archivo',sans-serif;font-weight:800;font-size:22px;letter-spacing:.12em;
  color:rgba(7,22,51,.35);margin:0 34px;transition:color .3s;
}
.cl-inner span:hover{color:var(--gold)}
.cl-inner em{font-style:normal;color:var(--gold);font-size:14px;vertical-align:middle}

/* ===== worries ===== */
#worries{
  position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse 45% 55% at 10% 15%, rgba(216,178,95,.40), transparent 62%),
    radial-gradient(ellipse 50% 60% at 92% 88%, rgba(7,22,51,.22), transparent 65%),
    radial-gradient(ellipse 30% 40% at 78% 12%, rgba(250,247,240,.25), transparent 60%),
    linear-gradient(135deg,#b6b099 0%,#aca68f 45%,#98917a 100%);
}
#worries::before{
  content:"";position:absolute;inset:0;opacity:.16;pointer-events:none;
  background-image:
    linear-gradient(rgba(250,247,240,.9) 1px,transparent 1px),
    linear-gradient(90deg,rgba(250,247,240,.9) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse 85% 85% at 50% 40%,#000 30%,transparent 100%);
  mask-image:radial-gradient(ellipse 85% 85% at 50% 40%,#000 30%,transparent 100%);
}
.worry-wm{
  position:absolute;top:22px;right:-1vw;z-index:1;pointer-events:none;user-select:none;
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(70px,12vw,180px);line-height:1;
  color:transparent;-webkit-text-stroke:1.5px rgba(250,247,240,.35);
}
.stitch-line{position:absolute;left:-5%;right:-5%;border-top:2px dashed rgba(250,247,240,.5);pointer-events:none}
.stitch-line.t{top:60px;transform:rotate(-1.4deg)}
.stitch-line.b{bottom:60px;transform:rotate(1.4deg)}
.worry-title,.worry-arrow{position:relative;z-index:2}
.worry-title{
  text-align:center;font-size:clamp(22px,3vw,34px);font-weight:900;line-height:1.9;
  color:var(--navy);margin-bottom:56px;letter-spacing:.04em;position:relative;z-index:2;
}
.worry-list{max-width:820px;margin:0 auto;display:grid;gap:18px;position:relative;z-index:2}
.worry{
  background:rgba(255,255,255,.96);padding:22px 28px;display:flex;gap:18px;align-items:center;
  font-size:15px;font-weight:500;position:relative;
  box-shadow:4px 4px 0 rgba(7,22,51,.16);
  border-left:5px solid var(--gold);
  backdrop-filter:blur(2px);
  transition:transform .3s,box-shadow .3s;
}
.worry:nth-child(odd){transform:rotate(-.4deg)}
.worry:nth-child(even){transform:rotate(.4deg)}
.worry:hover{transform:rotate(0) translateY(-4px);box-shadow:6px 8px 0 rgba(7,22,51,.2)}
.worry .chk{
  min-width:28px;height:28px;background:var(--navy);color:var(--gold-l);
  display:grid;place-items:center;font-weight:900;border-radius:4px;
}
.worry-arrow{text-align:center;margin:56px 0 0}
.worry-arrow svg{width:46px;height:46px;animation:bob 1.6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(10px)}}

/* ===== belief ===== */
#belief{
  background:var(--navy);color:var(--cream);position:relative;overflow:hidden;
  text-align:center;padding:140px 6vw;
}
#belief::before{
  content:"";position:absolute;inset:0;opacity:.06;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
#belief .bespoke{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(120px,22vw,320px);line-height:1;white-space:nowrap;
  color:transparent;-webkit-text-stroke:1px rgba(216,178,95,.12);
  pointer-events:none;user-select:none;
}
#belief h3{
  font-family:'Shippori Mincho',serif;font-weight:800;
  font-size:clamp(28px,4.6vw,54px);line-height:1.7;letter-spacing:.06em;margin-bottom:40px;position:relative;
}
#belief h3 .gold{color:var(--gold-l)}
#belief p{max-width:640px;margin:0 auto;font-size:15px;line-height:2.4;color:rgba(244,239,228,.85);position:relative}
#belief p b{color:var(--gold-l);font-weight:700}

/* ===== works ===== */
#works{background:var(--cream)}
.works-sub{font-size:16px;font-weight:700;line-height:2;margin:-40px 0 40px;position:relative;z-index:2}
.works-rail{
  display:flex;gap:24px;overflow-x:auto;padding:14px 4px 28px;
  scroll-snap-type:x mandatory;position:relative;z-index:2;
}
.works-rail::-webkit-scrollbar{height:8px}
.works-rail::-webkit-scrollbar-thumb{background:var(--gold);border-radius:10px}
.works-rail::-webkit-scrollbar-track{background:rgba(7,22,51,.08);border-radius:10px}
.works-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:28px;
  position:relative;z-index:2;
}
.wcard{
  min-width:320px;max-width:320px;scroll-snap-align:start;
  background:#fff;border:1px solid var(--line);position:relative;
  padding:30px 26px;display:flex;flex-direction:column;gap:16px;
  transition:transform .35s,box-shadow .35s;text-decoration:none;color:inherit;
}
.works-grid .wcard{min-width:0;max-width:none}
.wcard:nth-child(odd){transform:rotate(.5deg)}
.wcard:nth-child(even){transform:rotate(-.5deg)}
.wcard:hover{transform:translateY(-10px) rotate(0);box-shadow:0 22px 44px rgba(7,22,51,.16)}
.wcard::before{
  content:"";position:absolute;top:0;left:0;right:0;height:6px;
  background:repeating-linear-gradient(90deg,var(--gold) 0 14px,transparent 14px 24px);
}
.wcard::after{
  content:"";position:absolute;top:-9px;left:50%;transform:translateX(-50%) rotate(45deg);
  width:16px;height:16px;background:var(--gold);border-radius:2px;
  box-shadow:0 2px 5px rgba(7,22,51,.3);
}
.wtags{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.wtag{
  font-size:10px;font-weight:700;letter-spacing:.2em;
  background:var(--navy);color:#fff;padding:6px 12px;
}
.wind{
  font-size:10px;font-weight:700;letter-spacing:.18em;
  color:var(--gold);border:1.5px dashed var(--gold);padding:5px 11px;border-radius:100px;
}
.wcard h4{font-size:16.5px;font-weight:900;line-height:1.9;letter-spacing:.03em;flex:1;margin-top:4px}
.wmeta{display:flex;justify-content:space-between;align-items:baseline;border-top:2px dashed var(--line);padding-top:14px}
.wmeta span{font-size:11px;color:#6b7280;letter-spacing:.1em}
.wmeta b{font-family:'Archivo',sans-serif;font-size:15px;color:var(--gold)}
.works-hint{font-size:11px;letter-spacing:.25em;color:#8a8a7a;margin-top:6px;font-family:'Archivo',sans-serif;position:relative;z-index:2}
.wfilter{
  display:inline-block;margin-bottom:40px;position:relative;z-index:2;
  font-size:12px;font-weight:700;letter-spacing:.2em;
  background:var(--navy);color:#fff;padding:10px 26px;border-radius:100px;
}

/* ===== flow ===== */
.flow-sec{background:var(--paper)}
.flow-wrap{position:relative;max-width:860px;margin:0 auto;z-index:2}
.flow-wrap::before{
  content:"";position:absolute;left:31px;top:10px;bottom:10px;
  border-left:3px dashed var(--gold);opacity:.5;
}
.fstep{display:grid;grid-template-columns:64px 1fr;gap:28px;margin-bottom:44px;position:relative}
.fstep .dot{
  width:64px;height:64px;border-radius:50%;background:var(--navy);color:var(--gold-l);
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-size:24px;
  display:grid;place-items:center;position:relative;z-index:2;
  border:3px solid var(--paper);box-shadow:0 0 0 2px var(--gold);
  transition:transform .3s,background .3s,color .3s;
}
.fstep:hover .dot{transform:scale(1.12) rotate(-6deg);background:var(--gold);color:var(--navy)}
.fstep .card{
  background:#fff;border:1px solid var(--line);padding:26px 30px;
  transition:transform .3s,box-shadow .3s;
}
.fstep:hover .card{transform:translateX(8px);box-shadow:0 10px 26px rgba(7,22,51,.10)}
.fstep h4{font-size:18px;font-weight:900;letter-spacing:.05em;margin-bottom:10px}
.fstep h4 small{font-family:'Archivo',sans-serif;color:var(--gold);font-size:10px;letter-spacing:.3em;margin-left:12px}
.fstep p{font-size:14px;line-height:2;color:#3a4152}
.fstep .btn{margin-top:16px;font-size:12px;padding:12px 26px}

/* ===== price ===== */
#price{background:var(--cream)}
.price-list{max-width:860px;margin:0 auto;position:relative;z-index:2}
.prow{
  display:grid;grid-template-columns:1fr 1.2fr;gap:24px;align-items:center;
  background:#fff;border:1px solid var(--line);padding:28px 34px;margin-bottom:18px;
  position:relative;transition:transform .3s,box-shadow .3s;
}
.prow::before{
  content:"";position:absolute;top:0;left:0;bottom:0;width:6px;
  background:repeating-linear-gradient(180deg,var(--gold) 0 10px,transparent 10px 18px);
}
.prow:hover{transform:translateX(6px);box-shadow:0 10px 26px rgba(7,22,51,.10)}
.prow dt{font-size:16px;font-weight:900;letter-spacing:.05em}
.prow dd{font-size:15px;font-weight:700;color:var(--navy)}
.prow dd em{display:block;font-style:normal;font-size:12px;font-weight:500;color:#6b7280;margin-top:6px}
.prow dd .big{font-family:'Archivo',sans-serif;font-size:22px;color:var(--gold)}
.price-note{max-width:860px;margin:26px auto 0;font-size:12px;color:#6b7280;position:relative;z-index:2}
@media(max-width:640px){.prow{grid-template-columns:1fr;gap:8px}}

/* ===== contact ===== */
.contact-sec{background:var(--navy);color:var(--cream);position:relative;overflow:hidden}
.contact-sec::before{
  content:"";position:absolute;inset:0;opacity:.05;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
.contact-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:70px;position:relative;z-index:2}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}
.contact-msg{font-size:15px;font-weight:700;line-height:2.2;margin-bottom:14px}
.contact-msg-sub{font-size:12px;line-height:2.1;color:rgba(244,239,228,.7);margin-bottom:36px}
.cinfo{display:grid;gap:22px}
.cinfo>div{border-bottom:1px dashed rgba(216,178,95,.4);padding-bottom:16px}
.cinfo dt{
  font-size:13px;font-weight:700;letter-spacing:.2em;color:var(--gold-l);margin-bottom:8px;
  display:flex;align-items:center;gap:10px;
}
.cinfo dt::before{content:"";width:22px;border-top:2px dashed var(--gold-l)}
.cinfo dd b{font-family:'Archivo',sans-serif;font-size:17px;letter-spacing:.04em}
.cinfo dd{font-size:14px;line-height:1.9}
.cinfo dd small{display:block;font-size:11px;color:rgba(244,239,228,.65);margin-top:4px}
.cform{display:grid;gap:18px}
.cform label{font-size:12px;font-weight:700;letter-spacing:.15em;color:var(--gold-l)}
.cform label i{font-style:normal;color:#e58c8c;margin-left:4px}
.cform input,.cform textarea,.cform select{
  width:100%;background:rgba(244,239,228,.07);border:1px solid rgba(244,239,228,.25);
  padding:15px 16px;color:var(--cream);font-family:inherit;font-size:14px;border-radius:2px;margin-top:8px;
}
.cform input:focus,.cform textarea:focus,.cform select:focus{outline:none;border-color:var(--gold-l);background:rgba(244,239,228,.12)}
.cform select{appearance:none}
.cform select option{color:var(--ink)}
.cform textarea{min-height:150px;resize:vertical}
.cform .guide{font-size:12px;line-height:2;color:rgba(244,239,228,.75);margin-top:10px}
.cform .agree{display:flex;align-items:center;gap:10px;font-size:13px}
.cform .agree input{width:auto;margin:0}
.cform .agree a{color:var(--gold-l)}
.cform button{margin-top:6px;width:100%;justify-content:center}

/* ===== about page ===== */
.vm-block{max-width:760px;margin:0 auto 90px;text-align:center;position:relative;z-index:2}
.vm-block .en{
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(34px,4.6vw,56px);color:var(--gold);
}
.vm-block h3{
  font-family:'Shippori Mincho',serif;font-weight:800;
  font-size:clamp(24px,3.4vw,40px);letter-spacing:.06em;margin:26px 0 30px;line-height:1.7;
}
.vm-block p{font-size:15px;line-height:2.5;color:#2c3446}
.vm-block .stitch-sep{width:120px;margin:0 auto 26px;border:none;border-top:3px dashed var(--gold);opacity:.6}
#story{background:var(--navy);color:var(--cream);overflow:hidden}
#story .vm-block p{color:rgba(244,239,228,.85)}
#story .vm-block h3{color:var(--cream)}
.about-table{max-width:820px;margin:0 auto;position:relative;z-index:2}
.about-table>div{
  display:grid;grid-template-columns:200px 1fr;gap:24px;
  padding:26px 10px;border-bottom:2px dashed var(--line);
}
.about-table dt{font-size:14px;font-weight:900;letter-spacing:.1em;color:var(--gold)}
.about-table dd{font-size:14px;line-height:2}
@media(max-width:640px){.about-table>div{grid-template-columns:1fr;gap:6px}}

/* ===== service page detail ===== */
.sdetail{
  position:relative;z-index:2;
  display:grid;grid-template-columns:120px 1fr;gap:40px;
  padding:64px 0;border-top:2px dashed var(--line);
}
.sdetail:last-of-type{border-bottom:2px dashed var(--line)}
.sdetail .svc-num{-webkit-text-stroke:1.5px var(--gold)}
.sdetail h3{font-size:clamp(22px,2.6vw,32px);font-weight:900;letter-spacing:.04em;margin-bottom:24px}
.sdetail p{font-size:14.5px;line-height:2.3;color:#2c3446;max-width:760px}
.sdetail .works-link{
  display:inline-flex;align-items:center;gap:12px;margin-top:28px;text-decoration:none;
  font-size:13px;font-weight:700;letter-spacing:.15em;color:var(--navy);
  border-bottom:2px dashed var(--gold);padding-bottom:6px;transition:gap .3s,color .3s;
}
.sdetail .works-link:hover{gap:20px;color:var(--gold)}
@media(max-width:700px){.sdetail{grid-template-columns:1fr;gap:12px}}

/* ===== recruit ===== */
.recruit-empty{
  max-width:640px;margin:0 auto;text-align:center;position:relative;z-index:2;
  border:2px dashed var(--gold);padding:70px 40px;background:#fff;
}
.recruit-empty h3{font-size:20px;font-weight:900;letter-spacing:.1em;margin-bottom:18px;color:var(--navy)}
.recruit-empty p{font-size:14px;line-height:2.2;color:#3a4152}

/* ===== company (top page bottom About) ===== */
#company{background:var(--cream)}
.company-grid{
  display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:start;
  position:relative;z-index:2;
}
@media(max-width:900px){.company-grid{grid-template-columns:1fr}}
#company .about-table{max-width:none;margin:0}
.company-map{
  position:relative;border:1px solid var(--line);background:#fff;
  padding:10px;box-shadow:6px 6px 0 rgba(7,22,51,.12);
}
.company-map::before{
  content:"";position:absolute;top:-9px;left:50%;transform:translateX(-50%) rotate(45deg);
  width:16px;height:16px;background:var(--gold);border-radius:2px;z-index:2;
  box-shadow:0 2px 5px rgba(7,22,51,.3);
}
.company-map iframe{width:100%;height:440px;border:0;display:block}

/* ===================================================== */
/* ===== VENTURE UPGRADE: motion & energy (all pages) === */
/* ===================================================== */

/* scroll progress bar */
#sprog{
  position:fixed;top:0;left:0;height:3px;width:0;z-index:1002;
  background:linear-gradient(90deg,var(--gold),var(--gold-l),#fff);
  box-shadow:0 0 14px rgba(216,178,95,.9);
  transition:width .1s linear;
}

/* floating particles */
.pfield{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.pfield i{
  position:absolute;bottom:-5%;display:block;border-radius:50%;
  background:var(--gold-l);opacity:0;
  animation:pfloat linear infinite;
  box-shadow:0 0 10px rgba(216,178,95,.7);
}
@keyframes pfloat{
  0%{transform:translateY(0) scale(.6);opacity:0}
  15%{opacity:.55}
  85%{opacity:.25}
  100%{transform:translateY(-95vh) scale(1.2);opacity:0}
}
.hero,.page-head,#belief,#story-top{isolation:isolate}
.hero>.hero-grid,.hero>.hero-video,.page-head>h1,.page-head>.jp,.page-head>.crumbs{position:relative;z-index:2}

/* shimmering gradient headlines */
.sec-head h2{
  color:transparent;
  background-image:linear-gradient(115deg,var(--navy) 35%,var(--gold) 50%,var(--navy) 65%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;
  animation:sheen 5.5s ease-in-out infinite;
}
.sec-head.light h2{
  background-image:linear-gradient(115deg,var(--cream) 35%,var(--gold-l) 50%,var(--cream) 65%);
}
.page-head h1{
  color:transparent;
  background-image:linear-gradient(115deg,var(--cream) 35%,var(--gold-l) 50%,var(--cream) 65%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;
  animation:h1wipe 1s cubic-bezier(.19,1,.22,1) both, sheen 5.5s ease-in-out 1s infinite;
}
@keyframes h1wipe{
  from{clip-path:inset(0 100% 0 0);transform:translateY(26px);opacity:0}
  to{clip-path:inset(0 0 0 0);transform:none;opacity:1}
}
@keyframes sheen{0%,100%{background-position:0% 0}50%{background-position:100% 0}}

/* button shine sweep */
.btn{position:relative;overflow:hidden}
.btn::before{
  content:"";position:absolute;top:0;bottom:0;left:-90%;width:45%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);animation:shine 3.4s ease-in-out infinite;
}
@keyframes shine{0%,55%{left:-90%}100%{left:140%}}

/* richer reveal */
.rv{opacity:0;transform:translateY(44px) scale(.985);filter:blur(5px);
  transition:opacity .9s ease,transform .95s cubic-bezier(.19,1,.22,1),filter .9s ease}
.rv.on{opacity:1;transform:none;filter:none}

/* flow dot radar pulse */
.fstep .dot::after{
  content:"";position:absolute;inset:-4px;border-radius:50%;
  border:2px solid var(--gold);opacity:0;
  animation:radar 2.6s ease-out infinite;
}
.fstep:nth-child(2) .dot::after{animation-delay:.4s}
.fstep:nth-child(3) .dot::after{animation-delay:.8s}
.fstep:nth-child(4) .dot::after{animation-delay:1.2s}
.fstep:nth-child(5) .dot::after{animation-delay:1.6s}
.fstep:nth-child(6) .dot::after{animation-delay:2s}
@keyframes radar{0%{transform:scale(.85);opacity:.75}70%{transform:scale(1.5);opacity:0}100%{opacity:0}}

/* worry check pop */
.worry .chk{animation:chkpop 3.2s ease-in-out infinite}
.worry:nth-child(even) .chk{animation-delay:1.6s}
@keyframes chkpop{0%,88%,100%{transform:scale(1)}92%{transform:scale(1.25) rotate(-6deg)}96%{transform:scale(1)}}

/* menu overlay staggered links */
.menu-ov a{opacity:0;transform:translateX(36px)}
.menu-ov.open a{opacity:1;transform:translateX(0);transition:opacity .5s ease,transform .5s cubic-bezier(.19,1,.22,1),padding-left .3s}
.menu-ov.open a:nth-of-type(1){transition-delay:.10s}
.menu-ov.open a:nth-of-type(2){transition-delay:.16s}
.menu-ov.open a:nth-of-type(3){transition-delay:.22s}
.menu-ov.open a:nth-of-type(4){transition-delay:.28s}
.menu-ov.open a:nth-of-type(5){transition-delay:.34s}
.menu-ov.open a:nth-of-type(6){transition-delay:.40s}

/* logo marquee pause on hover + lift */
.cl-marquee:hover .cl-inner{animation-play-state:paused}
.cl-inner img{transition:transform .3s}
.cl-inner img:hover{transform:translateY(-6px) scale(1.06)}

/* service number glow */
.svc-num{animation:numglow 4s ease-in-out infinite}
@keyframes numglow{0%,100%{filter:drop-shadow(0 0 0 rgba(216,178,95,0))}50%{filter:drop-shadow(0 0 14px rgba(216,178,95,.55))}}

/* tilt targets */
.wcard,.prow,.svc-visual,.story-img{will-change:transform}

/* respect reduced motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none;filter:none}
}

/* ===== MPA View Transitions (page-to-page morph) ===== */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .45s cubic-bezier(.7,0,.3,1) both}
::view-transition-new(root){animation:vt-in .55s .1s cubic-bezier(.19,1,.22,1) both}
@keyframes vt-out{to{opacity:0;transform:translateY(-30px) scale(.99);filter:blur(6px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(36px) scale(.995);filter:blur(8px)}}

/* ===== CSS scroll-driven animations (Chrome 115+) ===== */
@supports (animation-timeline: view()){
  .watermark,.page-head .wm{
    animation:wmdrift linear both;animation-timeline:view();
  }
  @keyframes wmdrift{from{transform:translateY(90px)}to{transform:translateY(-90px)}}
  .story-logo .big{animation-name:logofloat}
}

/* ===== service visual: HUD + kenburns + scanline + glitch ===== */
.svc-visual img{
  animation:kenburns 9s ease-in-out infinite alternate;
  animation-delay:-4.5s; /* start mid-motion: already moving on first paint */
}
/* stagger the 4 service visuals so each drifts differently */
.svc:nth-of-type(1) .svc-visual img{animation-delay:-1.5s}
.svc:nth-of-type(2) .svc-visual img{animation-delay:-3.5s;animation-direction:alternate-reverse}
.svc:nth-of-type(3) .svc-visual img{animation-delay:-5.5s}
.svc:nth-of-type(4) .svc-visual img{animation-delay:-7.5s;animation-direction:alternate-reverse}
@keyframes kenburns{
  from{transform:scale(1.02) translate(1%,-1%)}
  to{transform:scale(1.18) translate(-2.5%,2.5%)}
}
.svc-visual .hud{position:absolute;inset:12px;z-index:3;pointer-events:none;
  background:
    linear-gradient(var(--gold-l),var(--gold-l)) top left/26px 2px,
    linear-gradient(var(--gold-l),var(--gold-l)) top left/2px 26px,
    linear-gradient(var(--gold-l),var(--gold-l)) top right/26px 2px,
    linear-gradient(var(--gold-l),var(--gold-l)) top right/2px 26px,
    linear-gradient(var(--gold-l),var(--gold-l)) bottom left/26px 2px,
    linear-gradient(var(--gold-l),var(--gold-l)) bottom left/2px 26px,
    linear-gradient(var(--gold-l),var(--gold-l)) bottom right/26px 2px,
    linear-gradient(var(--gold-l),var(--gold-l)) bottom right/2px 26px;
  background-repeat:no-repeat;
  filter:drop-shadow(0 0 6px rgba(216,178,95,.8));
  animation:hudblink 4s ease-in-out infinite;
}
@keyframes hudblink{0%,92%,100%{opacity:1}95%{opacity:.35}}
.svc-visual .hud::before{
  content:"";position:absolute;left:0;right:0;top:-20%;height:34%;
  background:linear-gradient(180deg,transparent,rgba(216,178,95,.16) 45%,rgba(255,255,255,.22) 50%,rgba(216,178,95,.16) 55%,transparent);
  animation:scan 4.5s linear infinite;
}
@keyframes scan{to{transform:translateY(420%)}}
.svc-visual .hud::after{
  content:"REC ● LIVE FEED";position:absolute;top:8px;left:10px;
  font-family:'Archivo',sans-serif;font-size:9px;font-weight:600;letter-spacing:.3em;
  color:var(--gold-l);opacity:.85;animation:hudblink 2.2s ease-in-out infinite;
}
.svc-visual:hover img{animation:glitch .5s steps(2) infinite}
@keyframes glitch{
  0%{transform:scale(1.06) translate(0,0);clip-path:inset(0 0 0 0);filter:none}
  25%{transform:scale(1.06) translate(-6px,2px);clip-path:inset(12% 0 58% 0);filter:hue-rotate(25deg) saturate(1.6)}
  50%{transform:scale(1.06) translate(5px,-3px);clip-path:inset(55% 0 8% 0);filter:hue-rotate(-25deg)}
  75%{transform:scale(1.06) translate(-3px,1px);clip-path:inset(30% 0 34% 0);filter:contrast(1.4)}
  100%{transform:scale(1.06) translate(0,0);clip-path:inset(0 0 0 0);filter:none}
}

/* ===== recruit page ===== */
.msg-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;position:relative;z-index:2}
@media(max-width:860px){.msg-grid{grid-template-columns:1fr}}
.msg-grid h3{
  font-family:'Shippori Mincho',serif;font-weight:800;
  font-size:clamp(24px,3.2vw,38px);line-height:1.7;letter-spacing:.04em;margin-bottom:26px;color:var(--navy);
}
.msg-grid p{font-size:15px;line-height:2.3;color:#2c3446}
.msg-img{position:relative;overflow:hidden;border:1px solid var(--line);box-shadow:8px 8px 0 rgba(7,22,51,.12)}
.msg-img img{width:100%;height:340px;object-fit:cover;display:block;animation:kenburns 18s ease-in-out infinite alternate}
.jd-table{max-width:980px;margin:0 auto;position:relative;z-index:2;border:1px solid rgba(7,22,51,.25)}
.jd-table>div{display:grid;grid-template-columns:180px 1fr;border-bottom:1px solid rgba(7,22,51,.25)}
.jd-table>div:last-child{border-bottom:none}
.jd-table dt{
  background:var(--gold);color:#fff;font-size:14px;font-weight:700;letter-spacing:.08em;
  padding:24px 20px;display:flex;align-items:center;
  border-right:1px solid rgba(7,22,51,.25);
}
.jd-table>div:nth-child(even) dt{background:#8a6620}
.jd-table dd{background:#fff;padding:24px 26px;font-size:14px;line-height:2.05;color:#1d2434}
@media(max-width:640px){.jd-table>div{grid-template-columns:1fr}.jd-table dt{border-right:none}}

/* ===== policy pages ===== */
.policy{max-width:840px;margin:0 auto;position:relative;z-index:2}
.policy .lead{font-size:14.5px;line-height:2.3;color:#2c3446;margin-bottom:46px}
.policy h3{
  font-size:17px;font-weight:900;letter-spacing:.06em;color:var(--navy);
  margin:40px 0 16px;padding-left:16px;border-left:4px solid var(--gold);
}
.policy p,.policy li{font-size:14px;line-height:2.15;color:#2c3446}
.policy ul{margin:10px 0 10px 22px}
.policy .sign{text-align:right;margin-top:40px;font-weight:700}

footer{
  background:var(--ink);color:rgba(244,239,228,.65);
  padding:34px 6vw;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
  font-size:12px;letter-spacing:.1em;
}
footer .flinks{display:flex;gap:8px;align-items:center;font-family:'Archivo',sans-serif;letter-spacing:.18em}
footer a{color:rgba(244,239,228,.65);text-decoration:none;transition:color .3s}
footer a:hover{color:var(--gold-l)}
footer .copy b{font-family:'Archivo',sans-serif;color:var(--cream)}
.totop{
  position:fixed;right:24px;bottom:24px;z-index:90;
  width:48px;height:48px;border-radius:50%;border:2px dashed var(--gold);
  background:var(--paper);color:var(--gold);font-size:18px;cursor:pointer;
  transition:background .3s,color .3s,opacity .3s;opacity:0;pointer-events:none;
}
.totop.show{opacity:1;pointer-events:auto}
.totop:hover{background:var(--gold);color:#fff}

/* ===================================================== */
/* ===== TriOrb-inspired upgrades ====================== */
/* ===================================================== */

/* --- intro loader (home, once per session) --- */
#intro{
  position:fixed;inset:0;z-index:2000;background:var(--navy);
  display:grid;place-items:center;
  transition:transform .8s cubic-bezier(.7,0,.3,1);
}
#intro.done{transform:translateY(-100%)}
#intro .in-logo{
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(34px,6vw,64px);color:var(--cream);letter-spacing:.04em;
  display:flex;gap:.06em;
}
#intro .in-logo i{
  font-style:italic;opacity:0;transform:translateY(24px);
  animation:inchar .5s cubic-bezier(.19,1,.22,1) forwards;
}
#intro .in-logo i.gold{color:var(--gold-l)}
@keyframes inchar{to{opacity:1;transform:none}}
#intro .in-line{
  position:absolute;left:50%;bottom:34%;transform:translateX(-50%);
  width:min(320px,60vw);border-top:2px dashed var(--gold);opacity:.8;
  clip-path:inset(0 100% 0 0);animation:inline .9s .7s ease forwards;
}
@keyframes inline{to{clip-path:inset(0 0 0 0)}}

/* --- blur → focus reveal (TriOrb signature) --- */
.hero-video video{animation:focusin 1.6s cubic-bezier(.19,1,.22,1) .15s both}
.page-head h1, .page-head .jp, .page-head .crumbs{will-change:filter}
.page-head{animation:none}
.focusin{animation:focusin 1.2s cubic-bezier(.19,1,.22,1) both}
@keyframes focusin{
  from{filter:blur(16px);opacity:.2;transform:scale(1.04)}
  to{filter:blur(0);opacity:1;transform:none}
}
.svc-visual img,.msg-img img{animation-name:kenburns} /* keep kenburns */

/* --- new footer --- */
.site-footer{
  position:relative;overflow:hidden;background:var(--navy);color:var(--cream);
  border-top:2px dashed rgba(216,178,95,.5);
}
.site-footer::before{
  content:"";position:absolute;inset:0;opacity:.05;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:80px 80px;
}
.f-inner{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.3fr 1.4fr .9fr;gap:56px;
  padding:80px 6vw 40px;
}
@media(max-width:900px){.f-inner{grid-template-columns:1fr;gap:40px}}
.f-brand .logo b{color:var(--cream)}
.f-brand .logo img{filter:brightness(0) invert(1) sepia(.2)}
.f-tag{margin:18px 0 14px;font-size:14px;font-weight:700;color:var(--gold-l);letter-spacing:.08em}
.f-addr{font-size:12.5px;line-height:2.1;color:rgba(244,239,228,.7)}
.f-nav{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.f-col h5{
  font-family:'Archivo',sans-serif;font-size:11px;font-weight:600;letter-spacing:.35em;
  color:var(--gold-l);margin-bottom:18px;display:flex;align-items:center;gap:10px;
}
.f-col h5::before{content:"";width:22px;border-top:2px dashed var(--gold-l)}
.f-col a{
  display:block;color:var(--cream);text-decoration:none;
  font-family:'Archivo',sans-serif;font-weight:700;font-size:15px;letter-spacing:.05em;
  padding:8px 0;border-bottom:1px dashed rgba(216,178,95,.25);
  transition:padding-left .3s,color .3s;
}
.f-col a span{margin-left:10px;font-family:'Zen Kaku Gothic New';font-size:10.5px;font-weight:500;color:rgba(244,239,228,.55);letter-spacing:.14em}
.f-col a:hover{padding-left:10px;color:var(--gold-l)}
.f-cta p{font-size:14px;font-weight:700;line-height:2;margin-bottom:18px}
.f-word{
  position:relative;z-index:1;text-align:center;user-select:none;pointer-events:none;
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;white-space:nowrap;
  font-size:clamp(60px,11.5vw,170px);line-height:.9;margin-top:10px;
  color:transparent;-webkit-text-stroke:1px rgba(216,178,95,.22);
}
@supports (animation-timeline: view()){
  .f-word{animation:fword linear both;animation-timeline:view()}
  @keyframes fword{from{transform:translateX(6%)}to{transform:translateX(-6%)}}
}
.f-btm{
  position:relative;z-index:2;
  display:flex;justify-content:space-between;gap:12px;
  padding:22px 6vw;border-top:1px solid rgba(244,239,228,.12);
  font-family:'Archivo',sans-serif;font-size:11px;letter-spacing:.25em;color:rgba(244,239,228,.6);
}

/* --- story logo extra motion --- */
.story-logo .scissors{animation:scmove 7s ease-in-out infinite}
@keyframes scmove{0%,100%{transform:translateX(-4%)}50%{transform:translateX(4%)}}
.story-logo .big{
  background-image:linear-gradient(115deg,rgba(216,178,95,.0) 40%,rgba(216,178,95,.5) 50%,rgba(216,178,95,0) 60%);
  background-size:250% 100%;-webkit-background-clip:text;background-clip:text;
  animation:logofloat 5s ease-in-out infinite, sheen 4.5s linear infinite;
}


/* ===== readability bump (PC) ===== */
.hero-sub{font-size:17px}
.svc-body p{font-size:15.5px}
.story-text{font-size:16px}
.worry{font-size:16.5px}
#belief p{font-size:16.5px}
.works-sub{font-size:17px}
.wcard h4{font-size:17px}
.fstep p{font-size:15.5px}
.cinfo dd{font-size:15px}
.cform label{font-size:13px}
.cform input,.cform textarea,.cform select{font-size:15px}
.contact-msg{font-size:16.5px}
.contact-msg-sub{font-size:13.5px}
.msg-grid p{font-size:16.5px}
.jd-table dd{font-size:15.5px}
.policy p,.policy li{font-size:15px}
.policy .lead{font-size:15.5px}
.about-table dd{font-size:15px}
.sdetail p{font-size:15.5px}
.vm-block p{font-size:16.5px}
.f-addr{font-size:13.5px}
.f-cta p{white-space:nowrap;font-size:14.5px}

/* ===== futuristic layer ===== */
:root{--cyan:#7de3ff}

/* intro percentage counter */
#intro .in-pct{
  position:absolute;right:6vw;bottom:7vh;
  font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;
  font-size:clamp(46px,9vw,110px);line-height:1;
  color:transparent;-webkit-text-stroke:1.5px rgba(216,178,95,.75);
  font-variant-numeric:tabular-nums;
}
#intro .in-pct small{font-size:.4em;-webkit-text-stroke:1px rgba(216,178,95,.75)}

/* header scanning line */
header::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;opacity:0;
  background:linear-gradient(90deg,transparent,var(--gold),var(--cyan),transparent);
  background-size:50% 100%;background-repeat:no-repeat;
  animation:hdline 3.2s linear infinite;transition:opacity .3s;
}
header.scrolled::after{opacity:1}
@keyframes hdline{from{background-position:-60% 0}to{background-position:160% 0}}

/* holographic horizon grid over hero video */
.hero-video::before{
  content:"";position:absolute;left:0;right:0;bottom:0;height:48%;z-index:2;pointer-events:none;
  background:
    repeating-linear-gradient(90deg,rgba(125,227,255,.16) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,rgba(125,227,255,.16) 0 1px,transparent 1px 36px);
  transform:perspective(430px) rotateX(58deg) scale(1.45);transform-origin:bottom;
  mix-blend-mode:screen;
  animation:gridflow 2.6s linear infinite;
  -webkit-mask-image:linear-gradient(transparent,#000 45%);mask-image:linear-gradient(transparent,#000 45%);
}
@keyframes gridflow{to{background-position:0 0,0 36px}}

/* cyan particles mix */
.pfield i:nth-child(3n){background:var(--cyan);box-shadow:0 0 10px rgba(125,227,255,.8)}

/* neon button hover */
.btn:hover{box-shadow:0 0 22px rgba(216,178,95,.55),0 0 40px rgba(125,227,255,.18)}


/* cursor cyan aura */
.cursor{box-shadow:0 0 14px rgba(125,227,255,.35)}


/* ===================================================== */
/* ===== LIGHT FLOW LAYER（光の流れ） ==================== */
/* ===================================================== */

/* --- aurora ribbons (drifting light) --- */
.aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.aurora i{
  position:absolute;display:block;border-radius:50%;
  filter:blur(60px);opacity:.5;mix-blend-mode:screen;
  animation:auradrift ease-in-out infinite alternate;
}
.aurora i:nth-child(1){
  width:46vw;height:26vw;left:-12%;top:-18%;
  background:radial-gradient(closest-side,rgba(216,178,95,.55),transparent 70%);
  animation-duration:11s;
}
.aurora i:nth-child(2){
  width:38vw;height:22vw;right:-10%;bottom:-16%;
  background:radial-gradient(closest-side,rgba(125,227,255,.4),transparent 70%);
  animation-duration:14s;animation-delay:-5s;
}
.aurora i:nth-child(3){
  width:26vw;height:18vw;left:38%;top:34%;
  background:radial-gradient(closest-side,rgba(216,178,95,.30),transparent 70%);
  animation-duration:17s;animation-delay:-9s;
}
@keyframes auradrift{
  from{transform:translate(-6%,4%) rotate(-6deg) scale(1)}
  to{transform:translate(7%,-5%) rotate(8deg) scale(1.18)}
}

/* --- shooting light streaks（流れ星コメット） --- */
.comet{
  position:absolute;top:0;left:0;width:190px;height:2px;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(216,178,95,.95),#fff);
  border-radius:2px;filter:drop-shadow(0 0 8px rgba(216,178,95,.9));
  opacity:0;transform-origin:right center;
  animation:cometfly var(--cd,2.6s) linear var(--cdel,0s) infinite;
  rotate:var(--crot,18deg);
}
.comet.cyan{background:linear-gradient(90deg,transparent,rgba(125,227,255,.9),#fff);filter:drop-shadow(0 0 8px rgba(125,227,255,.9))}
@keyframes cometfly{
  0%{opacity:0;translate:var(--cx0,-10%) var(--cy0,10%)}
  6%{opacity:1}
  22%{opacity:1}
  32%{opacity:0;translate:var(--cx1,60vw) var(--cy1,30vh)}
  100%{opacity:0;translate:var(--cx1,60vw) var(--cy1,30vh)}
}

/* --- light runner on stitches（縫い目を走る光） --- */
.stitch-line{overflow:visible}
.stitch-line::before{
  content:"";position:absolute;top:-3px;left:0;width:90px;height:4px;border-radius:4px;
  background:linear-gradient(90deg,transparent,var(--gold-l),#fff,transparent);
  filter:drop-shadow(0 0 8px rgba(216,178,95,.95));
  animation:runner 4.2s cubic-bezier(.4,0,.6,1) infinite;
}
.stitch-line.b::before{animation-delay:2.1s}
@keyframes runner{
  0%{left:-8%;opacity:0}
  8%{opacity:1}
  92%{opacity:1}
  100%{left:104%;opacity:0}
}

/* hero headline underline: light pulse along the seam */
.hero h1 .gold svg path{
  filter:drop-shadow(0 0 0 rgba(216,178,95,0));
  animation:sew 2.4s .7s ease forwards, seamglow 3.6s 3.2s ease-in-out infinite;
}
@keyframes seamglow{
  0%,100%{filter:drop-shadow(0 0 0 rgba(216,178,95,0))}
  50%{filter:drop-shadow(0 0 10px rgba(216,178,95,.9))}
}

/* --- border beam（カードの縁を周回する光） --- */
@property --ba{syntax:"<angle>";inherits:false;initial-value:0deg}
.wcard,.story-badge{position:relative}
.wcard{--bw:2px}
.wcard:hover{box-shadow:0 22px 44px rgba(7,22,51,.16),0 0 24px rgba(216,178,95,.25)}
.beam{
  position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  padding:2px;
  background:conic-gradient(from var(--ba),transparent 0 84%,rgba(125,227,255,.9) 90%,#fff 94%,rgba(216,178,95,.95) 97%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .3s;
  animation:beamspin 3.2s linear infinite;
}
.wcard:hover .beam{opacity:1}
@keyframes beamspin{to{--ba:360deg}}

/* --- section top light sweep --- */
#service,.contact-sec,#belief,#story-top{position:relative}
#service::after,#story-top::after{
  content:"";position:absolute;top:0;left:0;right:0;height:1.5px;z-index:3;
  background:linear-gradient(90deg,transparent,var(--gold-l),var(--cyan),transparent);
  background-size:42% 100%;background-repeat:no-repeat;
  animation:hdline 4.8s linear infinite;opacity:.85;
}

/* ===================================================== */
/* ===== MOBILE RESPONSIVE (iPhone基準 ~430px) ========== */
/* ===================================================== */

@media (max-width: 640px) {

  /* --- header --- */
  header{height:60px;padding-left:18px}
  .logo b{font-size:20px}
  .hd-btns a,.hd-btns button{width:56px;height:56px;font-size:22px}
  .menu-close{width:56px;height:56px;font-size:18px}
  .menu-ov{padding:0 8vw}
  .menu-ov a b{font-size:clamp(24px,3.6vh,34px)}

  /* --- hero --- */
  .hero{padding:96px 5.5vw 36px}
  .hero h1{font-size:clamp(30px,8.6vw,38px);line-height:1.45}
  .hero-sub{font-size:15px;line-height:2.05;margin-top:8px}
  .hero-cta{justify-content:center;margin-top:24px}
  .hero-video{margin-top:36px}
  .hero-video video{max-height:46vh}
  .scroll-hint{display:none}

  /* --- sections common --- */
  section{padding:64px 5.5vw}
  .sec-head{gap:12px;margin-bottom:36px}
  .sec-head h2{font-size:clamp(34px,10vw,44px)}
  .sec-head .jp{font-size:11.5px;letter-spacing:.18em}
  .watermark{font-size:clamp(56px,18vw,90px);top:20px}

  /* --- page head (下層) --- */
  .page-head{padding:110px 5.5vw 54px}
  .page-head h1{font-size:clamp(40px,11vw,56px)}
  .page-head .jp{font-size:11.5px}
  .page-head .wm{font-size:clamp(70px,22vw,120px)}

  /* --- service --- */
  .svc{padding:36px 0}
  .svc-num{font-size:34px}
  .svc-body h3{font-size:20px}
  .svc-body p{font-size:14.5px;line-height:2}
  .svc-visual{height:200px}
  .sdetail{padding:40px 0}
  .sdetail h3{font-size:21px}
  .sdetail p{font-size:14.5px}

  /* --- clients marquee --- */
  .clients{padding:48px 0}
  .clients h3{font-size:14.5px;padding:0 6vw;line-height:1.9}
  .cl-inner img{height:52px;max-width:112px;margin:0 14px;padding:5px 9px}

  /* --- story --- */
  #story-top{padding-bottom:56px}
  .story-badge{font-size:19px;padding:11px 18px}
  .story-text{font-size:14.5px;line-height:2.05}
  .story-cta{justify-content:center;margin-top:26px}
  .story-logo{min-height:230px;margin-top:36px}
  .story-logo .big{font-size:clamp(42px,13vw,56px)}

  /* --- worries --- */
  .worry-title{font-size:clamp(19px,5.4vw,24px);margin-bottom:32px}
  .worry{font-size:14px;padding:15px 16px;gap:12px}
  .worry .chk{min-width:24px;height:24px;font-size:12px}
  .worry-wm{font-size:clamp(52px,17vw,80px)}

  /* --- belief --- */
  #belief{padding:80px 6vw}
  #belief h3{font-size:clamp(21px,6vw,28px);line-height:1.8;margin-bottom:24px}
  #belief p{font-size:14.5px;line-height:2.1}
  #belief .bespoke{font-size:clamp(80px,26vw,120px)}

  /* --- works --- */
  .works-sub{font-size:14.5px;margin:-20px 0 24px}
  .wcard{min-width:272px;max-width:272px;padding:22px 20px}
  .wcard h4{font-size:14.5px;line-height:1.8}
  .works-grid{grid-template-columns:1fr;gap:18px}
  .works-grid .wcard{max-width:none}
  .rail-nav button{width:40px;height:40px;font-size:15px}
  .wfilter{font-size:11px;padding:8px 20px;margin-bottom:26px}
  .mini-rail .wcard{min-width:230px;max-width:230px}

  /* --- flow --- */
  .flow-wrap::before{left:22px}
  .fstep{grid-template-columns:46px 1fr;gap:16px;margin-bottom:28px}
  .fstep .dot{width:46px;height:46px;font-size:17px}
  .fstep .card{padding:18px 18px}
  .fstep h4{font-size:16px}
  .fstep h4 small{display:block;margin:4px 0 0}
  .fstep p{font-size:13.5px;line-height:1.95}

  /* --- recruit --- */
  .msg-grid h3{font-size:clamp(21px,6vw,26px)}
  .msg-grid p{font-size:14.5px}
  .msg-img img{height:220px}
  .jd-table dt{padding:14px 14px;font-size:13px}
  .jd-table dd{padding:14px 16px;font-size:13.5px;line-height:1.95}

  /* --- forms（16px以上でiOSの自動ズームを防止） --- */
  .cform input,.cform textarea,.cform select{font-size:16px;padding:13px 14px}
  .cform .guide{font-size:11.5px}
  .contact-msg{font-size:15.5px}
  .cinfo dd{font-size:14px}
  .cinfo dd b{font-size:15px}

  /* --- company / tables --- */
  .company-map iframe{height:280px}
  .about-table dd{font-size:14px}
  .about-table dt{font-size:13px}

  /* --- policy --- */
  .policy p,.policy li{font-size:14px}
  .policy .lead{font-size:14.5px}
  .policy h3{font-size:15.5px}

  /* --- footer --- */
  .f-inner{padding:52px 6vw 28px;gap:32px}
  .f-nav{grid-template-columns:1fr 1fr;gap:20px}
  .f-col a{font-size:14px}
  .f-cta p{white-space:normal;font-size:13.5px}
  .f-word{font-size:clamp(44px,13vw,64px)}
  .f-btm{flex-direction:column;align-items:center;gap:6px;padding:16px 6vw;font-size:10px}
  .f-tag{font-size:12.5px}
  .f-addr{font-size:12px}

  /* --- floating CTA / totop --- */
  .totop{right:14px;bottom:14px;width:42px;height:42px;font-size:15px}

  /* --- intro --- */
  #intro .in-pct{right:7vw;bottom:9vh;font-size:clamp(38px,13vw,54px)}

  /* --- perf: 重い演出を軽量化 --- */
  .aurora i{filter:blur(38px)}
  .netcv{display:none}          /* Canvas網は非表示（負荷軽減） */
  .comet{display:none}          /* コメットはPCのみ */
  body::after{opacity:.035}     /* グレイン弱め */
}


/* ===== モバイル：原文の改行(1行1行)を活かす調整 ===== */
@media (max-width: 640px) {
  /* 改行(<br>)はPCと同じ位置で全て有効。行が画面幅を超える場合のみ
     日本語の文節単位で自然に折り返す（Chrome/Edge対応、他は通常折返し） */
  .bdx{
    word-break: keep-all;
    overflow-wrap: anywhere;
    line-break: strict;
  }
  /* 1行が収まりやすいよう本文をわずかに縮小 */
  .hero-sub{font-size:13.8px;letter-spacing:0}
  .svc-body p{font-size:13.5px}
  .sdetail p{font-size:13.5px}
  #belief p{font-size:13.8px}
  .story-text{font-size:13.8px}
  .works-sub{font-size:13.8px}
  .fstep p{font-size:13px}
  .msg-grid p{font-size:13.8px}
  .jd-table dd{font-size:13px}
  .policy p,.policy li{font-size:13.5px}
  /* 長文入力ガイドはさらに小さく */
  .cform .guide{font-size:11px;line-height:1.9}
}


/* ===================================================== */
/* ===== モバイル：はみ出し完全対策（余裕をもった調整） ===== */
/* ===================================================== */
@media (max-width: 640px) {

  /* --- 安全ネット：どの要素も画面幅を超えない --- */
  img, video, svg, iframe{max-width:100%}
  h1,h2,h3,h4,h5,p,dd,dt,li,span,a,b{overflow-wrap:anywhere}
  section, .page-head, .hero, .site-footer{overflow-x:clip}

  /* --- ヒーロー見出し：改行禁止を解除して少し小さく --- */
  .hero h1{font-size:clamp(24px,6.9vw,30px);line-height:1.55;letter-spacing:.02em}
  .hero h1 .gold{white-space:normal}
  .hero-sub{font-size:13px;line-height:2}
  .hero-sub b{letter-spacing:0}

  /* --- 本文をさらに一回り調整（余白重視） --- */
  section{padding:56px 6.5vw}
  .page-head{padding:104px 6.5vw 48px}
  .svc-body p,.sdetail p{font-size:13px;line-height:2}
  .story-text,#belief p,.msg-grid p{font-size:13px;line-height:2.05}
  .works-sub{font-size:13px}
  .worry{font-size:13px;padding:14px 14px}
  .fstep p{font-size:12.5px}
  .jd-table dd{font-size:12.5px;line-height:1.9}
  .jd-table dt{font-size:12.5px}
  .policy p,.policy li{font-size:13px}
  .about-table dd,.about-table dt{font-size:13px}
  .cinfo dd{font-size:13px}
  .cinfo dd b{font-size:14px;word-break:break-all}
  .f-addr{font-size:11.5px}
  .f-col a{font-size:13px}
  .f-col a span{display:block;margin:2px 0 0}

  /* --- 見出し類も一段階余裕を --- */
  .sec-head h2{font-size:clamp(30px,8.6vw,38px)}
  .page-head h1{font-size:clamp(34px,9.2vw,46px)}
  .svc-body h3,.sdetail h3{font-size:18px}
  #belief h3{font-size:clamp(19px,5.2vw,24px)}
  .msg-grid h3,.vm-block h3{font-size:clamp(19px,5.2vw,24px)}
  .worry-title{font-size:clamp(17px,4.8vw,21px)}
  .story-badge{font-size:17px;padding:10px 14px;white-space:normal}
  .contact-msg{font-size:14.5px}
  .contact-msg-sub{font-size:12px}

  /* --- タグ・チップ類 --- */
  .wtag,.wind{font-size:9px;letter-spacing:.12em;padding:5px 9px}
  .wcard h4{font-size:13.5px}
  .wcard{min-width:258px;max-width:258px}

  /* --- イントロ --- */
  #intro .in-logo{font-size:clamp(26px,7.4vw,34px)}

  /* --- ボタン --- */
  .btn{font-size:12.5px;padding:14px 26px;letter-spacing:.12em}
}