/* =========================================================
   SIMTECH NEW LIFE CIVILIZATION
   Bright Life Theme — shared by every page in /newlife/
   ========================================================= */
:root{
  --accent:#2e9b6f !important;
  --ivory:#fffdf4;
  --cream:#fff4cc;
  --paper:rgba(255,255,255,.90);
  --forest:#173f35;
  --green:#2e9b6f;
  --jade:#47b88a;
  --sky:#49a7d8;
  --gold:#f2b85b;
  --coral:#e98272;
  --muted-life:#58726b;
  --life-line:rgba(46,155,111,.20);
  --life-shadow:0 18px 48px rgba(23,63,53,.09);
}

html,body{
  background:var(--ivory) !important;
  color:var(--forest) !important;
}
body{
  min-height:100%;
  background-image:
    linear-gradient(180deg,rgba(255,253,244,.18),rgba(255,253,244,.52)),
    url('assets/hero-life-dawn.png') !important;
  background-size:cover !important;
  background-position:center top !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}
body::before{
  background:
    radial-gradient(circle at 18% 22%,rgba(242,184,91,.24),transparent 29%),
    radial-gradient(circle at 82% 28%,rgba(73,167,216,.13),transparent 31%),
    linear-gradient(145deg,rgba(255,253,244,.96),rgba(238,249,245,.82)) !important;
  opacity:1 !important;
}
body::after{
  background-image:
    linear-gradient(rgba(46,155,111,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(73,167,216,.03) 1px,transparent 1px) !important;
  background-size:56px 56px !important;
  opacity:.42 !important;
}

a{color:inherit}
h1,h2,h3,h4,strong,.brand{color:var(--forest) !important;text-shadow:none !important}
p,li,small,.subtitle{color:var(--muted-life) !important}
.kicker,.eyebrow,.card b,.ok{color:var(--green) !important}
h1 span,h1 .ko{
  background:linear-gradient(90deg,#157158,var(--jade),var(--sky)) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
}

.hero{
  background:
    linear-gradient(180deg,rgba(255,253,244,.18),rgba(255,253,244,.72)),
    radial-gradient(ellipse at 20% 62%,rgba(242,184,91,.28),transparent 30%),
    linear-gradient(162deg,transparent 57%,rgba(73,167,216,.09) 57.2% 61%,transparent 61.2%),
    linear-gradient(168deg,transparent 62%,rgba(71,184,138,.11) 62.2% 68%,transparent 68.2%) !important;
}
.hero::after{background:radial-gradient(circle,rgba(242,184,91,.18),transparent 68%) !important}

.nav a,.site-nav a{
  color:var(--forest) !important;
  border-color:rgba(46,155,111,.25) !important;
  background:rgba(255,255,255,.74) !important;
  box-shadow:0 5px 16px rgba(23,63,53,.05) !important;
}
.nav a:hover,.nav a.active,.site-nav a:hover,.site-nav a.active{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,var(--green),var(--sky)) !important;
  box-shadow:0 9px 24px rgba(46,155,111,.20) !important;
}

.btn,.btn.ghost{
  color:var(--forest) !important;
  border-color:rgba(46,155,111,.30) !important;
  background:rgba(255,255,255,.82) !important;
  box-shadow:0 8px 24px rgba(23,63,53,.07) !important;
}
.btn.primary,.primary.btn,.btns .primary{
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(135deg,var(--green),var(--sky)) !important;
  box-shadow:0 10px 28px rgba(46,155,111,.22) !important;
}

.quick,.section,.card,.box,.panel,.item,.step,.note,.notice,.hero-box,
.content-card,.principle-card,.field-card,.charter-card,.quote-card,
.list-grid>div,.timeline>div{
  color:var(--forest) !important;
  border-color:var(--life-line) !important;
  background:var(--paper) !important;
  box-shadow:var(--life-shadow) !important;
}
.quick a{
  color:var(--forest) !important;
  border-color:var(--life-line) !important;
  background:transparent !important;
}
.quick a:hover{background:rgba(71,184,138,.09) !important}
.quick small,.card p,.item p,.newsitem p,.schedule p{color:var(--muted-life) !important}
.card:nth-child(4n+1),.box:nth-child(4n+1){background:linear-gradient(150deg,#fff,#f3fbf7) !important}
.card:nth-child(4n+2),.box:nth-child(4n+2){background:linear-gradient(150deg,#fff,#f4faff) !important}
.card:nth-child(4n+3),.box:nth-child(4n+3){background:linear-gradient(150deg,#fff,#fff9eb) !important}
.card:nth-child(4n),.box:nth-child(4n){background:linear-gradient(150deg,#fff,#fff6f3) !important}

.newsitem,.schedule,.item,.step{border-color:var(--life-line) !important}
.thumb{background:linear-gradient(135deg,var(--jade),var(--sky)) !important}
.date,.num{
  background:linear-gradient(145deg,#eff9f4,#fff6d9) !important;
  color:var(--green) !important;
  border-color:var(--life-line) !important;
}
code,pre{
  color:#145f4a !important;
  background:#eef8f4 !important;
  border:1px solid var(--life-line) !important;
}
table{background:rgba(255,255,255,.86) !important;color:var(--forest) !important}
th{background:#eaf7f1 !important;color:#145f4a !important}
td,th{border-color:var(--life-line) !important}
input,textarea,select{
  color:var(--forest) !important;
  background:#fff !important;
  border-color:rgba(46,155,111,.30) !important;
}

.visual{
  isolation:isolate !important;
  filter:none !important;
  overflow:visible !important;
}
.visual::before{
  inset:-12% !important;
  background:
    radial-gradient(circle at 50% 46%,rgba(255,213,91,.58) 0 14%,rgba(71,184,138,.28) 35%,rgba(73,167,216,.18) 52%,transparent 72%) !important;
  filter:blur(13px) !important;
  opacity:1 !important;
}
.visual::after{
  inset:auto !important;
  left:50% !important;
  top:50% !important;
  bottom:auto !important;
  width:min(406px,86%) !important;
  max-width:none !important;
  height:auto !important;
  aspect-ratio:1 / 1 !important;
  transform:translate(-50%,-50%) !important;
  border:3px solid rgba(242,184,91,.82) !important;
  border-radius:50% !important;
  box-shadow:
    0 0 0 8px rgba(255,255,255,.72),
    0 18px 50px rgba(23,112,82,.23),
    0 0 38px rgba(242,184,91,.34) !important;
}
.visual .blend-image{
  inset:auto !important;
  left:50% !important;
  top:50% !important;
  width:min(390px,82%) !important;
  height:auto !important;
  aspect-ratio:1 / 1 !important;
  transform:translate(-50%,-50%) !important;
  background-image:url('../images/nowLife.png') !important;
  background-size:contain !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  border-radius:50% !important;
  mix-blend-mode:normal !important;
  filter:saturate(1.24) contrast(1.08) brightness(1.01) drop-shadow(0 20px 34px rgba(34,125,91,.24)) !important;
  opacity:1 !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

.nl-footer{
  color:var(--muted-life) !important;
  border-color:var(--life-line) !important;
  background:rgba(255,255,255,.56) !important;
}
.nl-copy,.nl-foot-links a,.nl-foot-social a{color:var(--muted-life) !important}
.nl-foot-social a{border-color:var(--life-line) !important;background:#fff !important}
.nl-foot-links a:hover,.nl-foot-social a:hover{color:var(--green) !important}

@media(max-width:640px){
  body{background-attachment:scroll !important}
  .quick,.section,.card,.box,.panel{box-shadow:0 10px 28px rgba(23,63,53,.07) !important}
}

/* LIFE_RECALL_AUTO_EVOLUTION_GEN03 */
.auto-evolution-note{max-width:1000px;margin:0 auto 48px;padding:24px 26px;border:1px solid rgba(24,214,167,.35);border-radius:18px;background:rgba(24,214,167,.06)}
.auto-evolution-note h2{margin:0 0 12px;font-size:clamp(22px,3vw,30px)}
.auto-evolution-note p{margin:0;color:rgba(255,255,255,.78);line-height:1.75}

/* =========================================================
   AUTONOMOUS TYPOGRAPHY BALANCE GEN-04
   목적: 페이지별 과대 글꼴을 공통 비례 체계로 자동 보정
   ========================================================= */
:root{
  --type-display:clamp(36px,3.85vw,60px);
  --type-display-wide:clamp(38px,4.1vw,64px);
  --type-subdisplay:clamp(22px,2vw,29px);
  --type-lead:clamp(16px,1.25vw,20px);
  --type-section:clamp(23px,2.25vw,30px);
  --type-card-title:clamp(18px,1.45vw,21px);
  --type-body:16px;
}
html{font-size:16px !important}
body{
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
  line-height:1.62 !important;
}
.brand{
  font-size:16px !important;
  letter-spacing:.27em !important;
}
.brand-row{margin-bottom:20px !important}
.nav{
  gap:10px !important;
  margin-bottom:44px !important;
}
.nav a,.site-nav a{
  padding:11px 13px !important;
  font-size:14px !important;
  line-height:1.25 !important;
}
.hero{
  min-height:auto !important;
  padding-top:22px !important;
  padding-bottom:38px !important;
}
.hero-box{
  max-width:900px !important;
  margin-top:38px !important;
  margin-bottom:22px !important;
}
.hero-grid{
  grid-template-columns:minmax(0,1fr) minmax(370px,.78fr) !important;
  gap:42px !important;
}
h1,
.hero h1,
main.wrap>h1{
  font-size:var(--type-display) !important;
  line-height:1.12 !important;
  letter-spacing:-.035em !important;
  margin-bottom:16px !important;
  text-wrap:balance !important;
}
.hero-grid h1{font-size:var(--type-display-wide) !important}
h1 span,
h1 .ko{
  font-size:var(--type-subdisplay) !important;
  line-height:1.28 !important;
  letter-spacing:-.025em !important;
  margin-top:11px !important;
}
.kicker,.eyebrow{
  font-size:13px !important;
  line-height:1.3 !important;
  letter-spacing:.28em !important;
  margin-bottom:15px !important;
}
.subtitle,.lead{
  max-width:780px !important;
  font-size:var(--type-lead) !important;
  line-height:1.72 !important;
  font-weight:650 !important;
}
.hero-box .subtitle{max-width:760px !important}
.actions{gap:11px !important;margin-top:24px !important}
.btn,.actions .btn{
  min-height:46px !important;
  padding:11px 19px !important;
  font-size:14px !important;
  line-height:1.2 !important;
}
.section{padding:25px !important}
.section h2,.note h2,.panel h2{font-size:var(--type-section) !important;line-height:1.3 !important}
.card{padding:20px !important}
.card h2,.card h3,.step h3{font-size:var(--type-card-title) !important;line-height:1.38 !important}
.card p,.card li,.section p,.step p,.note p,.item p{
  font-size:var(--type-body) !important;
  line-height:1.68 !important;
}
.visual{min-height:390px !important}
.visual::after{width:min(350px,82%) !important}
.visual .blend-image{width:min(336px,78%) !important}

@media(max-width:1100px){
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(310px,.68fr) !important;gap:30px !important}
  .visual{min-height:340px !important}
}
@media(max-width:760px){
  :root{
    --type-display:clamp(32px,9.2vw,42px);
    --type-display-wide:clamp(34px,9.5vw,44px);
    --type-subdisplay:clamp(20px,5.7vw,25px);
    --type-lead:16px;
    --type-section:23px;
    --type-card-title:19px;
    --type-body:15px;
  }
  .brand{font-size:13px !important;letter-spacing:.17em !important}
  .brand-row{margin-bottom:15px !important}
  .nav{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:7px !important;margin-bottom:30px !important}
  .nav a,.site-nav a{padding:10px 7px !important;font-size:13px !important;white-space:normal !important}
  .hero{padding:16px 0 28px !important}
  .hero-box{margin:26px auto 16px !important}
  .hero-grid{grid-template-columns:1fr !important;gap:18px !important}
  .hero-grid .visual{display:none !important}
  h1,.hero h1,main.wrap>h1{letter-spacing:-.045em !important}
  .subtitle,.lead{max-width:100% !important}
  .actions{margin-top:20px !important}
  .btn,.actions .btn{min-height:43px !important;padding:10px 15px !important;font-size:13px !important}
  .section{padding:20px !important}
  .card{padding:18px !important}
}
@media(max-width:390px){
  .nav{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  h1 span,h1 .ko{font-size:19px !important}
}
