/* ============================================================
   soupleworks — shared brand base
   淡いパープル(星よみ) × やわらかいセージ(事業) / 温めたグレージュ地
   ============================================================ */
:root{
  /* lavender — 星よみ / わたしを整える */
  --lav:#BFA8BE; --lav-deep:#9A7E98; --lav-tint:#EFE6EE; --lav-50:#F7F1F6;
  /* sage — 事業を整える */
  --sage:#9FB0A4; --sage-deep:#71867A; --sage-tint:#E7EDE8; --sage-50:#F1F5F2;
  /* warm neutrals — ベージュ/グレージュ */
  --ink:#473F39; --ink-soft:#766C61; --ink-mute:#A89E8F;
  --bg:#F7F3ED; --bg-2:#F1EBE1; --card:#FFFFFF; --card-2:#FDFAF5;
  --line:#E7DECF;

  --font-serif:'Shippori Mincho', serif;
  --font-sans:'Noto Sans JP', sans-serif;
  --font-round:'Zen Maru Gothic', sans-serif;
  --font-mono:'DM Mono', ui-monospace, monospace;

  --maxw:1080px;
  --radius:20px;
  --shadow-sm:0 1px 2px rgba(71,63,57,.04), 0 6px 18px rgba(154,126,152,.06);
  --shadow-md:0 2px 8px rgba(71,63,57,.05), 0 20px 46px rgba(154,126,152,.10);
  --shadow-lg:0 10px 30px rgba(71,63,57,.07), 0 36px 80px rgba(154,126,152,.16);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--ink);
  background:var(--bg);
  line-height:1.9;
  letter-spacing:.03em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{margin:0;font-family:var(--font-serif);font-weight:500;line-height:1.5;letter-spacing:.02em;}
p{margin:0;}
a{color:inherit;text-decoration:none;transition:color .25s,opacity .25s;}
img{max-width:100%;display:block;}

.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 28px;}
.kp{display:inline-block;} /* 文節折り返し */

/* eyebrow */
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-round);
  font-size:12px;font-weight:500;letter-spacing:.22em;
  color:var(--lav-deep);text-transform:uppercase;
}
.eyebrow::before{content:"";width:22px;height:1.5px;border-radius:2px;background:var(--lav);display:inline-block;}
.eyebrow.sage{color:var(--sage-deep);}
.eyebrow.sage::before{background:var(--sage);}
.eyebrow.center{justify-content:center;}

/* brand mark */
.mark{
  width:30px;height:30px;border-radius:9px;flex:none;position:relative;
  background:linear-gradient(135deg,var(--lav),var(--sage));
}
.mark::after{
  content:"";position:absolute;inset:8px;border-radius:4px;background:var(--card);opacity:.94;
  clip-path:polygon(0 100%,50% 0,100% 100%,72% 100%,50% 42%,28% 100%);
}
.brand{display:inline-flex;align-items:center;gap:11px;font-family:var(--font-round);font-weight:700;font-size:18px;letter-spacing:.01em;color:var(--ink);}
.brand .tld{color:var(--lav-deep);}

/* buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--font-round);font-weight:500;font-size:15.5px;letter-spacing:.04em;
  line-height:1.4;cursor:pointer;border:none;border-radius:999px;padding:16px 30px;
  transition:transform .25s cubic-bezier(.3,.7,.4,1),box-shadow .25s,filter .25s;text-align:center;
}
.btn .ico{width:19px;height:19px;flex:none;}
.btn-line{color:#fff;background:linear-gradient(120deg,var(--lav) 0%,var(--sage) 120%);box-shadow:0 10px 26px -10px var(--lav-deep);}
.btn-line:hover{transform:translateY(-3px);box-shadow:0 18px 38px -12px var(--lav-deep);}
.btn-ghost{color:var(--ink);background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line),var(--shadow-sm);}
.btn-ghost:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1.5px var(--lav),var(--shadow-md);}
.btn-sub{display:block;margin-top:12px;font-size:12.5px;color:var(--ink-mute);letter-spacing:.03em;font-family:var(--font-sans);}

/* header */
.site-head{
  position:sticky;top:0;z-index:100;
  background:color-mix(in oklab,var(--bg),transparent 16%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s;
}
.site-head.scrolled{border-color:var(--line);box-shadow:0 6px 24px -18px rgba(71,63,57,.4);}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:70px;}
.site-head .nav{display:flex;align-items:center;gap:28px;}
.site-head .nav a{font-family:var(--font-round);font-size:14px;font-weight:500;color:var(--ink-soft);}
.site-head .nav a:hover{color:var(--lav-deep);}
.site-head .nav .btn{padding:11px 20px;font-size:13.5px;}
@media (max-width:880px){.site-head .nav a:not(.btn){display:none;}}

/* footer */
.foot{background:#2d2a28;color:rgba(255,255,255,.6);padding-block:48px;}
.foot .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.foot .brand{color:#fff;}
.foot .brand .tld{color:var(--sage);}
.foot small{font-size:12.5px;letter-spacing:.02em;line-height:1.9;}
.foot a{text-decoration:underline;text-underline-offset:3px;}
.foot a:hover{color:#fff;}

/* reveal */
.reveal{opacity:1;transform:none;}
html.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.3,1);}
html.js .reveal.in{opacity:1;transform:none;}
.reveal[data-d="1"]{transition-delay:.07s;}
.reveal[data-d="2"]{transition-delay:.14s;}
.reveal[data-d="3"]{transition-delay:.21s;}
.reveal[data-d="4"]{transition-delay:.28s;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;transition:none!important;}}

/* image placeholder */
.ph{
  background:
    repeating-linear-gradient(135deg, var(--lav-50) 0 10px, var(--card-2) 10px 20px);
  border:1px solid var(--line);border-radius:14px;
  display:flex;align-items:center;justify-content:center;color:var(--ink-mute);
  font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-align:center;
}

/* sticky mobile CTA */
.sticky-cta{position:fixed;left:14px;right:14px;bottom:14px;z-index:90;display:none;transform:translateY(160%);transition:transform .45s cubic-bezier(.3,.7,.4,1);}
.sticky-cta.show{transform:none;}
.sticky-cta .btn{width:100%;box-shadow:var(--shadow-lg);padding:17px;}
@media (max-width:720px){.sticky-cta{display:block;}}