*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:76px}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Noto Sans JP",Arial,sans-serif;color:#0a1d4a;background:#fff;line-height:1.8;letter-spacing:.02em}a{text-decoration:none;color:inherit}img{max-width:100%}.container{width:min(1160px,calc(100% - 80px));margin:auto}.header{height:76px;padding:0 max(40px,calc((100vw - 1160px)/2));display:flex;align-items:center;position:sticky;top:0;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);z-index:30;border-bottom:1px solid #dfe6ee}.logo{width:140px;margin-right:auto}.logo img{display:block}.header nav{display:flex;align-items:center;gap:34px;font-size:11px;font-weight:700}.contact{background:#061c3e;color:white;border-radius:24px;padding:10px 20px}.contact b{margin-left:15px}.menu{display:none}.hero{height:650px;position:relative;overflow:hidden;background:#061b3b;color:#fff}.night{position:absolute;inset:0;background-color:#071d40;background-image:radial-gradient(circle,#b7c9de 0 1px,transparent 1.2px),radial-gradient(circle,#6f8ba8 0 .8px,transparent 1px);background-size:79px 79px,131px 131px;background-position:10px 17px,41px 56px;opacity:.75}.earth{position:absolute;width:1050px;height:540px;right:-80px;bottom:-345px;border-radius:50% 50% 0 0/85% 85% 0 0;background:radial-gradient(ellipse at 56% 25%,#80c3f0 0 1%,transparent 2%),radial-gradient(ellipse at 48% 32%,#4789bd 0 5%,transparent 6%),radial-gradient(ellipse at 50% 42%,#174e7c,#092b53 50%,#03152c 74%);box-shadow:0 -4px 28px #6bb7ed99,0 -20px 90px #2275b755}.earth:before{content:"";position:absolute;inset:5%;border-radius:50%;border-top:1px solid #83c7ef88}.hero-copy{position:relative;z-index:2;padding-top:95px}.label{font-size:11px;font-weight:700;letter-spacing:.14em;margin:0 0 20px}.label:after{content:"";display:inline-block;width:32px;height:1px;background:currentColor;margin-left:12px;vertical-align:middle;opacity:.5}.hero h1{font-size:42px;line-height:1.45;letter-spacing:.045em;font-weight:600;margin:0 0 24px}.copy,.bodycopy{font-size:12px;line-height:2}.buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}.buttons a{background:white;color:#0a1d4a;border:1px solid #d5dde7;padding:12px 18px;font-size:10px;font-weight:700}.buttons b{margin-left:18px}.hero-word{position:absolute;z-index:2;right:max(50px,calc((100vw - 1160px)/2));top:120px;font-size:10px;line-height:1.65;letter-spacing:.18em}.block{padding:180px 0}.block h2{font-size:30px;line-height:1.55;margin:0 0 25px;font-weight:650}.dark{color:#0a1d4a}.two{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.photo{min-height:360px;position:relative;overflow:hidden;background:#cdd9e4}.photo:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#eff5f9,#7791aa)}.photo span{position:absolute;bottom:18px;left:20px;font-size:9px;letter-spacing:.18em;color:white}.office:after{content:"";position:absolute;inset:12% 7% 0;background:repeating-linear-gradient(90deg,transparent 0 21%,#0a2342 21.3% 22%),linear-gradient(0deg,#132c46 0 9%,transparent 9%);opacity:.55}.problem-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:45px}.problem-grid div{background:#f0f4f7;min-height:95px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:10px;font-weight:700;padding:12px}.conclusion{margin:100px auto 0;text-align:center;font-size:17px;display:flex;flex-direction:column;align-items:center;gap:18px}.conclusion i{display:block;width:1px;height:25px;background:#8291a5}.model{position:relative;overflow:hidden;background:#061b3b;color:#fff}.wave{position:absolute;inset:0;opacity:.23;background:repeating-radial-gradient(ellipse at 20% 100%,transparent 0 10px,#3c91d4 11px 12px,transparent 13px 21px)}.model .container{position:relative}.diagram{width:min(800px,100%);margin:65px auto 0;display:grid;grid-template-columns:1fr 120px 1fr;gap:28px;align-items:center}.customer{grid-column:1/4;justify-self:center;background:#f1f5f8;color:#0a1d4a;padding:18px 70px;font-size:12px;font-weight:700}.model-card{background:#f1f5f8;color:#0a1d4a;padding:28px 34px;min-height:210px}.model-card h3{font-size:13px}.model-card li{font-size:11px}.relation{text-align:center;font-size:16px}.relation span{display:block;font-size:10px;margin:10px 0}.model-note{text-align:center;font-size:11px;margin:45px 0 0}.business-head{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.documents{min-height:270px;background:linear-gradient(135deg,#edf4f8,#adc0d0)}.documents:after{content:"";position:absolute;width:55%;height:60%;right:12%;top:18%;background:#fff8;transform:rotate(-7deg);box-shadow:-30px 22px 0 #dbe5ed}.service-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:55px}.service-cards article,.achievement-grid article{background:#f2f6f9;padding:38px;position:relative}.service-cards h3{font-size:14px}.service-cards p,.achievement-grid p{font-size:11px}.service-cards article>b{position:absolute;right:25px;bottom:20px}.icon{font-size:30px}.partners{border-top:1px solid #edf1f5}.partners h2{font-size:24px}.partners li{font-size:11px}.handshake{min-height:390px;background:linear-gradient(135deg,#b7c6d4,#526e8a)}.handshake:after{content:"";position:absolute;width:46%;height:28%;left:27%;top:38%;background:#e5c1ad;border-radius:45% 45% 30% 30%;transform:rotate(-8deg);box-shadow:-110px -18px 0 15px #102c52,110px 18px 0 15px #0a244a}.outline a{background:white}.about{background:#f6f8fa}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}.about dl{margin:20px 0}.about dl div{display:grid;grid-template-columns:110px 1fr;padding:8px 0}.about dt,.about dd{font-size:11px;margin:0}.technology{position:relative;overflow:hidden}.network{position:absolute;right:0;top:20%;width:50%;height:60%;opacity:.3;background:radial-gradient(circle at 20% 50%,#287acb 0 3px,transparent 4px),radial-gradient(circle at 50% 25%,#287acb 0 3px,transparent 4px),radial-gradient(circle at 70% 70%,#287acb 0 3px,transparent 4px),linear-gradient(25deg,transparent 49.8%,#287acb 50%,transparent 50.2%)}.technology .bodycopy{max-width:580px}.achievements{padding-top:150px;padding-bottom:170px}.achievement-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px}.achievement-grid h2{font-size:20px}.achievement-grid a{float:right}footer{background:#061a38;color:white;padding:110px 0 50px}.footer-main{display:grid;grid-template-columns:1.4fr 1fr 1fr .8fr;gap:65px;align-items:start}.footer-brand img{width:150px;filter:brightness(0) invert(1)}.footer-brand p{font-size:10px}.footer-main nav{display:flex;flex-direction:column;gap:8px;font-size:10px}.footer-contact{background:#fff;color:#0a1d4a;padding:13px 20px;text-align:center;font-size:10px}.footer-bottom{border-top:1px solid #ffffff33;margin-top:85px;padding-top:28px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.08em}.top{position:fixed;right:24px;bottom:24px;width:46px;height:46px;border-radius:50%;background:#123d71;color:white;display:grid;place-items:center;opacity:0;visibility:hidden;transition:.3s;z-index:20}.top.show{opacity:1;visibility:visible}
@media(max-width:760px){html{scroll-padding-top:64px}.container{width:calc(100% - 36px)}.header{height:64px;padding:0 18px}.logo{width:115px}.header nav{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;padding:15px 18px 25px;flex-direction:column;align-items:stretch;gap:0}.header nav.open{display:flex}.header nav a{padding:12px 0}.header .contact{margin-top:8px;padding:12px 16px}.menu{display:block;width:40px;height:40px;border:0;background:none;position:relative}.menu i{position:absolute;width:24px;height:1px;background:#0a1d4a;left:8px;top:15px}.menu i+ i{top:24px}.hero{height:650px}.hero-copy{padding-top:70px}.hero h1{font-size:31px}.hero .copy{font-size:10px;max-width:80%}.hero-word{display:none}.earth{width:680px;height:400px;right:-330px;bottom:-245px}.block{padding:100px 0}.block h2{font-size:24px}.two,.business-head,.about-grid{grid-template-columns:1fr;gap:45px}.problem-grid{grid-template-columns:1fr 1fr}.conclusion{margin-top:65px;font-size:15px}.diagram{grid-template-columns:1fr;gap:12px}.customer{grid-column:auto;width:100%;text-align:center;padding:18px}.relation{padding:8px}.service-cards,.achievement-grid{grid-template-columns:1fr}.partners{padding-top:115px;padding-bottom:115px}.about,.technology{padding-top:115px;padding-bottom:115px}.footer-main{grid-template-columns:1fr 1fr}.footer-brand,.footer-contact{grid-column:1/3}.footer-bottom{margin-top:60px;gap:25px;flex-direction:column}.photo{min-height:280px}}


/* ===== v4 tuning: tighter vertical rhythm + one-step larger type ===== */

/* Section rhythm: v3 180px -> 120px */
.block{padding:120px 0}
.achievements{padding-top:110px;padding-bottom:120px}

/* Global typography up one notch */
body{font-size:16px}
.label{font-size:13px}
.hero h1{font-size:46px}
.copy,.bodycopy{font-size:14px}
.hero-word{font-size:11px}
.buttons a{font-size:12px}
.block h2{font-size:34px}
.problem-grid div{font-size:12px}
.conclusion{font-size:19px}

.customer{font-size:14px}
.model-card h3{font-size:15px}
.model-card li{font-size:13px}
.relation span{font-size:12px}
.model-note{font-size:13px}

.service-cards h3{font-size:16px}
.service-cards p,.achievement-grid p{font-size:13px}
.partners h2{font-size:27px}
.partners li{font-size:13px}

.about dt,.about dd{font-size:13px}
.achievement-grid h2{font-size:23px}

/* Navigation/footer also slightly easier to read */
.header nav{font-size:12px}
.footer-brand p{font-size:12px}
.footer-main nav{font-size:12px}
.footer-contact{font-size:12px}
.footer-bottom{font-size:10px}

/* Keep important internal spacing generous without huge section gaps */
.conclusion{margin-top:70px}
.business-head{gap:70px}
.service-cards{margin-top:45px}
.partners{padding-top:130px;padding-bottom:130px}
.about{padding-top:130px;padding-bottom:130px}
.technology{padding-top:130px;padding-bottom:130px}
footer{padding-top:90px;padding-bottom:45px}
.footer-bottom{margin-top:65px}

/* Mobile */
@media(max-width:760px){
  .block{padding:78px 0}
  .achievements{padding-top:78px;padding-bottom:85px}
  .partners,.about,.technology{padding-top:85px;padding-bottom:85px}
  .hero h1{font-size:34px}
  .hero .copy{font-size:12px}
  .block h2{font-size:27px}
  .label{font-size:12px}
  .bodycopy{font-size:13px}
  .problem-grid div{font-size:11px}
  .conclusion{font-size:16px;margin-top:55px}
  footer{padding-top:70px}
}


/* ===== v5: generated visual assets ===== */
.photo{background-position:center;background-repeat:no-repeat;background-size:cover}
.photo:before,.photo:after{display:none!important}

/* 社会課題 */
.office{
  background-image:
    linear-gradient(rgba(5,25,55,.04),rgba(5,25,55,.04)),
    url("img/issues-office.png");
  background-position:center center;
}

/* セルダン・モデル */
.model{
  background-color:#061b3b;
  background-image:
    linear-gradient(rgba(4,24,54,.20),rgba(4,24,54,.20)),
    url("img/model-wave.png");
  background-size:cover;
  background-position:center center;
}
.model .wave{display:none}

/* セルダンの事業 */
.documents{
  background-image:url("img/business-finance.png");
  background-position:center center;
}

/* セルダン・パートナーズ */
.handshake{
  background-image:
    linear-gradient(rgba(5,24,51,.08),rgba(5,24,51,.08)),
    url("img/partners.png");
  background-position:center center;
}

/* AI・テクノロジー */
.technology{
  background-color:#f8fbfd;
  background-image:url("img/technology.png");
  background-size:cover;
  background-position:center center;
}
.technology .network{display:none}

/* Keep images locked to the designed boxes instead of changing layout */
.office{min-height:360px}
.documents{min-height:270px}
.handshake{min-height:390px}

/* FV: use generated space artwork when available, with safe fallback */
.hero .night,.hero .earth{transition:none}

.hero{
  background:#061b3b url("img/hero-space.png") center center/cover no-repeat;
}
.hero .night,.hero .earth{display:none}

@media(max-width:760px){
  .office,.documents,.handshake{min-height:280px}
  .technology{background-position:62% center}
  .model{background-position:center center}
}


/* ===== v6: refined hover interactions ===== */
:root{
  --motion: cubic-bezier(.22,.61,.36,1);
}

/* Header / hero / footer buttons */
.buttons a,
.header .contact,
.footer-contact{
  position:relative;
  overflow:hidden;
  transition:
    color .38s var(--motion),
    background-color .38s var(--motion),
    border-color .38s var(--motion),
    box-shadow .38s var(--motion),
    transform .38s var(--motion);
}

.buttons a:hover{
  color:#fff;
  background:#0a1d4a;
  border-color:#0a1d4a;
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(6,27,59,.12);
}

.header .contact:hover{
  background:#123d71;
  transform:translateY(-1px);
  box-shadow:0 7px 18px rgba(6,27,59,.16);
}

.footer-contact:hover{
  background:#eaf1f7;
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(0,0,0,.14);
}

/* Arrow drift */
.buttons a b,
.header .contact b{
  display:inline-block;
  transition:transform .38s var(--motion);
}
.buttons a:hover b,
.header .contact:hover b{
  transform:translateX(5px);
}

/* Text navigation: understated underline */
.header nav > a:not(.contact),
.footer-main nav a{
  position:relative;
  transition:opacity .3s var(--motion);
}
.header nav > a:not(.contact)::after,
.footer-main nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-4px;
  width:100%;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .38s var(--motion);
  opacity:.55;
}
.header nav > a:not(.contact):hover::after,
.footer-main nav a:hover::after{
  transform:scaleX(1);
  transform-origin:left center;
}

/* Service/result cards: tiny lift only */
.service-cards article,
.achievement-grid article{
  transition:
    transform .42s var(--motion),
    box-shadow .42s var(--motion),
    background-color .42s var(--motion);
}
.service-cards article:hover,
.achievement-grid article:hover{
  transform:translateY(-5px);
  background:#f7fafc;
  box-shadow:0 14px 34px rgba(7,31,66,.08);
}
.service-cards article > b,
.achievement-grid article > a{
  display:inline-block;
  transition:transform .38s var(--motion);
}
.service-cards article:hover > b,
.achievement-grid article:hover > a{
  transform:translateX(5px);
}

/* Back-to-top */
.top{
  transition:
    opacity .3s var(--motion),
    visibility .3s var(--motion),
    transform .35s var(--motion),
    background-color .35s var(--motion);
}
.top:hover{
  transform:translateY(-4px);
  background:#1a4d88;
}

/* Avoid hover animation on touch devices */
@media (hover:none){
  .buttons a:hover,
  .header .contact:hover,
  .footer-contact:hover,
  .service-cards article:hover,
  .achievement-grid article:hover,
  .top:hover{
    transform:none;
    box-shadow:none;
  }
}

/* Accessibility */
@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
  }
}


/* ===== v7: 16px body base + mobile navigation polish ===== */

/* Clickable-looking cards */
.service-cards article,
.achievement-grid article{
  cursor:pointer;
}

/* Desktop typography: body copy is now 16px base */
body{font-size:16px}
.copy,
.bodycopy{font-size:16px;line-height:2}
.service-cards p,
.achievement-grid p{font-size:16px;line-height:1.9}
.model-card li,
.partners li,
.about dt,
.about dd{font-size:15px}
.model-note{font-size:15px}
.service-cards h3{font-size:18px}
.achievement-grid h2{font-size:25px}
.buttons a{font-size:13px}
.header nav{font-size:13px}

/* Mobile nav: animate instead of display:none/display:flex */
@media(max-width:760px){
  body{font-size:16px}
  .header{overflow:visible}

  .header nav{
    display:flex;
    position:absolute;
    top:64px;
    left:0;
    right:0;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:12px 22px 26px;
    background:rgba(255,255,255,.98);
    backdrop-filter:blur(14px);
    border-bottom:1px solid #e1e7ee;
    box-shadow:0 15px 35px rgba(5,25,55,.08);

    opacity:0;
    visibility:hidden;
    transform:translateY(-12px);
    pointer-events:none;
    transition:
      opacity .32s var(--motion),
      transform .38s var(--motion),
      visibility .32s var(--motion);
  }

  .header nav.open{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
    pointer-events:auto;
  }

  .header nav > a{
    opacity:0;
    transform:translateY(-6px);
    transition:
      opacity .28s var(--motion),
      transform .34s var(--motion),
      color .3s var(--motion);
  }
  .header nav.open > a{
    opacity:1;
    transform:translateY(0);
  }
  .header nav.open > a:nth-child(1){transition-delay:.05s}
  .header nav.open > a:nth-child(2){transition-delay:.09s}
  .header nav.open > a:nth-child(3){transition-delay:.13s}
  .header nav.open > a:nth-child(4){transition-delay:.17s}

  /* Hamburger -> X */
  .menu i{
    transition:
      transform .32s var(--motion),
      top .32s var(--motion),
      opacity .25s var(--motion);
  }
  .menu.open i:first-child{
    top:20px;
    transform:rotate(45deg);
  }
  .menu.open i:last-child{
    top:20px;
    transform:rotate(-45deg);
  }

  /* Mobile text sizes */
  .hero h1{font-size:36px;line-height:1.45}
  .hero .copy{font-size:16px;line-height:1.9;max-width:92%}
  .block h2{font-size:29px;line-height:1.55}
  .label{font-size:13px}
  .bodycopy{font-size:16px;line-height:1.95}
  .problem-grid div{font-size:14px}
  .model-card h3{font-size:17px}
  .model-card li{font-size:15px}
  .model-note{font-size:15px;line-height:1.9}
  .service-cards h3{font-size:19px}
  .service-cards p,
  .achievement-grid p{font-size:16px;line-height:1.9}
  .partners h2{font-size:27px}
  .partners li{font-size:15px}
  .about dt,.about dd{font-size:15px}
  .buttons a{font-size:14px;padding:14px 17px}
  .footer-brand p,
  .footer-main nav,
  .footer-contact{font-size:13px}
}


/* ===== v9 FINAL FV: approved TEXT-FREE starfield + small Earth ===== */
.hero{
  background:#06182f url("img/hero-space-final.png") center center / cover no-repeat !important;
  isolation:isolate;
}
.hero .night,
.hero .earth{
  display:none !important;
}
/* Gentle readability veil only — no artwork, text, or UI embedded in background */
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    rgba(2,16,37,.46) 0%,
    rgba(2,16,37,.25) 43%,
    rgba(2,16,37,.06) 76%,
    rgba(2,16,37,.02) 100%
  );
}
.hero::after{display:none !important}
.hero-copy,
.hero-word{
  position:relative;
  z-index:2;
}
@media(max-width:760px){
  .hero{
    background-position:62% center !important;
  }
  .hero::before{
    background:linear-gradient(
      90deg,
      rgba(2,16,37,.58) 0%,
      rgba(2,16,37,.28) 62%,
      rgba(2,16,37,.08) 100%
    );
  }
}


/* ===== v10: prevent awkward heading wrap ===== */
.nowrap-desktop{white-space:nowrap}

@media(max-width:760px){
  /* Allow natural wrapping on narrow phones rather than overflow */
  .nowrap-desktop{white-space:normal}
}


/* ===== v11: subtle living starfield ===== */
.twinkle-field{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none;
}
.twinkle-star{
  position:absolute;
  width:2px;
  height:2px;
  border-radius:50%;
  background:#fff;
  opacity:.18;
  box-shadow:0 0 5px rgba(190,220,255,.55);
  animation:starTwinkle var(--dur,7s) ease-in-out var(--delay,0s) infinite;
}
.twinkle-star.spark{
  width:3px;
  height:3px;
}
.twinkle-star.spark::before,
.twinkle-star.spark::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  background:rgba(225,240,255,.85);
  transform:translate(-50%,-50%) scale(.25);
  opacity:0;
  animation:sparkRay var(--dur,9s) ease-in-out var(--delay,0s) infinite;
}
.twinkle-star.spark::before{width:18px;height:1px}
.twinkle-star.spark::after{width:1px;height:18px}

@keyframes starTwinkle{
  0%,100%{opacity:.12;transform:scale(.75)}
  28%{opacity:.28;transform:scale(.9)}
  48%{opacity:.95;transform:scale(1.45)}
  62%{opacity:.32;transform:scale(.95)}
}
@keyframes sparkRay{
  0%,34%,66%,100%{opacity:0;transform:translate(-50%,-50%) scale(.25)}
  47%{opacity:.75;transform:translate(-50%,-50%) scale(1)}
  55%{opacity:.15;transform:translate(-50%,-50%) scale(.55)}
}

/* very faint atmospheric pulse over the lower-right Earth edge */
.earth-glow{
  position:absolute;
  z-index:1;
  pointer-events:none;
  right:-5%;
  bottom:-15%;
  width:58%;
  height:34%;
  border-radius:50%;
  opacity:.16;
  background:radial-gradient(ellipse at 55% 12%,
    rgba(111,194,255,.42) 0%,
    rgba(61,143,218,.16) 18%,
    rgba(20,77,137,0) 56%);
  filter:blur(12px);
  animation:earthBreath 10s ease-in-out infinite;
}
@keyframes earthBreath{
  0%,100%{opacity:.10;transform:scale(1)}
  50%{opacity:.22;transform:scale(1.015)}
}

/* HTML copy always stays above effects */
.hero-copy,.hero-word{z-index:3!important}

@media(max-width:760px){
  .earth-glow{width:85%;height:28%;right:-30%;bottom:-9%}
}
@media(prefers-reduced-motion:reduce){
  .twinkle-star,.twinkle-star::before,.twinkle-star::after,.earth-glow{
    animation:none!important;
  }
}


/* ===== v12: clearer twinkles + tapered sparkle rays ===== */
.twinkle-star{
  width:2.5px;
  height:2.5px;
  opacity:.24;
  box-shadow:
    0 0 5px rgba(220,238,255,.8),
    0 0 10px rgba(130,190,255,.28);
}
.twinkle-star.spark{
  width:3.5px;
  height:3.5px;
}
/* Replace rectangular cross-bars with tapered light rays */
.twinkle-star.spark::before,
.twinkle-star.spark::after{
  background:none;
  opacity:0;
}
.twinkle-star.spark::before{
  width:30px;
  height:3px;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(220,240,255,.10) 13%,
    rgba(230,245,255,.55) 39%,
    rgba(255,255,255,.95) 50%,
    rgba(230,245,255,.55) 61%,
    rgba(220,240,255,.10) 87%,
    transparent 100%
  );
  clip-path:polygon(0 50%,50% 0,100% 50%,50% 100%);
  filter:blur(.15px);
}
.twinkle-star.spark::after{
  width:3px;
  height:30px;
  background:linear-gradient(
    180deg,
    transparent 0%,
    rgba(220,240,255,.10) 13%,
    rgba(230,245,255,.55) 39%,
    rgba(255,255,255,.95) 50%,
    rgba(230,245,255,.55) 61%,
    rgba(220,240,255,.10) 87%,
    transparent 100%
  );
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  filter:blur(.15px);
}
@keyframes starTwinkle{
  0%,100%{opacity:.16;transform:scale(.72)}
  24%{opacity:.35;transform:scale(.9)}
  44%{opacity:1;transform:scale(1.7)}
  58%{opacity:.48;transform:scale(1.05)}
  76%{opacity:.22;transform:scale(.82)}
}
@keyframes sparkRay{
  0%,31%,67%,100%{opacity:0;transform:translate(-50%,-50%) scale(.18)}
  43%{opacity:.28;transform:translate(-50%,-50%) scale(.55)}
  49%{opacity:.92;transform:translate(-50%,-50%) scale(1)}
  57%{opacity:.22;transform:translate(-50%,-50%) scale(.62)}
}


/* ===== v13: scroll reveal + subtle image parallax ===== */
.reveal{
  opacity:0;
  transform:translate3d(0,28px,0);
  transition:
    opacity .82s cubic-bezier(.22,.61,.36,1),
    transform .82s cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--reveal-delay,0ms);
  will-change:opacity,transform;
}
.reveal.from-left{transform:translate3d(-38px,10px,0)}
.reveal.from-right{transform:translate3d(38px,10px,0)}
.reveal.scale-in{transform:translate3d(0,18px,0) scale(.975)}
.reveal.is-visible{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}

/* Cards can enter sequentially */
.reveal-stagger > *{
  opacity:0;
  transform:translate3d(0,24px,0);
  transition:
    opacity .72s cubic-bezier(.22,.61,.36,1),
    transform .72s cubic-bezier(.22,.61,.36,1);
}
.reveal-stagger.is-visible > *{opacity:1;transform:none}
.reveal-stagger.is-visible > *:nth-child(1){transition-delay:.05s}
.reveal-stagger.is-visible > *:nth-child(2){transition-delay:.14s}
.reveal-stagger.is-visible > *:nth-child(3){transition-delay:.23s}
.reveal-stagger.is-visible > *:nth-child(4){transition-delay:.32s}
.reveal-stagger.is-visible > *:nth-child(5){transition-delay:.41s}

/* Subtle real parallax on image panels. The element stays in place;
   only the background image position shifts a little. */
.parallax-photo{
  --parallax-y:0px;
  background-position:center calc(50% + var(--parallax-y)) !important;
  will-change:background-position;
}

/* Don't animate the FV copy on page load: keep first impression immediate. */
.hero .hero-copy,
.hero .hero-word{opacity:1!important;transform:none!important}

@media(max-width:760px){
  .reveal.from-left,
  .reveal.from-right{
    transform:translate3d(0,22px,0);
  }
  .reveal.is-visible{transform:none}
  .parallax-photo{background-position:center center!important}
}

@media(prefers-reduced-motion:reduce){
  .reveal,
  .reveal-stagger > *{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
  .parallax-photo{background-position:center center!important}
}


/* ===== v14: unified Seldon navy photo treatment ===== */
/* A very light brand-color veil makes photography feel like one visual system. */
.office,
.documents,
.handshake{
  background-color:#061b3b;
  background-blend-mode:multiply;
}

/* Keep it subtle: the image itself remains clearly visible. */
.office{
  background-image:
    linear-gradient(rgba(6,27,59,.09),rgba(6,27,59,.09)),
    url("img/issues-office.png") !important;
}
.documents{
  background-image:
    linear-gradient(rgba(6,27,59,.07),rgba(6,27,59,.07)),
    url("img/business-finance.png") !important;
}
.handshake{
  background-image:
    linear-gradient(rgba(6,27,59,.10),rgba(6,27,59,.10)),
    url("img/partners.png") !important;
}

/* Multiply can become too heavy on some browsers; normal blending keeps
   the overlay controlled while preserving the common navy cast. */
.office,
.documents,
.handshake{
  background-blend-mode:normal;
}


/* ===== v15: clearly visible Seldon navy color grade ===== */
/* Stronger than v14, while preserving highlight detail. */
.office{
  background-image:
    linear-gradient(rgba(6,27,59,.18),rgba(6,27,59,.18)),
    url("img/issues-office.png") !important;
}
.documents{
  background-image:
    linear-gradient(rgba(6,27,59,.20),rgba(6,27,59,.20)),
    url("img/business-finance.png") !important;
}
.handshake{
  background-image:
    linear-gradient(rgba(6,27,59,.18),rgba(6,27,59,.18)),
    url("img/partners.png") !important;
}

/* Slightly richer/cooler photographic finish */
.office,
.documents,
.handshake{
  filter:saturate(.92) contrast(1.03);
}


/* ===== latest: company-name origin section ===== */
.name-origin{
  background:#fff;
  border-top:1px solid #edf1f5;
}
.origin-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:90px;
  align-items:start;
}
.origin-copy{
  font-size:16px;
  line-height:2;
}
.origin-copy p{margin:0 0 28px}
.origin-closing{
  font-size:20px;
  line-height:1.9;
  font-weight:600;
  letter-spacing:.035em;
  color:#0a1d4a;
}
.company-link{
  display:inline-flex;
  align-items:center;
  gap:28px;
  margin-top:12px;
  padding:14px 22px;
  border:1px solid #cfd9e4;
  background:#fff;
  color:#0a1d4a;
  font-size:14px;
  font-weight:700;
  transition:
    color .38s var(--motion),
    background-color .38s var(--motion),
    border-color .38s var(--motion),
    box-shadow .38s var(--motion),
    transform .38s var(--motion);
}
.company-link b{
  display:inline-block;
  transition:transform .38s var(--motion);
}
.company-link:hover{
  color:#fff;
  background:#0a1d4a;
  border-color:#0a1d4a;
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(6,27,59,.12);
}
.company-link:hover b{transform:translateX(5px)}

@media(max-width:760px){
  .origin-grid{
    grid-template-columns:1fr;
    gap:36px;
  }
  .origin-copy{font-size:16px}
  .origin-closing{font-size:18px}
  .company-link{
    width:100%;
    justify-content:space-between;
    padding:15px 18px;
  }
}


/* ===== AI workflow: restored from wireframe ===== */
.ai-workflow{
  margin-top:72px;
}
.ai-workflow h3{
  margin:0 0 38px;
  color:#0a1d4a;
  font-size:26px;
  line-height:1.55;
  font-weight:600;
  letter-spacing:.02em;
}
.ai-flow{
  display:grid;
  grid-template-columns:1fr 42px 1fr 42px 1fr 42px 1fr;
  align-items:stretch;
}
.ai-flow-card{
  min-height:190px;
  padding:28px 26px;
  background:rgba(6,27,59,.065);
  border:1px solid rgba(6,27,59,.06);
}
.ai-flow-card h4{
  margin:0 0 24px;
  font-size:18px;
  line-height:1.4;
  color:#0a1d4a;
}
.ai-flow-card p{
  margin:0;
  font-size:15px;
  line-height:1.65;
}
.ai-flow-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#0a1d4a;
  font-size:20px;
  opacity:.5;
}
.ai-workflow-note{
  margin:30px 0 0;
  font-size:16px;
  line-height:1.9;
}

@media(max-width:760px){
  .ai-workflow{margin-top:52px}
  .ai-workflow h3{font-size:22px;margin-bottom:28px}
  .ai-flow{
    grid-template-columns:1fr;
    gap:0;
  }
  .ai-flow-card{
    min-height:0;
    padding:24px 22px;
  }
  .ai-flow-arrow{
    height:38px;
    transform:rotate(90deg);
  }
  .ai-workflow-note{font-size:16px}
}


/* ===== seldon.co.jp overrides ===== */
.header{height:88px}
html{scroll-padding-top:88px}
.header nav{gap:40px;font-size:13px;font-weight:500;letter-spacing:.08em}
.header nav > a:not(.contact),.header .contact{background:none;color:#0a1d4a;padding:0;border-radius:0;box-shadow:none;transform:none}
.header .contact:hover{background:none;box-shadow:none;transform:none}

.hero{height:760px}
.hero-copy{padding-top:150px}
.hero h1{margin-bottom:36px}
.hero-word{top:170px}

.block{padding:200px 0}
.issues .bodycopy{margin-bottom:0}
.problem-grid{margin-top:60px}
.problem-grid div{min-height:120px}
.conclusion{margin-top:140px;gap:26px}
.conclusion i{height:40px}
.business{border-top:1px solid #edf1f5}
.business-head{gap:100px}
.business .bodycopy{margin-top:10px}
.service-cards{margin-top:90px;gap:28px}
.service-cards article{padding:52px 48px 60px}
.block h2{margin-bottom:36px}
.two{gap:100px}

footer{padding-top:120px;padding-bottom:56px}
.footer-main{grid-template-columns:1.4fr 1fr .8fr}
.footer-bottom{margin-top:90px}

@media(max-width:760px){
  .header{height:64px}
  html{scroll-padding-top:64px}
  .header nav{
    position:static;flex-direction:row;gap:20px;padding:0;
    background:none;backdrop-filter:none;border:0;box-shadow:none;
    opacity:1;visibility:visible;transform:none;pointer-events:auto;font-size:12px;
  }
  .header nav > a{opacity:1;transform:none;padding:0}
  .hero{height:680px}
  .hero-copy{padding-top:90px}
  .block{padding:110px 0}
  .problem-grid{margin-top:40px}
  .problem-grid div{min-height:96px}
  .conclusion{margin-top:80px}
  .business-head,.two{gap:48px}
  .service-cards{margin-top:56px;gap:20px}
  .service-cards article{padding:36px 28px 44px}
  footer{padding-top:80px}
  .footer-bottom{margin-top:60px}
}
.ext-icon{display:inline-block;vertical-align:-1px;margin-left:6px}
.footer-contact .ext-icon{margin-left:10px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}