/* KTRYUS teaser / no external dependencies */
:root { --bg:#0c1118; --surface:#141b25; --surface2:#18222d; --line:#303c49; --ink:#f2f3f6; --sub:#a8b3c1; --blue:#3287fa; --blue2:#54acff; --accent:#90baff; }
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.65}
a{color:inherit;text-decoration:none}
.wrap{max-width:1160px;width:calc(100% - 88px);margin-inline:auto}
.site-shell{overflow:hidden;min-height:100vh;background:radial-gradient(circle at 75% 28%,#142239 0,transparent 37%),var(--bg)}
.site-header{height:104px;border-bottom:1px solid #ffffff16;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:inline-flex;align-items:center;line-height:0}
.brand img{width:177px;height:auto;display:block}
.header-status{font-size:10px;font-weight:700;letter-spacing:.16em;color:#9eacbd;white-space:nowrap;display:flex;align-items:center;gap:12px}
.status-dot{width:7px;height:7px;background:#428dfb;border-radius:50%;box-shadow:0 0 0 4px #4087ff18}
.hero{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(280px,.78fr);align-items:center;gap:18px;min-height:580px;padding-top:55px;padding-bottom:75px}
.eyebrow,.section-index{font-size:11px;font-weight:750;letter-spacing:.18em;color:#7bb0ff;margin:0 0 24px}
.eyebrow{display:flex;align-items:center;gap:14px}
.eyebrow-rule{width:27px;height:2px;background:var(--blue)}
h1{font-size:clamp(38px,4.25vw,62px);letter-spacing:-.06em;line-height:1.45;margin:0;font-weight:750}
h1 span{color:#86b8ff}
.intro{font-size:16px;letter-spacing:.025em;color:var(--sub);line-height:2;margin:25px 0 35px}
.cta{display:inline-flex;align-items:center;justify-content:space-between;gap:48px;background:var(--blue);color:#fff;min-width:222px;min-height:55px;padding:0 19px 0 24px;font-size:14px;font-weight:700;transition:background .2s ease,transform .2s ease}
.cta:hover{background:#1965d9;transform:translateY(-2px)}
.cta:focus-visible,.contact-link:focus-visible,.brand:focus-visible{outline:2px solid #a3caff;outline-offset:5px}
.arrow{font-size:20px;line-height:1}
.hero-art{height:395px;position:relative;border-left:1px solid #ffffff15;display:flex;align-items:center;justify-content:center;isolation:isolate}
.hero-art::after{content:"";position:absolute;inset:18% 11%;border-radius:50%;background:radial-gradient(circle,#2067c41c,transparent 69%);z-index:-2}
.art-caption,.art-foot{position:absolute;color:#6d8aa8;font-size:10px;font-weight:650;letter-spacing:.16em}
.art-caption{top:18px;right:3px}.art-caption span{color:#4499f6;padding:0 6px}.art-foot{bottom:18px;left:55px}
.figure{position:relative;width:310px;height:310px;opacity:.87}
.axis{position:absolute;inset:50%;width:235px;height:235px;border:1px solid #2f5a86;border-radius:50%;transform:translate(-50%,-50%)}
.axis-b{height:180px;width:180px;opacity:.52}.axis-c{height:300px;width:300px;opacity:.35}
.trace{position:absolute;left:50%;top:50%;height:1px;width:275px;background:linear-gradient(90deg,transparent,#3881cf,transparent);transform-origin:center;transform:translate(-50%,-50%) rotate(-32deg)}
.trace-b{transform:translate(-50%,-50%) rotate(38deg);opacity:.45}
.core{width:90px;height:90px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg);border:2px solid #4c8fe1;background:linear-gradient(135deg,#368ffb36,#07101a 70%);box-shadow:0 0 52px #0a5acc20, inset 0 0 44px #0e6acc15}
.core::after{content:"";position:absolute;inset:19px;border:1px solid #83b4ec66}
.node{position:absolute;width:8px;height:8px;border-radius:50%;background:#8cc6ff;box-shadow:0 0 12px #3389ed75}.node-a{top:37px;left:116px}.node-b{top:210px;right:29px}.node-c{bottom:32px;left:77px}
.services{border-top:1px solid #ffffff1d;border-bottom:1px solid #ffffff1d;background:#101720b3;padding:56px 0 66px}
.section-head{display:flex;align-items:baseline;gap:37px}.section-head .section-index{margin:0}
h2{font-size:28px;letter-spacing:-.035em;line-height:1.5;font-weight:700;margin:0}
.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}
.service-card{min-height:210px;background:linear-gradient(155deg,#19232e 0%,#131b24 100%);border:1px solid #334253;padding:29px 32px 26px;position:relative}
.service-card::after{content:"";position:absolute;right:0;top:0;background:#2b88f5;width:43px;height:2px;opacity:.7}
.service-number{color:#78aaf4;font-size:12px;font-weight:720;letter-spacing:.07em}.service-number span{color:#7e8d9e;margin-left:13px;font-size:10px;letter-spacing:.17em}
.service-card h3{font-size:22px;letter-spacing:-.025em;line-height:1.6;margin:18px 0 13px;font-weight:700}
.service-card p{margin:0;font-size:13px;color:var(--sub);line-height:1.9}
.contact-section{padding-top:64px;padding-bottom:66px;display:flex;align-items:center;justify-content:space-between;gap:38px}
.contact-section .section-index{margin-bottom:12px}.contact-section h2{font-size:22px}
.contact-section p:not(.section-index){font-size:13px;margin:13px 0 0;color:var(--sub)}
.contact-link{font-size:17px;font-weight:700;letter-spacing:0;white-space:nowrap;padding:0 0 10px;border-bottom:1px solid #4c92e6;display:flex;align-items:center;gap:18px;transition:color .2s}
.contact-link:hover{color:#7cb9ff}.contact-link span{color:#5bafff;font-size:22px}
.site-footer{border-top:1px solid #ffffff1c;display:flex;align-items:center;justify-content:space-between;min-height:75px;color:#748598;font-size:11px;letter-spacing:.03em}.footer-sep{color:#4a6583;margin:0 6px}
@media (max-width:820px){.wrap{width:calc(100% - 48px)}.site-header{height:80px}.brand img{width:150px}.header-status{font-size:8px}.hero{grid-template-columns:1fr;min-height:0;gap:20px;padding-top:72px;padding-bottom:50px}.hero-art{height:205px;border-left:0;border-top:1px solid #ffffff16}.figure{transform:scale(.58)}.art-caption{top:15px;right:0}.art-foot{bottom:2px;left:6px}.intro{font-size:15px}.contact-section{align-items:flex-start;flex-direction:column;gap:28px}.service-card{padding:25px}}
@media (max-width:560px){.wrap{width:calc(100% - 36px)}.site-header{height:74px}.brand img{width:132px}.header-status{font-size:0;letter-spacing:0}.header-status .status-dot{width:7px;height:7px}.hero{padding-top:58px}.eyebrow{font-size:9px;letter-spacing:.1em;gap:9px}.eyebrow-rule{width:18px}h1{font-size:clamp(29px,7.1vw,39px);letter-spacing:-.06em}.intro{font-size:13px;line-height:2}.desktop-only{display:none}.cta{width:100%}.hero-art{height:160px}.figure{transform:scale(.48)}.art-caption,.art-foot{font-size:8px}.services{padding:42px 0 46px}.section-head{display:block}.section-head .section-index{margin-bottom:9px}h2{font-size:24px}.service-grid{grid-template-columns:1fr;gap:12px}.service-card{min-height:0;padding:23px}.service-card h3{font-size:19px;margin:12px 0 8px}.service-card p{font-size:12px}.contact-section{padding-top:45px;padding-bottom:52px}.contact-section h2{font-size:20px}.contact-section p:not(.section-index){font-size:12px}.contact-link{font-size:16px}.site-footer{min-height:78px;gap:5px;flex-direction:column;justify-content:center;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cta{transition:none}.contact-link{transition:none}}


/* Contact: mailto link + copy fallback */
.contact-section{scroll-margin-top:32px}
.contact-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px 18px;flex-wrap:wrap;max-width:470px}
.contact-actions .contact-link{min-width:0;overflow-wrap:anywhere;white-space:normal}
.copy-button{appearance:none;display:inline-flex;gap:8px;align-items:center;justify-content:center;min-height:42px;padding:9px 14px;background:#1b2c40;border:1px solid #4b7098;border-radius:4px;color:#e7effe;font:inherit;font-size:12px;font-weight:700;letter-spacing:.02em;cursor:pointer;transition:border-color .2s,background .2s}
.copy-button:hover{background:#27415d;border-color:#8db4e4}
.copy-button.copied{border-color:#73bc97;background:#193d32}
.copy-button:focus-visible{outline:2px solid #a3caff;outline-offset:4px}
.copy-button svg{flex:none}
.contact-hint,.copy-status{flex-basis:100%;text-align:right;margin:0!important;font-size:12px!important;line-height:1.6;color:var(--sub)}
.copy-status:empty{display:none}
.copy-status{color:#a3caff}
@media(max-width:820px){.contact-actions{justify-content:flex-start}.contact-hint,.copy-status{text-align:left}}
@media(max-width:560px){.contact-actions{gap:12px}.contact-link{font-size:clamp(14px,4vw,16px)}.copy-button{min-height:44px}.contact-hint,.copy-status{font-size:11px!important}}