/* UPLINK 2026 Quality 95 layer
   Meaningful depth, stronger navigation and accessibility without hiding content */
:root{
  --v5-accent:#7ff0d0;
  --v5-accent-rgb:127,240,208;
  --v5-ink:#effffb;
  --v5-muted:#b7d2cc;
  --v5-panel:rgba(5,30,34,.66);
}

html{scroll-padding-top:7.5rem}
body:not(.member-page){overflow-x:clip;text-wrap:pretty}
body:not(.member-page) main{isolation:isolate}
body:not(.member-page) :is(h1,h2,h3,p,li,a){overflow-wrap:anywhere}
body:not(.member-page) :is(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid rgba(var(--v5-accent-rgb),.92);
  outline-offset:4px;
  border-radius:.35rem;
}
body:not(.member-page) :is(.button,.text-link,.route-cta,.nav-list a,.footer-links a){min-height:44px}
body:not(.member-page) .button{display:inline-flex;align-items:center;justify-content:center}

/* Route-specific semantic palettes */
body[data-route="custom-pc"]{--v5-accent:#8fe7ff;--v5-accent-rgb:143,231,255}
body[data-route="aquarium"]{--v5-accent:#79ebd7;--v5-accent-rgb:121,235,215}
body[data-route="web-development"]{--v5-accent:#b8a2ff;--v5-accent-rgb:184,162,255}
body[data-route="welfare-ai"]{--v5-accent:#b7eb80;--v5-accent-rgb:183,235,128}
body[data-route="about"]{--v5-accent:#9debd6;--v5-accent-rgb:157,235,214}
body[data-route="contact"]{--v5-accent:#9edcff;--v5-accent-rgb:158,220,255}

/* A slim status line gives every page one consistent, premium frame */
.experience-status{
  position:fixed;
  z-index:30;
  left:50%;bottom:1.1rem;
  translate:-50% 0;
  display:flex;align-items:center;gap:.7rem;
  min-height:2.25rem;padding:.42rem .82rem;
  border:1px solid rgba(var(--v5-accent-rgb),.24);
  border-radius:999px;
  color:rgba(235,255,249,.78);
  background:rgba(2,19,23,.64);
  box-shadow:0 .9rem 2.6rem rgba(0,8,12,.25),inset 0 1px rgba(255,255,255,.08);
  backdrop-filter:blur(16px) saturate(145%);
  font:700 .58rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;
  letter-spacing:.13em;
  pointer-events:none;
}
.experience-status::before{
  content:"";width:.44rem;aspect-ratio:1;border-radius:50%;
  background:var(--v5-accent);box-shadow:0 0 1rem rgba(var(--v5-accent-rgb),.75);
  animation:v5-pulse 2.8s ease-in-out infinite;
}
@keyframes v5-pulse{50%{opacity:.38;transform:scale(.72)}}

/* Hero photography remains unobstructed
   Motion is reserved for navigation and direct interaction */
.cinematic-hero,.route-hero{position:relative;isolation:isolate}
.semantic-field{display:none!important}

/* Page contents rail — real headings, real destinations */
.section-compass{
  position:fixed;z-index:24;right:1rem;top:50%;translate:0 -50%;
  display:grid;gap:.28rem;width:min(13rem,18vw);padding:.65rem;
  border:1px solid rgba(var(--v5-accent-rgb),.16);border-radius:1rem;
  background:rgba(2,18,22,.58);backdrop-filter:blur(15px) saturate(140%);
  box-shadow:0 1.5rem 4rem rgba(0,8,12,.2);
}
.section-compass::before{content:"PAGE / INDEX";padding:.25rem .55rem .45rem;color:rgba(var(--v5-accent-rgb),.78);font:700 .55rem/1 ui-monospace,monospace;letter-spacing:.12em}
.section-compass a{
  position:relative;display:grid;grid-template-columns:1.4rem 1fr;align-items:center;gap:.35rem;
  min-height:2.45rem;padding:.36rem .55rem;border-radius:.65rem;color:rgba(231,250,246,.62);
  font-size:.66rem;line-height:1.35;transition:color .25s,background .25s,transform .25s;
}
.section-compass a span:first-child{color:rgba(var(--v5-accent-rgb),.64);font:700 .55rem ui-monospace,monospace}
.section-compass a:hover,.section-compass a:focus-visible,.section-compass a.is-current{color:#fff;background:rgba(var(--v5-accent-rgb),.12);transform:translateX(-.2rem)}
.section-compass a.is-current::after{content:"";position:absolute;right:.45rem;width:.34rem;aspect-ratio:1;border-radius:50%;background:var(--v5-accent);box-shadow:0 0 .8rem rgba(var(--v5-accent-rgb),.8)}

/* Section depth and a less repetitive vertical rhythm */
body:not(.member-page) main>section:not(.hero-v4):not(.page-hero):not(.route-hero){position:relative}
body:not(.member-page) main>section:not(.hero-v4):not(.page-hero):not(.route-hero)::before{
  content:"";position:absolute;z-index:-1;inset:8% auto auto -8rem;width:18rem;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(var(--v5-accent-rgb),.08),transparent 68%);filter:blur(12px);pointer-events:none;
}
body:not(.member-page) main>section:nth-of-type(even)::before{left:auto;right:-8rem}
body:not(.member-page) main>section.is-section-current::before{animation:v5-breathe 6s ease-in-out infinite alternate}
@keyframes v5-breathe{to{scale:1.25;opacity:.55}}

.v5-depth-card{--v5-rx:0deg;--v5-ry:0deg;--v5-lift:0px;transform:perspective(1000px) rotateX(var(--v5-rx)) rotateY(var(--v5-ry)) translateY(var(--v5-lift));transform-style:preserve-3d;transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .35s}
.v5-depth-card:hover{--v5-lift:-7px;border-color:rgba(var(--v5-accent-rgb),.32)!important;box-shadow:0 2rem 5rem rgba(0,10,15,.22),inset 0 1px rgba(255,255,255,.09)}
.v5-depth-card :is(h2,h3,.button,.text-link){transform:translateZ(18px)}

/* Clear text hierarchy and conversion links */
body:not(.member-page) main p{line-height:1.9}
body:not(.member-page) main :is(.lead,.route-lead){max-width:42rem}
body:not(.member-page) :is(.text-link,.work-case-link){position:relative;font-weight:800;letter-spacing:.015em}
body:not(.member-page) :is(.text-link,.work-case-link)::after{content:"";position:absolute;left:0;right:0;bottom:.16rem;height:1px;background:currentColor;transform-origin:left;transition:transform .35s cubic-bezier(.16,1,.3,1)}
body:not(.member-page) :is(.text-link,.work-case-link):hover::after{transform:scaleX(.35)}

/* Prevent decorative layers from ever blocking the interface */
.global-atmosphere,.cinema-hud,.scroll-progress{pointer-events:none!important}

@media(max-width:1280px){.section-compass{display:none}}
@media(max-width:900px){
  .experience-status{bottom:.65rem;max-width:calc(100vw - 2rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:640px){
  .experience-status{display:none}
  body:not(.member-page) :is(.button,.route-cta){width:100%;min-height:52px}
}
@media(hover:none){.v5-depth-card:hover{--v5-lift:0px}}
@media(prefers-reduced-motion:reduce){
  .experience-status::before,body:not(.member-page) main>section.is-section-current::before{animation:none!important}
  .v5-depth-card{transform:none!important;transition:none!important}
  .section-compass a{transition:none}
}
@media(forced-colors:active){.experience-status,.section-compass{display:none}.v5-depth-card{transform:none!important}}

/* Business colour environments
   Cinematic heroes remain deep; the information layers move into daylight */
body[data-route="custom-pc"]{
  --v5-page:#edf6f8;--v5-page-alt:#dcecf1;--v5-page-ink:#102b36;--v5-page-muted:#496a76;
  --v5-surface:rgba(255,255,255,.78);--v5-border:rgba(38,109,132,.2);--v5-strong:#116d8b;
}
body[data-route="aquarium"]{
  --v5-page:#e9f8f5;--v5-page-alt:#d8f0ec;--v5-page-ink:#103936;--v5-page-muted:#4c716c;
  --v5-surface:rgba(255,255,255,.72);--v5-border:rgba(20,126,111,.2);--v5-strong:#087f70;
}
body[data-route="web-development"]{
  --v5-page:#f5f2ff;--v5-page-alt:#e9e8fb;--v5-page-ink:#272544;--v5-page-muted:#65617f;
  --v5-surface:rgba(255,255,255,.76);--v5-border:rgba(91,76,176,.18);--v5-strong:#5e4ac7;
}
body[data-route="welfare-ai"]{
  --v5-page:#f7f6e9;--v5-page-alt:#e7f2df;--v5-page-ink:#263b2c;--v5-page-muted:#5c715f;
  --v5-surface:rgba(255,255,251,.78);--v5-border:rgba(75,125,69,.19);--v5-strong:#4f8a43;
}
body[data-route="about"]{
  --v5-page:#f4f5ef;--v5-page-alt:#e2efeb;--v5-page-ink:#173533;--v5-page-muted:#57716e;
  --v5-surface:rgba(255,255,255,.76);--v5-border:rgba(27,112,102,.18);--v5-strong:#177c70;
}
body[data-route="contact"]{
  --v5-page:#eef7fb;--v5-page-alt:#e1eef7;--v5-page-ink:#173142;--v5-page-muted:#526d7b;
  --v5-surface:rgba(255,255,255,.82);--v5-border:rgba(44,112,153,.2);--v5-strong:#287aa3;
}

body[data-route]:not([data-route="home"]){background:var(--v5-page);color:var(--v5-page-ink)}
body[data-route]:not([data-route="home"]) main>.section{
  z-index:0;color:var(--v5-page-ink)!important;background:
    radial-gradient(circle at 92% 8%,rgba(var(--v5-accent-rgb),.13),transparent 27%),
    linear-gradient(145deg,var(--v5-page),var(--v5-page-alt))!important;
}
body[data-route]:not([data-route="home"]) main>.section:nth-of-type(odd){
  background:
    radial-gradient(circle at 7% 82%,rgba(var(--v5-accent-rgb),.12),transparent 25%),
    linear-gradient(145deg,var(--v5-page-alt),var(--v5-page))!important;
}
body[data-route]:not([data-route="home"]) main>.section :is(h2,h3,strong,label){color:var(--v5-page-ink)!important}
body[data-route]:not([data-route="home"]) main>.section :is(.lead,.muted,p){color:var(--v5-page-muted)!important}
body[data-route]:not([data-route="home"]) main>.section :is(.eyebrow,.prototype,.feature b,.process article::before){color:var(--v5-strong)!important}
body[data-route]:not([data-route="home"]) main>.section :is(.feature,.process article,.notice-panel,.form){
  border-color:var(--v5-border)!important;background:var(--v5-surface)!important;
  box-shadow:0 1.4rem 4rem rgba(30,62,68,.08),inset 0 1px rgba(255,255,255,.86);
  backdrop-filter:blur(18px) saturate(125%);
}
body[data-route]:not([data-route="home"]) main>.section .feature:hover{
  border-color:rgba(var(--v5-accent-rgb),.62)!important;background:rgba(255,255,255,.92)!important;
  box-shadow:0 1.8rem 4.8rem rgba(30,62,68,.13),inset 0 1px #fff;
}
body[data-route]:not([data-route="home"]) main>.section .cta{
  color:var(--v5-page-ink)!important;border-color:var(--v5-border)!important;
  background:
    radial-gradient(circle at 83% 14%,rgba(var(--v5-accent-rgb),.3),transparent 32%),
    linear-gradient(135deg,rgba(255,255,255,.9),rgba(255,255,255,.58))!important;
  box-shadow:0 2rem 5rem rgba(29,64,74,.12),inset 0 1px #fff;
}
body[data-route]:not([data-route="home"]) main>.section .button:not(.primary){color:var(--v5-page-ink);border-color:var(--v5-border);background:rgba(255,255,255,.66)}
body[data-route]:not([data-route="home"]) main>.section .button.primary{
  color:#fff;border-color:var(--v5-strong);background:var(--v5-strong);box-shadow:0 .8rem 2rem rgba(var(--v5-accent-rgb),.2);
}
body[data-route]:not([data-route="home"]) main>.section .button.primary::after{color:#fff}

/* Forms use a daylight paper surface without losing focus visibility */
body[data-route="contact"] .form{max-width:60rem;padding:clamp(1.3rem,4vw,3rem);border:1px solid var(--v5-border);border-radius:1.6rem}
body[data-route="contact"] .field :is(input,select,textarea){color:#173142;border-color:rgba(44,112,153,.28);background:rgba(255,255,255,.88)}
body[data-route="contact"] .field :is(input,select,textarea):focus{border-color:#287aa3;box-shadow:0 0 0 4px rgba(40,122,163,.12);outline:0}
body[data-route="contact"] .form-status{color:#466775;border-color:#287aa3;background:rgba(40,122,163,.08)}

/* Aquarium keeps one immersive water chamber while its surrounding story stays airy */
body[data-route="aquarium"] main>.section.aquarium-store{
  color:#eafff8!important;background:
    radial-gradient(circle at 16% 7%,rgba(93,244,218,.23),transparent 29%),
    radial-gradient(circle at 88% 76%,rgba(71,142,255,.2),transparent 35%),
    linear-gradient(155deg,#07505a,#062e42 68%,#071f35)!important;
}
body[data-route="aquarium"] main>.section.aquarium-store :is(h2,h3,strong){color:#effffb!important}
body[data-route="aquarium"] main>.section.aquarium-store :is(p,.lead,.muted){color:#c5e4df!important}
body[data-route="aquarium"] main>.section.aquarium-store :is(.eyebrow,.living-code,.store-empty span){color:#91f1db!important}

/* Welfare content needs the calmest, warmest reading surface */
body[data-route="welfare-ai"] main>.section.pension-entry{
  color:#f4fff9!important;background:
    radial-gradient(circle at 78% 24%,rgba(183,235,128,.19),transparent 30%),
    linear-gradient(135deg,#285d51,#18443f)!important;
}
body[data-route="welfare-ai"] main>.section.pension-entry :is(h2,h3,strong){color:#f5fff9!important}
body[data-route="welfare-ai"] main>.section.pension-entry :is(p,.lead){color:#dcefe7!important}
body[data-route="welfare-ai"] main>.section.pension-entry .eyebrow{color:#c9f5a4!important}
body[data-route="welfare-ai"] main>.section:not(.pension-entry) .section-title{max-width:24ch}

/* Home: Toyama snow, bay water and morning light between cinematic business scenes */
body[data-route="home"] .portal{
  color:#163d40;background:
    radial-gradient(circle at 82% 14%,rgba(110,210,221,.34),transparent 35%),
    radial-gradient(circle at 14% 88%,rgba(172,230,207,.34),transparent 31%),
    linear-gradient(145deg,#f7faf7,#dceff1 58%,#edf5ed);
}
body[data-route="home"] .portal::before{border-color:rgba(39,126,130,.17);background:rgba(255,255,255,.38);box-shadow:-25px 45px 100px rgba(43,98,105,.13),inset 1px 1px rgba(255,255,255,.8)}
body[data-route="home"] .portal::after{border-color:rgba(31,141,138,.16);background:repeating-radial-gradient(circle,transparent 0 7%,rgba(31,141,138,.07) 7.2% 7.5%)}
body[data-route="home"] .portal h2>span:first-child,body[data-route="home"] .portal h2>span:last-child{color:#12383b!important;text-shadow:none}
body[data-route="home"] .portal h2 em{color:#087f70;text-shadow:0 0 28px rgba(8,127,112,.15)}
body[data-route="home"] .portal :is(.eyebrow,.vertical-note){color:#257871!important}
body[data-route="home"] .portal-copy{border-color:rgba(17,115,111,.2);background:rgba(255,255,255,.48);box-shadow:-18px 30px 70px rgba(31,88,91,.1),inset 1px 1px #fff}
body[data-route="home"] .portal-copy p{color:#3d6463!important;text-shadow:none}
body[data-route="home"] .portal-copy span{color:#087f70!important}
body[data-route="home"] .field-pc{--story-accent:#79cce7}
body[data-route="home"] .field-aqua{--story-accent:#79ebd7}
body[data-route="home"] .field-web{--story-accent:#b8a2ff}
body[data-route="home"] .field-welfare{--story-accent:#b7eb80}
body[data-route="home"] .field-story .story-title>p,body[data-route="home"] .field-story .story-meta span{color:var(--story-accent)}
body[data-route="home"] .field-story .story-body .button{border-color:color-mix(in srgb,var(--story-accent) 55%,transparent)}
body[data-route="home"] .field-journal{
  color:#223b3b;background:
    radial-gradient(circle at 86% 13%,rgba(184,162,255,.22),transparent 31%),
    linear-gradient(145deg,#f4f1eb,#e6f1ed);
}
body[data-route="home"] .field-journal #journal-title{color:#183637!important;text-shadow:none}
body[data-route="home"] .field-journal .journal-head>p{color:#58716f!important}
body[data-route="home"] .journal-grid{border-color:rgba(33,91,88,.16);box-shadow:0 2.2rem 6rem rgba(34,79,78,.13)}
body[data-route="home"] .journal-feature{color:#f2fffb;background:linear-gradient(145deg,rgba(27,125,109,.9),rgba(15,68,74,.95))}
body[data-route="home"] .journal-list{background:rgba(255,255,255,.66)}
body[data-route="home"] .journal-list a{color:#173637;background:rgba(255,255,255,.54);border-color:rgba(33,91,88,.13)}
body[data-route="home"] .journal-list a:hover{background:#fff}
body[data-route="home"] .field-journal .journal-list h3{color:#173637!important}
body[data-route="home"] .field-journal .journal-list strong{color:#176f68!important}
body[data-route="home"] .philosophy-v4{
  color:#263934;background:
    radial-gradient(circle at 18% 70%,rgba(183,235,128,.22),transparent 31%),
    radial-gradient(circle at 80% 26%,rgba(121,235,215,.18),transparent 30%),
    linear-gradient(145deg,#f8f5e9,#edf3e7);
}
body[data-route="home"] .philosophy-v4::before{opacity:.3}
body[data-route="home"] .philosophy-v4 :is(h2,h3){color:#203a33}
body[data-route="home"] .philosophy-v4 p{color:#597067}
body[data-route="home"] .principle-track{border-color:rgba(46,103,87,.18)}
body[data-route="home"] .principle-track article{border-color:rgba(46,103,87,.18);background:rgba(255,255,255,.28)}
body[data-route="home"] .principle-track article:hover{background:rgba(255,255,255,.72)}
body[data-route="home"] .contact-v4{
  color:#153a43;background:
    radial-gradient(circle at 78% 20%,rgba(80,184,201,.32),transparent 30%),
    linear-gradient(130deg,#dff2f3,#eef7f3 52%,#e6eef8);
}
body[data-route="home"] .contact-v4 :is(h2,p){color:#153a43}
body[data-route="home"] .contact-v4-grid>div:last-child{border-color:rgba(31,111,124,.18);background:rgba(255,255,255,.56);box-shadow:-18px 34px 80px rgba(31,86,96,.12)}
body[data-route="home"] .contact-v4 .button.primary{color:#fff;border-color:#087f70;background:#087f70}

@media(max-width:700px){
  body[data-route="home"] .portal::before{inset:1rem}
  body[data-route]:not([data-route="home"]) main>.section{background:linear-gradient(160deg,var(--v5-page),var(--v5-page-alt))!important}
}