/* BioTwin Design System
   Source: design.md unified style
   Standard: Japanese minimal / medical-tech / calm trust
*/

:root{
  --bt-bg:#f7faf9;
  --bt-paper:#ffffff;
  --bt-ink:#101820;
  --bt-muted:#64716d;
  --bt-soft:#eef7f5;
  --bt-line:rgba(15,23,42,.10);
  --bt-mint:#14c6a4;
  --bt-deep:#020617;
  --bt-serif:"Noto Serif JP","Noto Serif TC","Yu Mincho","Hiragino Mincho ProN",serif;
  --bt-sans:"Noto Serif JP","Noto Serif TC","Yu Mincho","Hiragino Mincho ProN",serif;
}

/* Base */
body{
  font-family:var(--bt-sans) !important;
  color:var(--bt-ink) !important;
  background:
    radial-gradient(circle at 8% 0%,rgba(20,198,203,.08),transparent 32%),
    linear-gradient(180deg,#fbfdfc 0%,#f7faf9 48%,#eef7f5 100%) !important;
  -webkit-font-smoothing:antialiased !important;
  text-rendering:optimizeLegibility !important;
}

/* Typography — lighter title standard */
h1,
.hero h1{
  font-family:var(--bt-serif) !important;
  font-weight:400 !important;
  letter-spacing:-0.055em !important;
  line-height:1.14 !important;
  color:var(--bt-ink) !important;
}

h2,
.panel h2{
  font-family:var(--bt-serif) !important;
  font-weight:400 !important;
  letter-spacing:-0.045em !important;
  line-height:1.22 !important;
  color:var(--bt-ink) !important;
}

h3,
.panel h3{
  font-family:var(--bt-serif) !important;
  font-weight:400 !important;
  letter-spacing:-0.025em !important;
  line-height:1.35 !important;
  color:var(--bt-ink) !important;
}

p,
.panel p,
.hero p{
  font-family:var(--bt-sans) !important;
  font-weight:400 !important;
  color:var(--bt-muted) !important;
  line-height:1.95 !important;
}

/* Header standard */
.bt-light-header-standard{
  width:100% !important;
  position:sticky !important;
  top:0 !important;
  z-index:999 !important;
  background:rgba(255,255,255,.94) !important;
  backdrop-filter:blur(18px) !important;
  -webkit-backdrop-filter:blur(18px) !important;
  border-bottom:1px solid rgba(15,23,42,.08) !important;
}

.bt-header-inner{
  max-width:1680px !important;
  margin:0 auto !important;
  padding:12px 72px !important;
  min-height:78px !important;
  display:grid !important;
  grid-template-columns:320px 1fr 260px !important;
  align-items:center !important;
  gap:34px !important;
}

.bt-brand{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  gap:6px !important;
  text-decoration:none !important;
}

.bt-brand-logo-img{
  display:block !important;
  width:auto !important;
  height:42px !important;
  max-width:150px !important;
  object-fit:contain !important;
  background:transparent !important;
}

.bt-brand-subtitle{
  color:#111827 !important;
  font-size:13px !important;
  font-weight:400 !important;
  letter-spacing:.055em !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
  margin:0 !important;
}

.bt-nav-links{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:34px !important;
}

.bt-nav-links a{
  color:#273130 !important;
  text-decoration:none !important;
  font-size:15px !important;
  font-weight:400 !important;
  letter-spacing:.10em !important;
  white-space:nowrap !important;
}

.bt-nav-links a:hover{
  color:#0f766e !important;
}

.bt-nav-actions{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  gap:12px !important;
}

.bt-nav-actions a{
  min-width:86px !important;
  height:46px !important;
  border-radius:16px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  font-size:15px !important;
  font-weight:400 !important;
  letter-spacing:.06em !important;
  white-space:nowrap !important;
}

.bt-nav-actions .login{
  color:#374151 !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.12) !important;
}

.bt-nav-actions .signup{
  color:#a5473d !important;
  background:#fff7f4 !important;
  border:1px solid rgba(197,87,74,.32) !important;
  font-weight:500 !important;
}

/* Cards */
.tabs-shell,
.hero-card,
.image-card,
.mini-card{
  border-color:rgba(15,23,42,.08) !important;
}

.tab-button{
  font-weight:400 !important;
}

.tab-button.active{
  font-weight:500 !important;
}

/* Softer title sizing for About */
.about-page h1,
body.about-page h1{
  font-size:clamp(46px,5.4vw,78px) !important;
}

.about-page .panel h2,
body.about-page .panel h2{
  font-size:clamp(34px,3.8vw,56px) !important;
}

.about-page .panel h3,
body.about-page .panel h3{
  font-size:clamp(24px,2.2vw,30px) !important;
}

/* Mobile */
@media (max-width:1280px){
  .bt-header-inner{
    grid-template-columns:270px 1fr 230px !important;
    padding:12px 42px !important;
    gap:24px !important;
  }

  .bt-nav-links{
    gap:24px !important;
  }

  .bt-nav-links a{
    font-size:14px !important;
    letter-spacing:.07em !important;
  }
}

@media (max-width:980px){
  .bt-header-inner{
    grid-template-columns:1fr auto !important;
    padding:12px 22px !important;
    min-height:72px !important;
  }

  .bt-nav-links{
    display:none !important;
  }

  .bt-brand-logo-img{
    height:36px !important;
    max-width:132px !important;
  }

  .bt-brand-subtitle{
    font-size:12px !important;
  }

  .bt-nav-actions{
    gap:8px !important;
  }

  .bt-nav-actions a{
    min-width:74px !important;
    height:40px !important;
    border-radius:14px !important;
    font-size:13px !important;
  }

  h1,
  .hero h1{
    font-size:clamp(38px,10vw,52px) !important;
    line-height:1.18 !important;
  }

  h2,
  .panel h2{
    font-size:clamp(32px,8vw,44px) !important;
  }
}




/* BioTwin serif-only Japanese standard */
html,
body,
button,
input,
textarea,
select,
a,
p,
span,
div,
li,
strong,
h1,
h2,
h3,
h4,
h5,
h6,
.hero h1,
.hero p,
.panel h2,
.panel h3,
.panel p,
.quote,
.emphasis,
.tab-button,
.bt-nav-links a,
.bt-nav-actions a,
.bt-brand-subtitle,
.mini-card span,
.mini-card strong,
.mini-card p,
.founder-letter-title,
.founder-letter-subtitle,
.founder-letter-section-title,
.founder-letter-body p,
.founder-letter-pill span,
.founder-letter-pill strong,
.founder-letter-pill p{
  font-family:var(--bt-serif) !important;
  font-weight:400 !important;
}

.mini-card strong,
.founder-letter-pill strong,
.tab-button.active,
.bt-nav-actions .signup{
  font-weight:500 !important;
}
