/* 自動配置: salon-hero (workflow設計) */
.sh-hero{position:relative;margin:0 0 44px;border-radius:22px;overflow:hidden;isolation:isolate;color:#faf8f3;background:#1c2d24;background:radial-gradient(130% 150% at 30% -12%,#33513f 0%,#1c2d24 62%);box-shadow:0 18px 46px rgba(28,45,36,.24);}
.sh-hero__bg{position:absolute;inset:0;z-index:0;background-color:#1c2d24;background-image:url('/icd/assets/images/card_01.jpg');background-size:cover;background-position:center;opacity:.13;}
.sh-hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 120% at 26% 40%,rgba(56,178,161,.15),transparent 55%);}
.sh-hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(4px,2.4vw,40px);align-items:center;padding:clamp(26px,4vw,54px) clamp(22px,4vw,56px);}

/* --- Leaf stage --- */
.sh-hero__stage{position:relative;justify-self:center;width:100%;max-width:330px;}
.sh-hero__stage::before{content:"";position:absolute;inset:-10% -8% -4%;z-index:-1;background:radial-gradient(circle at 50% 44%,rgba(56,178,161,.20),transparent 64%);}
.sh-leaf{width:100%;height:auto;display:block;overflow:visible;filter:drop-shadow(0 12px 28px rgba(0,0,0,.30));}
.sh-stem{fill:none;stroke:url(#shGold);stroke-width:3;stroke-linecap:round;}
.sh-leaf-veil{fill:url(#shLeafGrad);}
.sh-leaf-outline{fill:none;stroke:url(#shGold);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round;}
.sh-vein{fill:none;stroke:rgba(240,215,156,.6);stroke-width:1.4;stroke-linecap:round;}
.sh-vein.is-hot{stroke:#f4dfa4;stroke-width:2.6;filter:drop-shadow(0 0 4px rgba(233,205,144,.65));}
.sh-midrib{fill:none;stroke-linecap:round;stroke-width:2.8;}
.sh-midrib--bg{stroke:rgba(250,248,243,.20);stroke-dasharray:2.5 7;}
.sh-midrib--fill{stroke:url(#shGold);}
.sh-node{cursor:pointer;}
.sh-node-ring{fill:none;stroke:#f3dca6;stroke-width:1.8;opacity:0;transform-origin:center;transform-box:fill-box;}
.sh-node-dot{fill:rgba(240,215,156,.4);transition:fill .4s ease,r .4s ease;}
.sh-node-num{fill:#f3dca6;font-family:'Noto Sans JP',sans-serif;font-size:9px;font-weight:800;letter-spacing:.06em;opacity:0;transition:opacity .4s ease;}
.sh-node.is-lit .sh-node-dot{fill:#e9cd90;r:4.8;}
.sh-node.is-lit .sh-node-num{opacity:.92;}
.sh-node.is-hot .sh-node-dot{fill:#fff;r:5.6;}
.sh-node.is-hot .sh-node-ring{opacity:1;animation:shPulse 1.9s ease-out infinite;}
.sh-node.is-hot .sh-node-num{opacity:1;fill:#fff;}
.sh-node:focus{outline:none;}
.sh-node:focus-visible .sh-node-ring{opacity:1;}
.sh-node--hint .sh-node-ring{animation:shHint 1.9s ease-out 3;}
/* leaf annotation tag (leaf becomes the proof) */
.sh-tag{opacity:0;transform:scale(.72);transform-box:fill-box;transform-origin:center bottom;transition:opacity .3s ease,transform .34s cubic-bezier(.2,1.5,.4,1);pointer-events:none;}
.sh-node.is-hot .sh-tag{opacity:1;transform:scale(1);}
.sh-tag-bg{fill:rgba(24,38,30,.94);stroke:#e9cd90;stroke-width:1;}
.sh-tag-tx{fill:#f3dca6;font-family:"Shippori Mincho","Noto Serif JP",serif;font-size:11px;text-anchor:middle;letter-spacing:.04em;}
@keyframes shPulse{0%{transform:scale(.55);opacity:.9;}100%{transform:scale(2.1);opacity:0;}}
@keyframes shHint{0%{transform:scale(.55);opacity:0;}28%{opacity:.85;}100%{transform:scale(2.15);opacity:0;}}

/* --- Copy --- */
.sh-hero__copy{display:flex;flex-direction:column;gap:clamp(10px,1.6vw,15px);min-width:0;}
.sh-beat{margin:0;}
.sh-beat--eyebrow{display:flex;align-items:center;gap:13px;flex-wrap:wrap;}
.sh-eyebrow-en{font-size:.72rem;font-weight:700;letter-spacing:.3em;color:#e6cf9a;}
.sh-eyebrow-jp{position:relative;font-family:"Shippori Mincho","Noto Serif JP",serif;font-size:.9rem;letter-spacing:.14em;color:#e7ece2;padding-left:16px;}
.sh-eyebrow-jp::before{content:"";position:absolute;left:0;top:50%;width:8px;height:8px;background:#e9cd90;border-radius:0 60% 60% 60%;transform:translateY(-50%) rotate(45deg);}
.sh-hero__title{font-family:"Shippori Mincho","Noto Serif JP",serif;font-weight:600;font-size:clamp(1.55rem,4.7vw,2.42rem);line-height:1.42;letter-spacing:.015em;text-shadow:0 2px 14px rgba(0,0,0,.22);}
.sh-em{font-style:normal;color:#f0d79c;position:relative;white-space:nowrap;}
.sh-em::after{content:"";position:absolute;left:0;right:0;bottom:-.08em;height:2px;background:linear-gradient(90deg,transparent,#a98f5c 20%,#f0d79c 80%,transparent);}
.sh-hero__body{font-size:clamp(.94rem,2.5vw,1.06rem);line-height:2;color:#e2e8dd;max-width:32em;}
.sh-mark{font-weight:700;color:#fff;box-shadow:inset 0 -.5em 0 rgba(169,143,92,.34);}

/* tip pills = signature proof control */
.sh-tips{display:flex;flex-wrap:wrap;gap:9px;}
.sh-tip{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid rgba(240,215,156,.45);background:rgba(240,215,156,.07);color:#eef1e9;font-family:"Shippori Mincho","Noto Serif JP",serif;font-size:.95rem;letter-spacing:.02em;cursor:pointer;transition:background .28s ease,color .28s ease,border-color .28s ease,transform .18s ease,box-shadow .28s ease;}
.sh-tip .sh-tip-n{font-family:'Noto Sans JP',sans-serif;font-size:.68rem;font-weight:800;letter-spacing:.1em;color:#f0d79c;transition:color .28s ease;}
.sh-tip:hover{transform:translateY(-2px);border-color:rgba(240,215,156,.8);}
.sh-tip:focus-visible{outline:2px solid #f0d79c;outline-offset:3px;}
.sh-tip.is-hot{background:linear-gradient(135deg,#c8a86a,#ecd196);color:#1c2d24;border-color:transparent;box-shadow:0 8px 20px rgba(0,0,0,.26);}
.sh-tip.is-hot .sh-tip-n{color:#1c2d24;}
.sh-tip-caption{min-height:4em;font-size:clamp(.86rem,2.3vw,.95rem);line-height:1.75;color:#d7ddd0;padding-left:14px;border-left:2px solid rgba(240,215,156,.35);transition:opacity .3s ease;}
.sh-tip-caption.is-swap{opacity:0;}

.sh-hero__close{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(12px,2.2vw,22px);margin-top:4px;}
.sh-close-txt{font-family:"Shippori Mincho","Noto Serif JP",serif;font-size:clamp(1rem,2.9vw,1.22rem);color:#f0d79c;letter-spacing:.03em;}
.sh-hero__cta{display:inline-flex;align-items:center;gap:9px;background:linear-gradient(135deg,#c8a86a,#ecd196);color:#1c2d24;font-weight:700;font-size:.92rem;letter-spacing:.02em;padding:13px 26px;border-radius:999px;text-decoration:none;box-shadow:0 9px 22px rgba(0,0,0,.26);transition:transform .18s ease,box-shadow .18s ease;}
.sh-hero__cta:hover{transform:translateY(-2px);box-shadow:0 13px 28px rgba(0,0,0,.34);}
.sh-hero__cta:focus-visible{outline:2px solid #fff;outline-offset:3px;}
.sh-cta-arrow{display:inline-block;animation:shBob 1.6s ease-in-out infinite;}
@keyframes shBob{0%,100%{transform:translateY(0);}50%{transform:translateY(3px);}}

/* --- Copy reveal: pure CSS, load-driven, NEVER gated by IO/JS --- */
.sh-beat{animation:shRise .68s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0s);}
@keyframes shRise{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}

/* --- Leaf growth states (decorative, JS/IO-driven, copy-independent) --- */
.sh-hero--js .sh-leaf-veil{opacity:0;transition:opacity 1.1s ease .2s;}
.sh-hero--js .sh-leaf-outline{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.5s cubic-bezier(.2,.8,.2,1);}
.sh-hero--js .sh-vein{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1s cubic-bezier(.2,.8,.2,1),stroke .3s ease,stroke-width .3s ease;}
.sh-hero--js .sh-midrib--fill{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s cubic-bezier(.2,.8,.2,1);}
.sh-hero--js .sh-node{opacity:0;transition:opacity .45s ease;}
.sh-hero--js .sh-node.is-lit{opacity:1;}
.sh-hero--grow .sh-leaf-veil{opacity:1;}
.sh-hero--grow .sh-leaf-outline{stroke-dashoffset:0;}
.sh-hero--grow .sh-vein{stroke-dashoffset:0;}
.sh-hero--grow .sh-midrib--fill{stroke-dashoffset:0;}
.sh-hero--rest .sh-leaf-breathe{animation:shBreathe 7.5s ease-in-out infinite;transform-origin:200px 348px;transform-box:view-box;}
@keyframes shBreathe{0%,100%{transform:rotate(-.7deg) translateY(0);}50%{transform:rotate(.7deg) translateY(-3px);}}

/* --- Responsive: keep an operable leaf above the copy on mobile --- */
@media(max-width:820px){
  .sh-hero__inner{display:flex;flex-direction:column;align-items:center;gap:clamp(14px,4vw,22px);padding:clamp(24px,6vw,40px) clamp(20px,6vw,34px);}
  .sh-hero__stage{width:min(48vw,190px);max-width:190px;}
  .sh-hero__copy{width:100%;}
  .sh-hero__body{max-width:none;}
  .sh-tip-caption{min-height:5.4em;}
}
@media(max-width:420px){
  .sh-hero{border-radius:18px;}
  .sh-hero__stage{width:min(46vw,152px);}
  .sh-tip{flex:1 1 auto;justify-content:center;}
  .sh-tip-caption{min-height:5.7em;}
}

/* --- Reduced motion: everything visible, no motion --- */
@media(prefers-reduced-motion:reduce){
  .sh-beat{animation:none!important;opacity:1!important;transform:none!important;}
  .sh-hero--js .sh-leaf-veil,.sh-hero--js .sh-leaf-outline,.sh-hero--js .sh-vein,.sh-hero--js .sh-midrib--fill,.sh-hero--js .sh-node{transition:none!important;}
  .sh-leaf-breathe,.sh-node.is-hot .sh-node-ring,.sh-node--hint .sh-node-ring,.sh-cta-arrow{animation:none!important;}
  .sh-hero__cta,.sh-tip,.sh-tip-caption,.sh-tag,.sh-node-dot,.sh-node-num,.sh-vein{transition:none!important;}
}
