@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600;700&family=Noto+Sans+JP:wght@300;400;500;600;700&display=swap");
:root{
  --green-900:#1f3d2b;
  --green-800:#2a5238;
  --green-700:#356845;
  --green-600:#3e7a52;
  --green-050:#eef4ef;
  --ink-900:#1a1a1a;
  --ink-800:#2b2b2b;
  --ink-700:#3a3a3a;
  --ink-600:#555;
  --ink-500:#6b6b6b;
  --ink-400:#8a8a8a;
  --ink-300:#b8b8b8;
  --ink-200:#d8d8d8;
  --ink-100:#ececec;
  --paper:#fafaf7;
  --paper-warm:#f4f1ea;
  --marble:#f2efe8;
  --brown:#5c5046;
  --red:#b91c1c;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Noto Sans JP",system-ui,sans-serif;
  color:var(--ink-900);
  background:#fff;
  line-height:1.8;
  font-size:14px;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{
  color:var(--green-700);
  text-decoration:none;
  transition:color 0.15s ease;
}
a:hover,
a:focus{
  color:var(--green-900);
}

body.column-page #js-column-index a,
body.column-page #js-col-body a{
  text-decoration:underline;
  text-underline-offset:2px;
}
body.column-page #js-column-index a:hover,
body.column-page #js-column-index a:focus,
body.column-page #js-col-body a:hover,
body.column-page #js-col-body a:focus{
  color:var(--green-900);
}

.serif{font-family:"Noto Serif JP",serif}

/* ============ Section primitives ============ */
section{padding:80px 40px;position:relative}
.wrap{max-width:1080px;margin:0 auto}
.wrap-wide{max-width:1280px;margin:0 auto}
.sec-title{
  text-align:center;margin:0 0 50px;
}
.sec-title .jp{
  font-family:"Noto Serif JP",serif;
  font-size:28px;font-weight:500;letter-spacing:0.12em;
  color:var(--ink-900);
}
.sec-title .en{
  display:block;font-size:11px;letter-spacing:0.32em;
  color:var(--green-700);margin-top:6px;font-weight:500;
}

/* Marble section background */
.marble-bg{
  background:
    radial-gradient(ellipse at 20% 10%, #fff 0%, transparent 50%),
    radial-gradient(ellipse at 80% 90%, #fff 0%, transparent 50%),
    linear-gradient(160deg, var(--marble) 0%, #ebe6db 100%);
}
.dark-bg{background:var(--ink-900);color:#fff}
.paper-bg{background:var(--paper)}

/* Mobile adjust — simple */
@media (max-width:860px){
  section{padding:56px 20px}
  .sec-title{margin-bottom:32px;}
  .sec-title .jp{font-size:24px;}
  .sec-title .en{font-size:10px;margin-top:4px;}
}
@media (max-width:480px){
  section{padding:40px 16px}
}
