/* hiro-pages.css — ものがたり・レシピの個別ページ／一覧（story.css / recipe.css を移植） */
:is(.hiro,.editor-styles-wrapper) .hiro-story :where(p,h1,h2,ul,ol,figure){margin:0}
:is(.hiro,.editor-styles-wrapper) .hiro-recipe :where(p,h1,h2,h3,ul,ol,dl,dd,figure){margin:0}
:is(.hiro,.editor-styles-wrapper) .hiro-recipe :where(ul,ol){padding-left:0}
/* story.css — 物語ページ（story-01〜03） */
:is(.hiro,.editor-styles-wrapper) .story-hero{background:var(--wc-hero);color:var(--ink);padding-block:clamp(40px,7vw,80px);position:relative;overflow:hidden}
:is(.hiro,.editor-styles-wrapper) .story-hero::after{content:none}
:is(.hiro,.editor-styles-wrapper) .story-hero__inner{position:relative;display:grid;gap:clamp(24px,5vw,56px);grid-template-columns:1fr 280px;align-items:center}
:is(.hiro,.editor-styles-wrapper) .story-hero .breadcrumb{padding-top:0;color:var(--ink-soft)}
:is(.hiro,.editor-styles-wrapper) .story-hero__num{color:var(--roof);font-weight:700;font-family:var(--font-head)}
:is(.hiro,.editor-styles-wrapper) .story-hero__title{color:var(--night);font-size:clamp(1.6rem,4.4vw,2.6rem);margin-top:.3em}
:is(.hiro,.editor-styles-wrapper) .story-hero__guest{margin-top:1.2em;color:var(--forest)}
:is(.hiro,.editor-styles-wrapper) .story-hero__voice{margin-top:.3em;color:var(--ink-soft);font-size:.95rem}
:is(.hiro,.editor-styles-wrapper) .story-hero__img{aspect-ratio:3/4;border:5px solid var(--lamp);border-bottom-width:0;box-shadow:0 0 50px 6px rgba(240,163,94,.35)}
@media (max-width:760px){:is(.hiro,.editor-styles-wrapper) .story-hero__inner{grid-template-columns:1fr}:is(.hiro,.editor-styles-wrapper) .story-hero__img{order:-1;width:min(56%,220px);margin-inline:auto}}

:is(.hiro,.editor-styles-wrapper) .story-body{padding-block:clamp(40px,7vw,80px)}
:is(.hiro,.editor-styles-wrapper) .story-text{text-wrap:pretty;line-break:strict;font-family:var(--font-story);font-size:clamp(1rem,2vw,1.1rem);line-height:2.2;letter-spacing:.04em}
:is(.hiro,.editor-styles-wrapper) .story-text>p+p{margin-top:1.5em}
:is(.hiro,.editor-styles-wrapper) .story-text .say{padding-left:1em;text-indent:-1em}
:is(.hiro,.editor-styles-wrapper) .story-text .voice{font-weight:700;font-size:1.08em;color:var(--night);padding-left:1em;text-indent:-1em}
:is(.hiro,.editor-styles-wrapper) .story-text .narration{color:var(--forest)}
:is(.hiro,.editor-styles-wrapper) .story-fig{margin-block:clamp(32px,6vw,56px);display:grid;justify-items:center}
:is(.hiro,.editor-styles-wrapper) .story-fig .arch{width:min(100%,300px);aspect-ratio:3/4}
:is(.hiro,.editor-styles-wrapper) .story-fig figcaption{font-size:.82rem;color:var(--ink-soft);margin-top:.8em}

/* レシピへの入口カード（物語の途中に置く） */
:is(.hiro,.editor-styles-wrapper) .recipe-gate{line-height:1.7;letter-spacing:0;font-size:1rem;display:grid;gap:20px;grid-template-columns:150px 1fr;align-items:center;margin-block:clamp(40px,7vw,72px);padding:24px;border-radius:calc(var(--r)*1.6);background:var(--lamp-soft);border:2px solid var(--lamp);box-shadow:var(--glow);font-family:var(--font-body)}
:is(.hiro,.editor-styles-wrapper) .recipe-gate__img{aspect-ratio:3/4;width:100%}
:is(.hiro,.editor-styles-wrapper) .recipe-gate__label{font-size:.85rem;font-weight:700;color:var(--roof)}
:is(.hiro,.editor-styles-wrapper) .recipe-gate__title{font-family:var(--font-head);font-weight:700;font-size:clamp(1.1rem,2.6vw,1.45rem);line-height:1.5;color:var(--night);margin-top:.2em}
:is(.hiro,.editor-styles-wrapper) .recipe-gate .chips{margin-top:.8em}
:is(.hiro,.editor-styles-wrapper) .recipe-gate .chip{background:var(--white)}
:is(.hiro,.editor-styles-wrapper) .recipe-gate .hiro-btn{margin-top:1em}
@media (max-width:560px){:is(.hiro,.editor-styles-wrapper) .recipe-gate{grid-template-columns:1fr;text-align:center}:is(.hiro,.editor-styles-wrapper) .recipe-gate__img{width:120px;margin-inline:auto}:is(.hiro,.editor-styles-wrapper) .recipe-gate .chips{justify-content:center}}

:is(.hiro,.editor-styles-wrapper) .story-end{margin-top:clamp(48px,8vw,80px);text-align:center;font-family:var(--font-body)}
:is(.hiro,.editor-styles-wrapper) .pager{display:grid;gap:14px;grid-template-columns:1fr 1fr;margin-top:48px;font-family:var(--font-body)}
:is(.hiro,.editor-styles-wrapper) .pager a{display:block;padding:16px 20px;border:1px solid var(--line);border-radius:var(--r);text-decoration:none;background:var(--white);font-size:.9rem}
:is(.hiro,.editor-styles-wrapper) .pager a:hover{border-color:var(--lamp);box-shadow:var(--shadow)}
:is(.hiro,.editor-styles-wrapper) .pager small{display:block;color:var(--ink-soft)}
:is(.hiro,.editor-styles-wrapper) .pager strong{font-family:var(--font-head);color:var(--night)}
:is(.hiro,.editor-styles-wrapper) .pager .next{text-align:right}
:is(.hiro,.editor-styles-wrapper) .pager .hiro-empty{visibility:hidden}

/* recipe.css — レシピページ（recipe-01〜03） */
:is(.hiro,.editor-styles-wrapper) .recipe-top{display:grid;gap:clamp(24px,5vw,56px);grid-template-columns:1fr 300px;align-items:center}
:is(.hiro,.editor-styles-wrapper) .recipe-top__img{aspect-ratio:3/4;border:5px solid var(--lamp);border-bottom-width:0;box-shadow:0 0 50px 6px rgba(240,163,94,.35)}
@media (max-width:760px){:is(.hiro,.editor-styles-wrapper) .recipe-top{grid-template-columns:1fr}:is(.hiro,.editor-styles-wrapper) .recipe-top__img{order:-1;width:min(56%,220px);margin-inline:auto}}

:is(.hiro,.editor-styles-wrapper) .recipe-block+.recipe-block{margin-top:clamp(48px,8vw,80px)}
:is(.hiro,.editor-styles-wrapper) .recipe-block__title{font-size:clamp(1.3rem,3vw,1.7rem);margin-bottom:1.2em;display:flex;align-items:center;gap:.6em}
:is(.hiro,.editor-styles-wrapper) .recipe-block__title::before{content:"";width:14px;height:22px;border-radius:8px 8px 3px 3px;background:var(--lamp);box-shadow:0 0 14px 3px rgba(240,163,94,.6);flex:none}

/* 食材の紹介 */
:is(.hiro,.editor-styles-wrapper) .ing-intro{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
:is(.hiro,.editor-styles-wrapper) .ing-intro__item{background:var(--white);border:1px solid var(--line);border-radius:90px 90px var(--r) var(--r);padding:40px 22px 24px;scroll-margin-top:90px}
:is(.hiro,.editor-styles-wrapper) .ing-intro__item h3{font-size:1.15rem;text-align:center;margin-bottom:.8em}
:is(.hiro,.editor-styles-wrapper) .ing-intro__item p{font-size:.95rem}
:is(.hiro,.editor-styles-wrapper) .ing-intro__item p+p{margin-top:.5em}
:is(.hiro,.editor-styles-wrapper) .ing-intro__item--link{background:var(--mist);border-style:dashed}
:is(.hiro,.editor-styles-wrapper) .ing-intro__item--link p{text-align:center}
:is(.hiro,.editor-styles-wrapper) .spotlight{margin-top:28px;background:var(--night);color:var(--mist);border-radius:var(--r);padding:clamp(22px,4vw,36px)}
:is(.hiro,.editor-styles-wrapper) .spotlight h3{color:var(--lamp-soft);font-size:1.15rem}
:is(.hiro,.editor-styles-wrapper) .spotlight p{margin-top:.8em}

/* 材料 */
:is(.hiro,.editor-styles-wrapper) .materials{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:8px clamp(16px,3vw,32px)}
:is(.hiro,.editor-styles-wrapper) .materials__row{display:flex;gap:12px;align-items:baseline;padding:.8em 0;border-bottom:1px dashed var(--line)}
:is(.hiro,.editor-styles-wrapper) .materials__row:last-child{border-bottom:0}
:is(.hiro,.editor-styles-wrapper) .materials dt{flex:1}
:is(.hiro,.editor-styles-wrapper) .materials dt a{font-weight:700}
:is(.hiro,.editor-styles-wrapper) .materials dd{font-family:var(--font-head);font-weight:700;color:var(--night);white-space:nowrap}

/* 手順（順序があるので番号を使う） */
:is(.hiro,.editor-styles-wrapper) .steps{list-style:none;padding:0;counter-reset:step;display:grid;gap:14px}
:is(.hiro,.editor-styles-wrapper) .steps li{counter-increment:step;position:relative;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px 18px 68px}
:is(.hiro,.editor-styles-wrapper) .steps li::before{content:counter(step);position:absolute;left:18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;display:grid;place-content:center;background:var(--green-deep);color:var(--white);font-family:var(--font-head);font-weight:700}

:is(.hiro,.editor-styles-wrapper) .recipe-foot{margin-top:clamp(48px,8vw,80px);padding:24px;border-radius:var(--r);background:var(--mist);display:flex;flex-wrap:wrap;gap:12px 20px;justify-content:space-between;align-items:center}

/* お話・レシピ・食材 一覧 */
:is(.hiro,.editor-styles-wrapper) .list-item{display:grid;gap:clamp(20px,4vw,40px);grid-template-columns:260px 1fr;align-items:center;padding-block:clamp(24px,4vw,40px);border-bottom:1px solid var(--line)}
:is(.hiro,.editor-styles-wrapper) .list-item:first-child{padding-top:0}
:is(.hiro,.editor-styles-wrapper) .list-item__img{aspect-ratio:3/4;width:100%;max-width:240px;justify-self:center}
:is(.hiro,.editor-styles-wrapper) .list-item__num{font-size:.9rem;color:var(--roof);font-weight:700}
:is(.hiro,.editor-styles-wrapper) .list-item__title{font-size:clamp(1.25rem,3vw,1.7rem);margin-top:.2em}
:is(.hiro,.editor-styles-wrapper) .list-item__voice{margin-top:.6em;color:var(--ink-soft)}
:is(.hiro,.editor-styles-wrapper) .list-item .chips{margin-top:1em}
@media (max-width:640px){:is(.hiro,.editor-styles-wrapper) .list-item{grid-template-columns:1fr;text-align:center}:is(.hiro,.editor-styles-wrapper) .list-item .chips{justify-content:center}:is(.hiro,.editor-styles-wrapper) .list-item .btn-row{justify-content:center}}

