/* UPLINK-Toyama — Bio-Digital Editorial System */
:root {
  color-scheme: light;
  --ink: #062d32;
  --muted: #52777a;
  --deep: #dff8f1;
  --panel: #f5fffb;
  --line: rgba(6, 65, 70, .15);
  --cyan: #00cbd1;
  --aqua: #13d680;
  --violet: #8157e8;
}
html { background:#dff8f1; }
body { min-width:0; color:var(--ink); background:#dff8f1; }
body::before { background:radial-gradient(circle at 82% 4%,rgba(105,255,201,.6),transparent 28%),radial-gradient(circle at 3% 38%,rgba(95,208,255,.35),transparent 34%),linear-gradient(150deg,#f5fff9 0,#daf7f0 52%,#d7edf8 100%); }
body::after { opacity:.7; background-image:linear-gradient(rgba(3,80,84,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(3,80,84,.045) 1px,transparent 1px),radial-gradient(circle at center,transparent 38%,rgba(170,226,215,.25) 100%); }
.site-header { color:#073c41; }
.site-header.is-scrolled { border-color:rgba(6,65,70,.12); background:rgba(240,255,250,.78); box-shadow:0 15px 45px rgba(25,85,81,.09); }
.logo { color:#07373c; }
.logo-mark { border-color:#007e88; box-shadow:0 0 25px rgba(0,203,209,.25),inset 0 0 12px rgba(19,214,128,.22); }
.logo-mark::after { border-color:#00a875; border-left-color:transparent; }
.nav-list a { color:#315d60; font-weight:650; }
.nav-list a:hover,.nav-list a[aria-current="page"] { color:#002e33; }
.nav-list a[aria-current="page"]::after { height:2px; background:linear-gradient(90deg,#00a99d,#18d97d); }
.menu-button { color:#063c40; background:rgba(244,255,251,.8); }
.button { color:#093d41; border-color:rgba(3,85,89,.24); background:rgba(250,255,253,.55); box-shadow:0 8px 28px rgba(14,75,72,.06); backdrop-filter:blur(14px); }
.button:hover { color:#002c30; border-color:#00a8a9; background:#f6fffb; box-shadow:0 16px 34px rgba(0,145,140,.13); }
.button.primary { color:#f5fffb; border-color:#006f73; background:linear-gradient(120deg,#006f73,#00a879); box-shadow:0 18px 40px rgba(0,125,118,.2); }
.button.primary::after { color:white; }
.eyebrow { color:#007d83; }
.lead { color:#345f62; }
.muted { color:#5b7b7d; }

/* Hero: editorial typography + living computation */
.hero { min-height:100svh; align-items:center; overflow:clip; padding:9rem 0 5rem; background:linear-gradient(110deg,rgba(246,255,251,.84),rgba(225,250,242,.38) 48%,rgba(206,242,240,.22)); }
.hero::before { width:min(61vw,58rem); right:-3%; top:2%; border-color:rgba(0,126,131,.18); background:radial-gradient(circle at 37% 34%,rgba(255,255,255,.9),transparent 13%),radial-gradient(circle at 48% 43%,rgba(105,255,193,.65),transparent 25%),radial-gradient(circle at 66% 59%,rgba(118,188,255,.5),transparent 31%),radial-gradient(circle at 48% 52%,rgba(130,87,232,.25),transparent 55%); box-shadow:inset 0 0 130px rgba(255,255,255,.45),0 45px 150px rgba(0,148,144,.15); filter:saturate(110%); }
.hero::after { background:linear-gradient(90deg,rgba(240,255,249,.92) 0%,rgba(239,255,249,.63) 34%,transparent 66%),linear-gradient(0deg,rgba(223,248,241,.9),transparent 20%); }
.hero-canvas { opacity:.65; mix-blend-mode:multiply; }
.hero-grid { grid-template-columns:minmax(0,1.1fr) minmax(18rem,.42fr); position:relative; z-index:3; }
.hero-kicker { color:#064b4f; border-color:rgba(0,125,130,.28); background:rgba(244,255,251,.58); box-shadow:none; }
.hero .display { color:#06363a; text-shadow:none; }
.brand-display span { font-size:clamp(4.6rem,10.8vw,10.5rem); font-weight:720; letter-spacing:-.075em; }
.brand-display small { color:white; background:linear-gradient(90deg,#007f83,#04ba84); box-shadow:0 18px 50px rgba(0,130,124,.2); }
.hero-copy { max-width:25rem; color:#174e52; font-size:clamp(1.25rem,1.7vw,1.75rem); }
.hero-index { border-color:rgba(0,92,96,.18); background:rgba(248,255,252,.56); box-shadow:0 35px 90px rgba(19,91,84,.12),inset 0 1px rgba(255,255,255,.8); backdrop-filter:blur(24px) saturate(150%); }
.hero-index a { color:#315f62; border-color:rgba(0,92,96,.14); }
.hero-index span { color:#008c8f; }
.scroll-cue { color:#416d70; }
.scroll-cue::after { background:linear-gradient(#007f83,transparent); }
.bio-object { --mx:0; --my:0; position:absolute; z-index:1; width:min(51vw,48rem); aspect-ratio:1; right:7%; top:50%; transform:translate(calc(var(--mx)*12px),calc(-50% + var(--my)*12px)); pointer-events:none; }
.bio-orbit { position:absolute; inset:6%; border:1px solid rgba(0,111,115,.19); border-radius:50%; animation:orbit 28s linear infinite; }
.bio-orbit:nth-child(2) { inset:17%; border-style:dashed; border-color:rgba(129,87,232,.21); animation-direction:reverse; animation-duration:20s; }
.bio-orbit:nth-child(3) { inset:29%; border-color:rgba(0,168,121,.32); animation-duration:13s; }
.bio-orbit::before { content:""; position:absolute; width:.65rem; height:.65rem; left:16%; top:7%; border-radius:50%; background:#00a99d; box-shadow:0 0 0 .45rem rgba(0,169,157,.1),0 0 28px #00cbd1; }
.bio-core { position:absolute; inset:28%; border:1px solid rgba(255,255,255,.8); border-radius:44% 56% 63% 37% / 46% 40% 60% 54%; background:radial-gradient(circle at 33% 28%,rgba(255,255,255,.98) 0 4%,transparent 13%),radial-gradient(circle at 43% 39%,#baffd7 0,#37e6a3 25%,rgba(32,197,204,.82) 58%,rgba(99,86,224,.7) 100%); box-shadow:inset -18px -25px 50px rgba(32,58,157,.25),inset 15px 18px 34px rgba(255,255,255,.72),0 30px 80px rgba(0,136,129,.25); animation:cell 9s ease-in-out infinite; }
.bio-core::after { content:""; position:absolute; inset:22%; border:1px solid rgba(255,255,255,.55); border-radius:50%; background:radial-gradient(circle at 40% 35%,rgba(255,255,255,.75),transparent 20%); box-shadow:inset 0 0 25px rgba(29,90,160,.2); }
.bio-label { position:absolute; padding:.45rem .7rem; border:1px solid rgba(0,88,93,.18); border-radius:999px; color:#06494d; background:rgba(249,255,252,.72); box-shadow:0 12px 30px rgba(14,76,72,.09); font:700 .67rem/1 ui-monospace,monospace; letter-spacing:.1em; backdrop-filter:blur(10px); }
.bio-label:nth-of-type(1) { top:17%; left:2%; }
.bio-label:nth-of-type(2) { right:-2%; top:37%; }
.bio-label:nth-of-type(3) { left:8%; bottom:13%; }

/* Rhythmic page sections */
.section { background:rgba(240,255,249,.42); }
.intro-grid { align-items:start; }
.intro-grid .section-title { font-size:clamp(2.3rem,5vw,5rem); max-width:15ch; }
.services { border-color:rgba(5,74,78,.12); background:#eafbf6; }
.service { position:relative; border-color:rgba(5,74,78,.12); }
.service[data-tone="aqua"] { grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr)!important; }
.service::before { content:attr(data-code); position:absolute; top:3rem; right:0; color:rgba(5,78,82,.06); font:800 clamp(6rem,17vw,16rem)/1 sans-serif; letter-spacing:-.08em; }
.service h3 { color:#08383c; }
.service p { color:#41686b; }
.visual { contain:paint; border-color:color-mix(in srgb,var(--accent) 38%,transparent); background:radial-gradient(circle at 48% 44%,color-mix(in srgb,var(--accent) 54%,transparent),transparent 38%),radial-gradient(circle at 80% 15%,rgba(106,168,255,.3),transparent 28%),linear-gradient(145deg,#073f46,#081a38); box-shadow:0 40px 110px color-mix(in srgb,var(--accent) 22%,transparent),inset 0 1px rgba(255,255,255,.2); }
.service[data-tone="aqua"] .visual { background:radial-gradient(circle at 42% 45%,rgba(82,255,172,.56),transparent 36%),radial-gradient(circle at 75% 25%,rgba(58,218,255,.35),transparent 28%),linear-gradient(145deg,#063f38,#092a3b); }
.service[data-tone="web"] .visual { background:radial-gradient(circle at 45% 48%,rgba(191,129,255,.58),transparent 37%),radial-gradient(circle at 78% 18%,rgba(46,242,190,.33),transparent 28%),linear-gradient(145deg,#20245d,#092f42); }
.visual::before,.visual::after { border-color:color-mix(in srgb,var(--accent) 38%,transparent); }
.visual-lines { opacity:.86; mix-blend-mode:screen; filter:saturate(145%); }
.visual canvas { position:absolute; inset:0; width:100%; height:100%; }
.visual::before { content:attr(data-visual); z-index:2; inset:1.25rem auto auto 1.35rem; width:auto; height:auto; border:0; border-radius:0; color:rgba(221,255,250,.82); animation:none; font:700 .66rem/1 ui-monospace,Consolas,monospace; letter-spacing:.16em; }
.visual::after { content:""; z-index:2; inset:auto 1.25rem 1.3rem auto; width:4rem; height:1px; border:0; border-radius:0; background:linear-gradient(90deg,transparent,var(--accent)); animation:none; }
.visual-status { position:absolute; z-index:2; right:1.25rem; top:1.15rem; color:rgba(216,255,247,.56); font:600 .58rem/1 ui-monospace,Consolas,monospace; letter-spacing:.14em; }
.visual-pc { background:linear-gradient(145deg,#062f3b,#07172e); }
.visual-aqua { background:radial-gradient(circle at 25% 30%,rgba(45,235,171,.14),transparent 33%),linear-gradient(160deg,#063d3b,#07283b); }
.visual-web { background:radial-gradient(circle at 72% 25%,rgba(173,104,255,.16),transparent 34%),linear-gradient(145deg,#182252,#082f40); }
.visual-pc::after { animation:diagnostic-line 2.4s steps(4,end) infinite; }
.visual-aqua::after { width:3.4rem; background:linear-gradient(90deg,transparent,#58f3b2); animation:current-line 4.8s ease-in-out infinite; }
.visual-web::after { background:linear-gradient(90deg,transparent,#c58cff); animation:node-line 3.1s ease-in-out infinite; }
@keyframes diagnostic-line { 50% { width:7.5rem; opacity:.4; } }
@keyframes current-line { 50% { transform:translateX(-1.3rem) scaleX(.72); opacity:.55; } }
@keyframes node-line { 50% { transform:translateX(-.7rem); filter:hue-rotate(30deg); } }
.manifesto { color:#eafff8; background:radial-gradient(circle at 90% 5%,rgba(31,212,145,.23),transparent 30%),radial-gradient(circle at 0 95%,rgba(67,168,225,.2),transparent 32%),#06383b; }
.manifesto .eyebrow { color:#68f5bb; }
.manifesto .lead { color:#c7e5df; }
.manifesto::before { color:rgba(199,255,235,.045); }
.principles { border-color:rgba(195,255,235,.15); background:rgba(195,255,235,.15); }
.principle { background:rgba(6,52,56,.78); }
.principle span { color:#68f5bb; }
.principle p { color:#afd1cc; }
.feed-head .muted,.prototype { color:#537579; }
.article { border-color:rgba(5,90,94,.14); background:radial-gradient(circle at 85% 8%,rgba(49,225,147,.24),transparent 30%),linear-gradient(145deg,rgba(250,255,252,.9),rgba(218,245,239,.92)); box-shadow:0 28px 75px rgba(18,87,80,.1); }
.article-tag { color:#007f83; border-color:rgba(0,127,131,.2); }
.cta { border-color:rgba(5,94,98,.2); background:radial-gradient(circle at 82% 8%,rgba(67,232,160,.35),transparent 35%),radial-gradient(circle at 5% 90%,rgba(133,105,235,.19),transparent 34%),linear-gradient(145deg,#f7fffb,#d7f4ed); box-shadow:0 34px 100px rgba(14,88,81,.13),inset 0 1px white; }
.site-footer { color:#e8fffa; border-color:rgba(255,255,255,.12); background:#052f33; }
.site-footer .logo { color:white; }
.site-footer .muted,.site-footer .footer-links,.site-footer .footer-meta { color:#a9d1cc; }
.site-footer .footer-meta { border-color:rgba(255,255,255,.12); }

/* Inner pages */
.page-hero { border-color:rgba(5,74,78,.13); background:linear-gradient(135deg,#f7fffb,#daf6ef 58%,#d4eaf7); }
.page-hero::before { opacity:.7; }
.page-hero::after { content:""; position:absolute; z-index:-1; width:min(38vw,34rem); aspect-ratio:1; right:3%; top:18%; border:1px solid color-mix(in srgb,var(--page-accent,var(--cyan)) 32%,transparent); border-radius:43% 57% 60% 40%; background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.92),transparent 8%),radial-gradient(circle at 44% 43%,color-mix(in srgb,var(--page-accent,var(--cyan)) 45%,white),transparent 42%),radial-gradient(circle at 64% 62%,rgba(77,190,234,.3),transparent 55%); box-shadow:inset 0 0 80px rgba(255,255,255,.55),0 35px 90px color-mix(in srgb,var(--page-accent,var(--cyan)) 18%,transparent); animation:cell 12s ease-in-out infinite; }
.page-hero-grid { position:relative; z-index:1; }
.page-hero-grid>.lead { padding:1.4rem; border:1px solid rgba(5,91,95,.15); border-radius:1.2rem; background:rgba(249,255,252,.62); box-shadow:0 22px 60px rgba(15,81,77,.08); backdrop-filter:blur(18px); }
.field-hero { isolation:isolate; background:#dff7f1; }
.field-hero>canvas { position:absolute; z-index:0; inset:0; width:100%; height:100%; opacity:.34; }
.field-hero-aqua>canvas { opacity:.62; }
.field-hero-web>canvas { opacity:.38; }
.field-hero>.shell { position:relative; z-index:2; }
.field-hero::before { z-index:1; opacity:1; background:linear-gradient(90deg,rgba(244,255,251,.94),rgba(240,255,250,.62) 48%,rgba(223,248,241,.17)),linear-gradient(0deg,rgba(225,249,243,.78),transparent 35%); }
.field-hero-aqua::before { background:linear-gradient(90deg,rgba(237,255,249,.9),rgba(230,253,246,.58) 48%,rgba(6,49,57,.05)),linear-gradient(0deg,rgba(224,249,242,.76),transparent 40%); }
.field-hero::after { content:none; }
.breadcrumbs { color:#557679; }
.feature { border-color:rgba(5,91,95,.15); background:linear-gradient(145deg,rgba(252,255,253,.9),rgba(218,245,239,.85)); box-shadow:0 20px 55px rgba(17,80,75,.08); }
.feature:hover { background:#f7fffb; }
.process article { background:rgba(245,255,251,.65); }
.field input,.field select,.field textarea { color:#093b3f; border-color:rgba(5,85,89,.28); background:rgba(250,255,252,.82); }
.form-status { color:#315e61; background:rgba(0,160,150,.08); }
.error-page { background:radial-gradient(circle at 50% 30%,rgba(37,220,151,.28),transparent 32%),linear-gradient(145deg,#f4fffa,#d9f5ef); }

@media (max-width:900px) {
  .has-js .nav-list { background:rgba(235,253,247,.98); }
  .bio-object { width:min(78vw,39rem); right:-22%; opacity:.68; }
  .hero-grid { grid-template-columns:1fr; }
  .service[data-tone="aqua"] { grid-template-columns:1fr!important; }
  .page-hero::after { width:70vw; right:-24%; top:25%; opacity:.65; }
}
@media (max-width:560px) {
  .hero { padding-top:7.5rem; background:linear-gradient(160deg,rgba(248,255,252,.9),rgba(215,247,238,.55)); }
  .hero::before { width:115vw; right:-58%; top:13%; opacity:.72; }
  .brand-display span { font-size:clamp(4rem,22vw,6.4rem); }
  .bio-object { width:102vw; right:-58%; top:43%; opacity:.5; }
  .bio-label { display:none; }
  .hero-copy { max-width:14rem; font-size:1.16rem; }
  .hero-links { max-width:15rem; }
  .hero-links .button { width:100%; }
  .service::before { top:2rem; }
}
@media (prefers-reduced-motion:reduce) { .bio-object { transform:translateY(-50%); } }
