/* ============================================================
   Arxia — shared baseline stylesheet
   Shared baseline for current Arxia pages.
   Reusable foundation only (no page-unique homepage components).
   ============================================================ */

:root{
  --bg:#F5F2EB; --bg-elev:#EDE9DF; --bg-ink:#1A1814;
  --text:#1A1814; --text-2:#4A4640; --text-3:rgba(74,70,64,0.52);
  --accent:#85D5FF; --rule:#D8D2C4;
  --line:rgba(26,24,20,0.10); --line-strong:rgba(26,24,20,0.20);
  --ease:cubic-bezier(0.22,1,0.36,1);
  --f-display-en:'Fraunces','Iowan Old Style',Georgia,serif;
  --f-display-kr:'Noto Serif KR','Fraunces',Georgia,serif;
  --f-body-en:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --f-body-kr:'Pretendard',-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--f-body-kr);
  font-weight:300;
  line-height:1.78;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

::selection{ background:rgba(26,24,20,0.12); }

a{ color:inherit; text-decoration:none; }

img{ display:block; max-width:100%; }

.shell{ width:100%; max-width:1280px; margin:0 auto; padding:0 48px; }

.eyebrow{
  font-family:var(--f-display-en);
  font-style:italic; font-weight:400;
  font-size:13px; letter-spacing:.04em;
  color:var(--text-3);
}

/* ============ NAV ============ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(245,242,235,0.94);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
  transform:translateZ(0);
  backface-visibility:hidden;
}
.nav-inner{
  max-width:1280px; margin:0 auto; padding:0 48px;
  height:68px;
  display:flex; align-items:center; justify-content:space-between;
}
.wordmark{
  font-family:var(--f-display-en);
  font-style:italic; font-weight:500;
  font-size:27px; letter-spacing:.02em;
  color:var(--text); line-height:1;
  transform:translateY(2px);
}
.wordmark .dot{ color:var(--accent); }

.nav-menu{ display:flex; align-items:center; gap:34px; list-style:none; }
.nav-menu a{
  font-family:var(--f-body-en);
  font-size:11px; font-weight:400;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--text-2);
  transition:color .35s var(--ease);
}
.nav-menu a:hover,
.nav-menu a[aria-current="page"]{ color:var(--text); }

.nav-toggle{
  display:none; background:none; border:none; cursor:pointer;
  width:30px; height:30px; padding:0; position:relative;
}
.nav-toggle span{
  position:absolute; left:4px; right:4px; height:1px;
  background:var(--text); transition:transform .4s var(--ease), opacity .3s var(--ease);
}
.nav-toggle span:nth-child(1){ top:11px; }
.nav-toggle span:nth-child(2){ bottom:11px; }
body.menu-open .nav-toggle span:nth-child(1){ transform:translateY(3px) rotate(45deg); }
body.menu-open .nav-toggle span:nth-child(2){ transform:translateY(-3px) rotate(-45deg); }

.nav-panel{ display:none; }

/* ============ BUTTONS / LINKS ============ */
.btn-ink{
  display:inline-flex; align-items:center;
  font-family:var(--f-body-en);
  font-size:11px; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--bg);
  background:var(--bg-ink);
  padding:16px 30px;
  border:1px solid var(--bg-ink);
  transition:background .4s var(--ease), color .4s var(--ease);
}
.btn-ink:hover{ background:transparent; color:var(--text); }

.btn-cream{
  display:inline-flex; align-items:center;
  font-family:var(--f-body-en);
  font-size:12px; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--bg-ink); background:var(--bg);
  padding:18px 38px; border:1px solid var(--bg);
  transition:background .4s var(--ease), color .4s var(--ease);
}
.btn-cream:hover{ background:transparent; color:var(--bg); }

.link-arrow{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--f-body-en);
  font-size:11px; font-weight:400;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--text-3);
  transition:color .35s var(--ease);
}
.link-arrow .arr{ transition:transform .4s var(--ease); }
.link-arrow:hover{ color:var(--text); }
.link-arrow:hover .arr{ transform:translateX(3px); }

/* ============ SHARED SECTIONS ============ */
.section{ padding:108px 0; }
.section.tight{ padding:84px 0; }

.reveal{ opacity:0; transform:translateY(14px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

.idx{
  font-family:var(--f-display-en);
  font-style:italic; font-weight:300;
  color:var(--text-3);
}

.sec-head{
  font-family:var(--f-display-en);
  font-weight:300;
  letter-spacing:-.018em;
  color:var(--text);
}
.sec-kr{
  font-family:var(--f-display-kr);
  font-weight:300;
  color:var(--text-2);
  letter-spacing:-.01em;
}
.label{
  font-family:var(--f-display-en);
  font-style:italic; font-weight:400;
  font-size:13px; letter-spacing:.03em;
  color:var(--text-3);
  display:block; margin-bottom:22px;
}

/* ============ CLOSING — ink inverted ============ */
.closing{
  background:var(--bg-ink); color:var(--bg);
  padding:128px 0;
}
.closing .label{ color:rgba(245,242,235,0.5); }
.closing-head{
  font-family:var(--f-display-en);
  font-weight:300; font-size:clamp(34px,5vw,66px);
  line-height:1.05; letter-spacing:-.02em;
  color:var(--bg); margin-bottom:26px; max-width:14em;
}
.closing-kr{
  font-family:var(--f-display-kr);
  font-weight:300; font-size:clamp(15px,1.35vw,18px);
  line-height:1.7; color:rgba(245,242,235,0.66);
  margin-bottom:44px; letter-spacing:-.01em;
}
.closing-cta{ display:flex; align-items:center; gap:34px; flex-wrap:wrap; }
.closing-mail{
  font-family:var(--f-display-en);
  font-style:italic; font-weight:300; font-size:18px;
  color:rgba(245,242,235,0.78);
  transition:color .35s var(--ease);
  border-bottom:1px solid rgba(245,242,235,0.22);
  padding-bottom:2px;
}
.closing-mail:hover{ color:rgba(245,242,235,0.92); }

/* ============ FOOTER ============ */
.footer{ border-top:1px solid var(--line); padding:38px 0; }
.footer-inner{
  display:flex; flex-direction:column; gap:6px;
  font-family:var(--f-body-en);
  font-size:11px; letter-spacing:.12em; line-height:1.7; color:var(--text-3);
}
.footer-utils{
  display:flex; gap:18px; flex-wrap:wrap;
  font-size:10px; letter-spacing:.16em; text-transform:uppercase;
}
.footer-utils a{
  color:var(--text-3); opacity:.82;
  transition:color .35s var(--ease), opacity .35s var(--ease);
}
.footer-utils a:hover{ color:var(--text); opacity:1; }

/* ============ RESPONSIVE (shared pieces) ============ */
@media (max-width:720px){
  .shell{ padding:0 26px; }
  .nav-inner{ padding:0 26px; }
  .nav-menu{ display:none; }
  .nav-toggle{ display:block; }

  .nav-panel{
    display:block;
    position:fixed; top:68px; left:0; right:0; z-index:99;
    background:rgba(245,242,235,0.97);
    -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line);
    transform:translateY(-12px); opacity:0; pointer-events:none;
    transition:opacity .4s var(--ease), transform .4s var(--ease);
  }
  body.menu-open .nav-panel{ transform:none; opacity:1; pointer-events:auto; }
  .nav-panel ul{ list-style:none; padding:14px 26px 22px; }
  .nav-panel a{
    display:block; padding:13px 0;
    font-family:var(--f-body-en);
    font-size:12px; letter-spacing:.18em; text-transform:uppercase;
    color:var(--text-2);
    border-bottom:1px solid var(--line);
    transition:color .35s var(--ease);
  }
  .nav-panel a:hover,
  .nav-panel a[aria-current="page"]{ color:var(--text); }
  .nav-panel li:last-child a{ border-bottom:none; }

  .section{ padding:74px 0; }
  .closing{ padding:88px 0; }
  .reveal{
    transform:translate3d(0,10px,0);
    transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1);
    will-change:auto;
  }
  .reveal.in{ transform:none; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1 !important; transform:none !important; }
}