/* NEO EARTH — Luxury editorial pass.
   Applies only to the existing six sections. The opening, reference artwork,
   corporate copy, page routes and form logic are never replaced. */
:root{
  --neo-obsidian:#06111d;
  --neo-ink:#0b1d2b;
  --neo-steel:#93b3c6;
  --neo-ice:#b5e9ff;
  --neo-glass-border:rgba(164,214,240,.23);
  --neo-hairline:rgba(123,195,232,.22);
}
.section-space{position:relative}
.section-space>.container{position:relative;z-index:2}
.section-space .display-heading{
  text-wrap:balance;
  letter-spacing:-.07em;
  text-shadow:0 2px 28px rgba(1,9,17,.06);
}
.section-space .section-ident{
  letter-spacing:.19em;
  font-size:10px;
}
.section-space .small-line{height:1px;background:linear-gradient(90deg,#48b6ef,#9ae8fc)}
/* Refined emphasis: ice rather than hard neon. */
.business .gradient-text,.contact .gradient-text{
  background:linear-gradient(105deg,#f8fcff 4%,#8de0ff 49%,#5ba8d4 100%);
  -webkit-background-clip:text;background-clip:text;
}
button,a{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:2px solid #95e3ff;outline-offset:4px}

/* VISION — the single light editorial chapter between darker worlds.
   Fine print-paper grid, a cool-white horizon, and high-contrast copy. */
#vision.intro{
  background-color:#f2f7fa;
  background-image:
    linear-gradient(180deg,#0b1827 0,rgba(13,33,52,.13) 62px,transparent 150px),
    radial-gradient(ellipse 75% 55% at 72% 36%,rgba(201,228,244,.55),transparent 79%),
    repeating-linear-gradient(90deg,rgba(31,90,132,.024) 0 1px,transparent 1px 124px),
    linear-gradient(160deg,#f9fcfe 12%,#e9f1f6 100%);
}
#vision .intro-grid{gap:clamp(40px,6vw,120px)}
#vision .intro-title{font-weight:800;line-height:1.33;letter-spacing:-.083em}
#vision .intro-copy-row{position:relative}
#vision .intro-copy-row p{color:#344f62;line-height:2.25}
#vision .intro-copy-row p:first-child{color:#142d40;font-size:clamp(15px,1.24vw,18px)}
#vision .intro-copy-row>div{border-top:1px solid rgba(47,100,132,.23);padding-top:24px}

#vision .intro-watermark{color:rgba(15,71,112,.05);letter-spacing:-.09em}

/* BUSINESS — a coherent collection, not 7 unrelated flat boxes. */
#business.business{
  background-color:#071421;
  background-image:
    radial-gradient(ellipse 58% 45% at 88% 10%,rgba(38,106,158,.27),transparent 75%),
    radial-gradient(ellipse 58% 46% at 7% 96%,rgba(21,65,105,.18),transparent 78%),
    linear-gradient(150deg,#091827 0%,#06111d 100%);
}
#business .section-heading-row{margin-block:clamp(34px,4vw,60px) clamp(44px,5.7vw,78px)}
#business .heading-aside{font-size:13px;color:#c1d5e4;line-height:2.1}
#business .service-grid{gap:clamp(13px,1.5vw,22px)}
#business .service-card{
  border:1px solid rgba(164,214,240,.25);
  border-radius:2px;
  background-color:#0c2031;
  box-shadow:
    inset 0 1px 0 rgba(232,249,255,.06),
    0 16px 40px rgba(0,5,15,.14);
  transition:transform .52s cubic-bezier(.2,.7,.2,1),
    border-color .38s ease, box-shadow .42s ease;
}
#business .service-primary{
  background-image:
    radial-gradient(ellipse 70% 75% at 76% 18%,rgba(72,161,221,.12),transparent 80%),
    linear-gradient(140deg,#112d43 0%,#081b2d 100%);
  min-height:438px;
}
#business .service-small{
  background-image:
    radial-gradient(circle at 77% 18%,rgba(65,172,225,.11),transparent 62%),
    linear-gradient(140deg,#10283c,#091725 100%);
}
#business .service-wide{
  background-image:
    radial-gradient(ellipse 45% 75% at 75% 28%,rgba(59,162,223,.2),transparent 92%),
    linear-gradient(125deg,#11283b,#071a2c);
}
#business .service-card .service-top{
  border-bottom:1px solid rgba(159,213,239,.14);
  padding-bottom:clamp(15px,1.7vw,23px);
  color:#bad8e8;
}
#business .service-card h3{
  font-weight:750;letter-spacing:-.055em;
  text-wrap:pretty;
}
#business .service-bottom p{color:#c2d5e0;line-height:2}
#business .service-en{color:#86a9bf;letter-spacing:.14em}
#business .mini-icon-illustrated{
  color:#9fe7ff;
  filter:drop-shadow(0 0 12px rgba(57,151,206,.08));
}
#business .business-cta{
  border:1px solid rgba(130,210,247,.4);
  border-radius:2px;
  background:
    radial-gradient(ellipse 40% 85% at 99% 0%,rgba(100,204,242,.16),transparent 84%),
    linear-gradient(115deg,#112d43,#081b2e);
  box-shadow:inset 0 1px rgba(222,248,255,.08),0 24px 70px rgba(0,4,12,.16);
}
#business .business-cta-link{
  min-height:57px;border-radius:2px;
  background:linear-gradient(125deg,#74d3f3,#39b4e4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
  color:#092035;
}
#business .business-bottom-note{border-top-color:rgba(147,209,240,.19)}

/* STRENGTH — number-led editorial layout, not bare text rows. */
#strength.strength{
  background:
    radial-gradient(ellipse 65% 75% at 95% 84%,rgba(37,119,164,.19),transparent 72%),
    linear-gradient(135deg,#102b40 0%,#081825 52%,#06131f 100%);
}
#strength .strength-heading .tiny-label{color:#88c8e6}
#strength .strength-heading h2{line-height:1.28}
#strength .strength-lead{color:#b6d1e0;line-height:2.2}
#strength .strength-list{border-top:1px solid rgba(162,224,248,.29)}
#strength .strength-item{
  position:relative;
  padding:clamp(24px,3vw,41px) 18px;
  border-top:0;
  border-bottom:1px solid rgba(154,207,234,.19);
  background:linear-gradient(90deg,rgba(91,181,225,.035),transparent 90%);
  transition:background .3s,border-color .3s;
}
#strength .strength-item:last-child{border-color:rgba(154,207,234,.19)}
#strength .strength-num{color:#8fe1ff;letter-spacing:.16em}
#strength .strength-item h3{font-size:clamp(20px,2vw,27px);line-height:1.45}
#strength .strength-item p{font-size:13px;color:#aecbda;line-height:2}
#strength .strength-arrow{color:#9ce4fc;opacity:.65;font-size:18px}
#strength .strength-deco{
  border-color:rgba(145,215,250,.11);
  opacity:.72;
}
@media(hover:hover) and (pointer:fine){
  #strength .strength-item:hover{
    padding-left:18px;background:linear-gradient(90deg,rgba(63,153,204,.095),transparent 84%);
    border-color:rgba(158,231,255,.35);
  }
  #business .service-card.reveal.is-visible:hover{
    transform:translate3d(0,-4px,0);
    border-color:rgba(149,219,248,.55);
    box-shadow:inset 0 1px rgba(240,252,255,.1),0 24px 55px rgba(0,7,20,.25);
  }
}

/* COMPANY — premium corporate publication aesthetic on a bright field. */
#company.company{
  background-color:#edf3f7;
  background-image:
    radial-gradient(ellipse 70% 60% at 6% 14%,rgba(255,255,255,.92),transparent 85%),
    repeating-linear-gradient(0deg,rgba(39,83,118,.018) 0 1px,transparent 1px 136px),
    linear-gradient(132deg,#f4f8fa,#e4eef3);
}
#company .company-heading .display-heading{
  font-weight:780;line-height:1.25;color:#142d43;
}
#company .company-heading .section-ident{color:#416f88}
#company .company-art{
  color:#245a79;
  opacity:.19;
}
#company .company-details{
  align-self:start;
  margin-top:clamp(30px,4vw,68px);
  padding:clamp(25px,3.2vw,45px);
  background:linear-gradient(148deg,rgba(255,255,255,.9),rgba(246,250,252,.54));
  border:1px solid rgba(76,125,154,.21);
  box-shadow:0 26px 86px rgba(25,66,95,.1),inset 0 1px rgba(255,255,255,.9);
  border-radius:2px;
}
#company .company-kicker{color:#386884;font-size:10px}
#company .company-details dl>div{
  grid-template-columns:minmax(75px,100px) minmax(0,1fr);
  gap:clamp(12px,1.7vw,28px);
  padding:24px 0;
  border-top-color:rgba(46,96,126,.17);
}
#company .company-details dt{color:#527487;font-weight:700}
#company .company-details dd{color:#1d384c;overflow-wrap:anywhere}
#company .company-orbit{border-color:rgba(31,97,133,.62)}

/* RECRUIT — a widescreen campaign shot with quiet glass details. */
#recruit.recruit{min-height:clamp(680px,72vw,840px)}
#recruit .recruit-image{filter:saturate(.82) brightness(.58) contrast(1.09)}
#recruit .recruit-overlay{
  background:
    radial-gradient(ellipse 37% 57% at 74% 32%,rgba(83,165,210,.1),transparent 85%),
    linear-gradient(90deg,rgba(4,14,27,.96) 4%,rgba(6,24,44,.81) 56%,rgba(4,18,34,.25)),
    linear-gradient(0deg,rgba(3,10,20,.78),transparent 60%);
}
#recruit.recruit::before{animation:none!important}
#recruit .recruit-inner{padding-block:clamp(24px,3vw,54px)}
#recruit .recruit-title{
  font-weight:780;line-height:1.27;
  text-shadow:0 14px 42px rgba(0,4,14,.28);
}
#recruit .recruit-title span{
  background:linear-gradient(100deg,#f4fcff,#a0e7fd 64%,#7ccbed);
  background-clip:text;-webkit-background-clip:text;color:transparent;
}
#recruit .recruit-copy{color:#e3eff6;line-height:2.2;max-width:520px}
#recruit .recruit-points span{
  border:1px solid rgba(186,226,245,.31);
  background:rgba(10,34,53,.44);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  box-shadow:inset 0 1px rgba(255,255,255,.07);
  color:#edf8fe;
}
#recruit .button-light{
  border-radius:2px;
  background:linear-gradient(118deg,#fff,#d8edf7);
  color:#0b263a;
  box-shadow:0 20px 50px rgba(1,10,22,.23),inset 0 1px rgba(255,255,255,.88);
  min-height:58px;
}
#recruit .recruit-english{color:rgba(211,239,255,.095);opacity:.75}

/* CONTACT — the last chapter feels like a tailored reception counter. */
#contact.contact{
  background-color:#07131e;
  background-image:
    radial-gradient(ellipse 62% 62% at 96% 11%,rgba(42,126,168,.17),transparent 74%),
    radial-gradient(ellipse 56% 57% at 2% 88%,rgba(26,98,148,.18),transparent 80%),
    linear-gradient(150deg,#0a1b2b,#050e18);
}
#contact .contact-intro .tiny-label{color:#96cde7}
#contact .contact-intro>p:not(.tiny-label){color:#bdceda;line-height:2.18}
#contact .contact-tags{gap:10px}
#contact .contact-tags span{
  color:#a9d1e3;border:1px solid rgba(154,216,247,.23);
  background:rgba(120,195,234,.03);
  padding:10px 14px;letter-spacing:.15em;
}
#contact .contact-panel{
  position:relative;
  border:1px solid rgba(157,219,246,.32);
  border-radius:2px;
  background:
    radial-gradient(ellipse 60% 43% at 100% 0,rgba(52,139,187,.12),transparent 80%),
    linear-gradient(155deg,rgba(20,48,69,.96),rgba(8,23,37,.96));
  box-shadow:0 32px 85px rgba(0,4,13,.29),inset 0 1px rgba(220,246,255,.06);
}
#contact .contact-panel::before{
  content:"";position:absolute;top:-1px;left:11%;right:11%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(184,232,254,.6),transparent);
  pointer-events:none;
}
#contact .panel-top{color:#d3eaf7;letter-spacing:.18em}
#contact .panel-dot{background:#8ddcf4;box-shadow:0 0 0 5px rgba(81,180,232,.08)}
#contact .form-row input:not([type=checkbox]),
#contact .form-row select,#contact .form-row textarea{
  background:rgba(4,18,31,.73);
  border:1px solid rgba(116,171,204,.35);
  border-radius:2px;
  min-height:48px;
  font-size:16px; /* prevents automatic iOS zoom */
}
#contact .form-row textarea{min-height:120px;resize:vertical}
#contact .form-row input:focus,#contact .form-row select:focus,
#contact .form-row textarea:focus{
  border-color:#92dfff;
  box-shadow:0 0 0 2px rgba(89,179,224,.13);
  outline:none;
}
#contact .form-submit{
  border-radius:2px;
  background:linear-gradient(115deg,#8de1fa,#47b6e3);
  color:#09283c;
  box-shadow:inset 0 1px rgba(255,255,255,.33);
}
#contact .contact-note{color:#bbd0dd;line-height:2}
#contact .form-footnote{color:#aec8d8}

/* Rhythm and readability: polish without changing layout structure. */
@media(max-width:900px){
  #vision .intro-grid{gap:28px}
  #company .company-details{margin-top:0}
  #recruit.recruit{min-height:670px}
  #contact .contact-panel{padding:clamp(22px,4.2vw,34px)}
}
@media(max-width:640px){
  .section-space{padding-block:clamp(92px,16vw,118px)}
  .section-space .display-heading{
    font-size:clamp(2.25rem,9.5vw,3.55rem);
    line-height:1.33;
  }
  #vision.intro{
    background-image:linear-gradient(180deg,#0b1827 0,rgba(13,33,52,.15) 47px,transparent 108px),
      radial-gradient(ellipse at 70% 38%,rgba(201,228,244,.38),transparent 80%),
      linear-gradient(160deg,#f9fcfe,#e9f1f6);
  }
  #vision .intro-copy-row>div{padding-top:18px}
  #business .service-grid{gap:12px}
  #business .service-primary{min-height:370px}
  #business .service-card .service-top{padding-bottom:12px}
  #business .service-small{min-height:288px}
  #business .service-small .service-en{letter-spacing:.02em}
  #strength .strength-item{padding:28px 12px}
  #company .company-heading{min-height:auto}
  #company .company-art{opacity:.13}
  #company .company-details{padding:24px 20px;margin-top:34px}
  #company .company-details dl>div{
    grid-template-columns:minmax(63px,75px) minmax(0,1fr);gap:13px;
  }
  #recruit.recruit{min-height:660px}
  #recruit .recruit-title{font-size:clamp(2.8rem,10vw,4.4rem)}
  #recruit .recruit-points span{font-size:10px}
  #contact .contact-panel{padding:24px 18px}
  #contact .contact-tags span{font-size:9px;padding:9px 12px}
}
@media(prefers-reduced-motion:reduce){
  #business .service-card,
  #strength .strength-item,
  #recruit .recruit-image{transition:none!important;animation:none!important}
}
