/* hiro-parts.css — ブロックと共通部品（サンプルサイトの common / index / page.css を移植）。
   Cocoon と名前がぶつかる wrap・btn・topic だけ hiro- を付けています */

/* 部品の中だけ、余白とボックスの考え方をサンプルサイトにそろえる */
:is(.hiro,.editor-styles-wrapper) .hiro-block,:is(.hiro,.editor-styles-wrapper) .hiro-block *,:is(.hiro,.editor-styles-wrapper) .hiro-story,:is(.hiro,.editor-styles-wrapper) .hiro-story *,:is(.hiro,.editor-styles-wrapper) .hiro-recipe,:is(.hiro,.editor-styles-wrapper) .hiro-recipe *,:is(.hiro,.editor-styles-wrapper) .hiro-archive *{box-sizing:border-box}
:is(.hiro,.editor-styles-wrapper) .hiro-block :where(p,h1,h2,h3,h4,ul,ol,dl,dd,figure,blockquote){margin:0}
:is(.hiro,.editor-styles-wrapper) .hiro-block :where(ul,ol){padding-left:0}
:is(.hiro,.editor-styles-wrapper) .hiro-block img{display:block;max-width:100%;height:auto}
:is(.hiro,.editor-styles-wrapper) .hiro-block a{text-underline-offset:.2em;text-decoration-thickness:1px}
:is(.hiro,.editor-styles-wrapper) .hiro-block :where(h1,h2,h3,h4),:is(.hiro,.editor-styles-wrapper) .hiro-story :where(h1,h2,h3,h4),:is(.hiro,.editor-styles-wrapper) .hiro-recipe :where(h1,h2,h3,h4){font-family:var(--font-head);line-height:1.5;color:var(--night);font-weight:700;letter-spacing:.02em}
:is(.hiro,.editor-styles-wrapper) .hiro-block :where(h1,h2,h3,h4)::before,:is(.hiro,.editor-styles-wrapper) .hiro-block :where(h1,h2,h3,h4)::after{content:none}
/* ---------- レイアウト部品 ---------- */
:is(.hiro,.editor-styles-wrapper) .hiro-wrap{width:min(100% - var(--gutter)*2,var(--wrap));margin-inline:auto}
:is(.hiro,.editor-styles-wrapper) .hiro-wrap--narrow{width:min(100% - var(--gutter)*2,var(--wrap-narrow));margin-inline:auto}
:is(.hiro,.editor-styles-wrapper) .section{padding-block:clamp(56px,9vw,104px)}
:is(.hiro,.editor-styles-wrapper) .section--mist{background:var(--mist)}
:is(.hiro,.editor-styles-wrapper) .section--night{background:var(--wc);color:var(--ink)}
:is(.hiro,.editor-styles-wrapper) .section--night h2,:is(.hiro,.editor-styles-wrapper) .section--night h3{color:var(--night)}
:is(.hiro,.editor-styles-wrapper) .section__head{margin-bottom:clamp(28px,5vw,48px)}
:is(.hiro,.editor-styles-wrapper) .section__title{font-size:clamp(1.5rem,3.4vw,2.1rem)}
:is(.hiro,.editor-styles-wrapper) .section__lead{margin-top:.8em;color:var(--ink-soft);max-width:38em}
:is(.hiro,.editor-styles-wrapper) .section--night .section__lead{color:var(--ink-soft)}
:is(.hiro,.editor-styles-wrapper) .center{text-align:center}
:is(.hiro,.editor-styles-wrapper) .center .section__lead{margin-inline:auto}

/* ---------- ページ見出し（下層共通） ---------- */
:is(.hiro,.editor-styles-wrapper) .page-hero{background:var(--wc-hero);color:var(--ink);padding-block:clamp(48px,8vw,88px);position:relative;overflow:hidden}
:is(.hiro,.editor-styles-wrapper) .page-hero::after{content:none}
:is(.hiro,.editor-styles-wrapper) .page-hero__title{color:var(--night);font-size:clamp(1.7rem,4.4vw,2.7rem)}
:is(.hiro,.editor-styles-wrapper) .page-hero__lead{margin-top:1em;color:var(--ink);max-width:36em}
:is(.hiro,.editor-styles-wrapper) .page-hero .breadcrumb{color:var(--ink-soft);padding-top:0}
:is(.hiro,.editor-styles-wrapper) .page-hero .breadcrumb a:hover{color:var(--roof)}

/* ---------- ボタン・リンク ---------- */
:is(.hiro,.editor-styles-wrapper) .hiro-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:48px;padding:.7em 1.8em;border-radius:999px;font-weight:700;font-family:var(--font-head);text-decoration:none;background:var(--lamp);color:var(--night);transition:transform .2s,box-shadow .2s}
:is(.hiro,.editor-styles-wrapper) .hiro-btn:hover{color:var(--night);background:var(--lamp-deep);transform:translateY(-2px);box-shadow:var(--glow)}
:is(.hiro,.editor-styles-wrapper) .hiro-btn--line{background:transparent;border:2px solid currentColor;color:var(--forest)}
:is(.hiro,.editor-styles-wrapper) .hiro-btn--line:hover{background:var(--forest);color:var(--white);box-shadow:none}
:is(.hiro,.editor-styles-wrapper) .btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:2em}
:is(.hiro,.editor-styles-wrapper) .text-link{font-weight:700;color:var(--forest)}

/* ---------- アーチ画像 ---------- */
:is(.hiro,.editor-styles-wrapper) .arch{overflow:hidden;border-radius:var(--arch);background:var(--mist)}
:is(.hiro,.editor-styles-wrapper) .arch img{width:100%;height:100%;object-fit:cover}
:is(.hiro,.editor-styles-wrapper) .arch--glow{box-shadow:var(--glow)}
:is(.hiro,.editor-styles-wrapper) .thumb{overflow:hidden;border-radius:var(--r);background:var(--mist);aspect-ratio:16/9}
:is(.hiro,.editor-styles-wrapper) .thumb img{width:100%;height:100%;object-fit:cover}
:is(.hiro,.editor-styles-wrapper) figure.figure{margin-block:2em}
:is(.hiro,.editor-styles-wrapper) figure.figure figcaption{font-size:.85rem;color:var(--ink-soft);margin-top:.6em;text-align:center}

/* ---------- カード・チップ ---------- */
:is(.hiro,.editor-styles-wrapper) .card-grid{display:grid;gap:clamp(16px,3vw,28px);grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr))}
:is(.hiro,.editor-styles-wrapper) .card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .25s,box-shadow .25s}
:is(.hiro,.editor-styles-wrapper) .card:hover{transform:translateY(-4px);box-shadow:var(--shadow);color:var(--ink)}
:is(.hiro,.editor-styles-wrapper) .card__body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:.5em;flex:1}
:is(.hiro,.editor-styles-wrapper) .card__label{font-size:.82rem;color:var(--roof);font-weight:700}
:is(.hiro,.editor-styles-wrapper) .card__title{font-size:1.15rem;font-family:var(--font-head);font-weight:700;color:var(--night);line-height:1.5}
:is(.hiro,.editor-styles-wrapper) .card__text{font-size:.93rem;color:var(--ink-soft)}
:is(.hiro,.editor-styles-wrapper) .card__more{margin-top:auto;padding-top:.6em;font-weight:700;font-size:.9rem;color:var(--forest)}
:is(.hiro,.editor-styles-wrapper) .chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0}
:is(.hiro,.editor-styles-wrapper) .chip{display:inline-block;padding:.2em .9em;font-size:.85rem;border-radius:999px;background:var(--mist);color:var(--forest);text-decoration:none;border:1px solid var(--line)}
:is(.hiro,.editor-styles-wrapper) a.chip:hover{background:var(--lamp-soft);color:var(--night);border-color:var(--lamp)}

/* ---------- 注意書き・免責 ---------- */
:is(.hiro,.editor-styles-wrapper) .notice{border-left:4px solid var(--lamp);background:var(--lamp-soft);padding:1em 1.2em;border-radius:0 var(--r) var(--r) 0;font-size:.92rem;color:var(--night)}
:is(.hiro,.editor-styles-wrapper) .notice--soft{background:var(--green-soft);border-left-color:var(--green);color:var(--ink-soft)}

/* ---------- 問い合わせ導線（共通CTA） ---------- */
:is(.hiro,.editor-styles-wrapper) .cta{background:var(--forest);color:var(--mist);border-radius:calc(var(--r)*2);padding:clamp(32px,6vw,64px);text-align:center;position:relative;overflow:hidden}
:is(.hiro,.editor-styles-wrapper) .cta::before{content:"";position:absolute;inset:auto 0 -60% 0;height:100%;background:radial-gradient(ellipse at 50% 100%,rgba(240,163,94,.35),transparent 60%);pointer-events:none}
:is(.hiro,.editor-styles-wrapper) .cta>*{position:relative}
:is(.hiro,.editor-styles-wrapper) .cta h2{color:var(--white);font-size:clamp(1.3rem,3vw,1.8rem)}
:is(.hiro,.editor-styles-wrapper) .cta p{margin-top:.8em;color:var(--lamp-soft)}
:is(.hiro,.editor-styles-wrapper) .cta .btn-row{justify-content:center}

/* ---------- 汎用本文 ---------- */
:is(.hiro,.editor-styles-wrapper) .prose>*+*{margin-top:1.2em}
:is(.hiro,.editor-styles-wrapper) .prose>h2{font-size:clamp(1.35rem,3vw,1.7rem);margin-top:2.4em;padding-bottom:.4em;border-bottom:2px solid var(--lamp)}
:is(.hiro,.editor-styles-wrapper) .prose>h3{font-size:1.2rem;margin-top:2em}
:is(.hiro,.editor-styles-wrapper) .prose>ul,:is(.hiro,.editor-styles-wrapper) .prose>ol{padding-left:1.4em}
:is(.hiro,.editor-styles-wrapper) .prose>:is(ul,ol)>li+li{margin-top:.35em}
:is(.hiro,.editor-styles-wrapper) .check-list{list-style:none;padding:0;display:grid;gap:.7em}
:is(.hiro,.editor-styles-wrapper) .check-list li{position:relative;padding:.9em 1.1em .9em 3em;background:var(--white);border:1px solid var(--line);border-radius:var(--r)}
:is(.hiro,.editor-styles-wrapper) .check-list li::before{content:"";position:absolute;left:1.1em;top:1.15em;width:.9em;height:.9em;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px var(--green-soft)}


/* ---------- トップ（index.css） ---------- */
/* index.css — トップページ専用 */
:is(.hiro,.editor-styles-wrapper) .hero{position:relative;overflow:hidden;color:var(--ink);display:flex;align-items:center;min-height:clamp(560px,52vw,760px);padding-block:clamp(32px,5vw,64px);background:var(--paper)}
:is(.hiro,.editor-styles-wrapper) .hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center}
:is(.hiro,.editor-styles-wrapper) .hero::before{content:none}
:is(.hiro,.editor-styles-wrapper) .hero__inner{position:relative;width:min(100% - var(--gutter)*2,var(--wrap))}
:is(.hiro,.editor-styles-wrapper) .hero__panel{width:min(100%,560px);padding:clamp(24px,3.4vw,44px);border-radius:24px;background:rgba(255,235,203,.78);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);box-shadow:0 10px 40px -16px rgba(90,70,50,.35)}
:is(.hiro,.editor-styles-wrapper) .hero__narration{font-family:var(--font-story);color:var(--forest);font-size:clamp(.95rem,1.8vw,1.1rem);margin-bottom:1.4em}
:is(.hiro,.editor-styles-wrapper) .hero__title{font-size:clamp(2rem,5.6vw,3.6rem);line-height:1.35;color:var(--night);letter-spacing:.03em}
:is(.hiro,.editor-styles-wrapper) .hero__sub{margin-top:1.2em;font-size:clamp(1rem,2vw,1.2rem);color:var(--ink);max-width:28em}
@media (max-width:760px){
  :is(.hiro,.editor-styles-wrapper) .hero{align-items:flex-end;min-height:680px;padding-bottom:24px}
  :is(.hiro,.editor-styles-wrapper) .hero__bg{object-position:72% top;height:58%}
  :is(.hiro,.editor-styles-wrapper) .hero__inner{margin-top:34vh}
  :is(.hiro,.editor-styles-wrapper) .hero__panel{width:100%}
}

/* 共感 */
:is(.hiro,.editor-styles-wrapper) .worries{display:grid;gap:clamp(24px,5vw,56px);grid-template-columns:1fr 1fr;align-items:start}
@media (max-width:760px){:is(.hiro,.editor-styles-wrapper) .worries{grid-template-columns:1fr}}

/* 6つの扉（個別導線） */
:is(.hiro,.editor-styles-wrapper) .doors{display:grid;gap:clamp(16px,2.6vw,24px);grid-template-columns:repeat(3,1fr);list-style:none;padding:0}
:is(.hiro,.editor-styles-wrapper) .door{display:flex;flex-direction:column;height:100%;text-decoration:none;color:var(--ink);background:var(--white);border-radius:var(--arch);padding:clamp(48px,7vw,72px) 24px 28px;text-align:center;transition:transform .25s,box-shadow .25s;border:2px solid var(--yamabuki)}
:is(.hiro,.editor-styles-wrapper) .door:hover{transform:translateY(-6px);box-shadow:var(--glow);color:var(--ink)}
:is(.hiro,.editor-styles-wrapper) .door__who{font-size:.85rem;color:var(--roof);font-weight:700}
:is(.hiro,.editor-styles-wrapper) .door__title{margin-top:.5em;font-family:var(--font-head);font-weight:700;font-size:1.2rem;color:var(--night);line-height:1.5}
:is(.hiro,.editor-styles-wrapper) .door__text{margin-top:.8em;font-size:.9rem;color:var(--ink-soft);flex:1}
:is(.hiro,.editor-styles-wrapper) .door__go{margin-top:1.2em;font-weight:700;font-size:.9rem;color:var(--green-deep)}
@media (max-width:900px){:is(.hiro,.editor-styles-wrapper) .doors{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){:is(.hiro,.editor-styles-wrapper) .doors{grid-template-columns:1fr}}

/* お話カード（トップ） */
:is(.hiro,.editor-styles-wrapper) .story-card .thumb{border-radius:0;aspect-ratio:16/10}
:is(.hiro,.editor-styles-wrapper) .story-card .card__label::after{content:""}

/* ヒロ紹介 */
:is(.hiro,.editor-styles-wrapper) .about-teaser{display:grid;gap:clamp(24px,5vw,64px);grid-template-columns:.7fr 1.3fr;align-items:center}
:is(.hiro,.editor-styles-wrapper) .about-teaser__img{width:min(100%,300px);aspect-ratio:3/4;justify-self:center}
:is(.hiro,.editor-styles-wrapper) .about-teaser h2{font-size:clamp(1.4rem,3vw,1.9rem)}
:is(.hiro,.editor-styles-wrapper) .about-teaser p{margin-top:1em}
@media (max-width:760px){:is(.hiro,.editor-styles-wrapper) .about-teaser{grid-template-columns:1fr}:is(.hiro,.editor-styles-wrapper) .about-teaser__img{width:min(60%,240px)}}

/* ひとこと（引用） */
:is(.hiro,.editor-styles-wrapper) .signature{font-family:var(--font-head);font-size:clamp(1.2rem,3vw,1.7rem);line-height:1.9;text-align:center;color:var(--night)}
:is(.hiro,.editor-styles-wrapper) .signature em{font-style:normal;color:var(--roof)}

/* レシピ（番号つきカード）— 添付資料の見た目 */
:is(.hiro,.editor-styles-wrapper) .recipe-sec__head{background:var(--paper);text-align:center;padding:clamp(40px,7vw,72px) var(--gutter) clamp(28px,5vw,48px);border-bottom:1px solid var(--lamp)}
:is(.hiro,.editor-styles-wrapper) .recipe-sec__title{font-size:clamp(1.5rem,4.4vw,2.6rem);letter-spacing:.14em;color:var(--forest);line-height:1.5}
:is(.hiro,.editor-styles-wrapper) .recipe-sec__en{margin-top:.4em;font-family:var(--font-story);font-size:clamp(1rem,2vw,1.3rem);letter-spacing:.2em;color:var(--forest)}
:is(.hiro,.editor-styles-wrapper) .recipe-sec__body{background:var(--mist);padding-block:clamp(48px,7vw,72px) clamp(56px,8vw,88px)}
:is(.hiro,.editor-styles-wrapper) .recipe-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(40px,5vw,48px) clamp(16px,3vw,32px);list-style:none;padding:0}
:is(.hiro,.editor-styles-wrapper) .recipe-card{position:relative;margin-top:30px}
:is(.hiro,.editor-styles-wrapper) .recipe-card::before{content:"";position:absolute;top:-34px;left:50%;width:84px;height:84px;margin-left:-42px;border-radius:50%;background:var(--white)}
:is(.hiro,.editor-styles-wrapper) .recipe-card__no{position:absolute;z-index:2;top:-22px;left:50%;width:56px;height:56px;margin-left:-28px;display:grid;place-content:center;border-radius:50%;background:var(--green-deep);color:var(--white);font-family:var(--font-head);font-weight:700;font-size:1.3rem}
:is(.hiro,.editor-styles-wrapper) .recipe-card__link{position:relative;display:flex;flex-direction:column;height:100%;padding:28px 20px 20px;background:var(--white);border-radius:16px;text-decoration:none;color:var(--forest);transition:transform .25s,box-shadow .25s}
:is(.hiro,.editor-styles-wrapper) .recipe-card__link:hover{transform:translateY(-4px);box-shadow:var(--shadow);color:var(--forest)}
:is(.hiro,.editor-styles-wrapper) .recipe-card__img{display:block;margin-top:14px;aspect-ratio:16/10;overflow:hidden;border-radius:10px;background:var(--mist)}
:is(.hiro,.editor-styles-wrapper) .recipe-card__img img{width:100%;height:100%;object-fit:cover}
:is(.hiro,.editor-styles-wrapper) .recipe-card__title{display:block;margin-top:.9em;padding-bottom:.7em;text-align:center;font-family:var(--font-head);font-weight:700;font-size:1.15rem;letter-spacing:.1em;line-height:1.6;background:repeating-linear-gradient(135deg,var(--forest) 0 1px,transparent 1px 3px) bottom/100% 12px no-repeat;padding-bottom:1.3em}
:is(.hiro,.editor-styles-wrapper) .recipe-card__text{display:block;margin-top:.9em;font-size:.93rem;line-height:1.9;letter-spacing:.06em;flex:1}
:is(.hiro,.editor-styles-wrapper) .recipe-card__more{display:block;margin-top:1em;padding-top:.7em;border-top:2px solid var(--forest);font-size:.88rem;letter-spacing:.12em}
:is(.hiro,.editor-styles-wrapper) .big-btn{display:flex;align-items:center;justify-content:space-between;width:min(100%,640px);margin:clamp(36px,6vw,56px) auto 0;padding:1.05em 2em;border-radius:16px;background:var(--lamp);color:var(--night);font-family:var(--font-head);font-weight:700;font-size:clamp(1.1rem,2.6vw,1.5rem);letter-spacing:.14em;text-decoration:none;transition:background .2s,transform .2s}
:is(.hiro,.editor-styles-wrapper) .big-btn:hover{background:var(--lamp-deep);color:var(--night);transform:translateY(-2px)}
@media (max-width:860px){:is(.hiro,.editor-styles-wrapper) .recipe-cards{grid-template-columns:1fr;max-width:440px;margin-inline:auto}}
@media (min-width:861px){:is(.hiro,.editor-styles-wrapper) .recipe-card__title{min-height:5.2em}}

/* ---------- 固定ページの部品（page.css） ---------- */
/* page.css — 固定ページ共通（神経薬膳／舌／ヒロ／お問い合わせ／免責／一覧／食材／ノート） */

/* 流れ（共感→私も同じ→解決の道）… 順序のある内容なので番号を使う */
:is(.hiro,.editor-styles-wrapper) .flow{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);list-style:none;padding:0;counter-reset:flow}
:is(.hiro,.editor-styles-wrapper) .flow li{counter-increment:flow;position:relative;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:48px 22px 24px}
:is(.hiro,.editor-styles-wrapper) .flow li::before{content:counter(flow);position:absolute;top:-18px;left:22px;width:40px;height:40px;display:grid;place-content:center;border-radius:50%;background:var(--green-deep);color:var(--white);font-family:var(--font-head);font-weight:700;box-shadow:0 0 0 5px var(--green-soft)}
:is(.hiro,.editor-styles-wrapper) .flow strong{display:block;font-family:var(--font-head);font-size:1.15rem;color:var(--night);margin-bottom:.4em}
@media (max-width:760px){:is(.hiro,.editor-styles-wrapper) .flow{grid-template-columns:1fr;gap:34px}}

/* テーマ一覧（記事タイトルの予定） */
:is(.hiro,.editor-styles-wrapper) .topic-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
:is(.hiro,.editor-styles-wrapper) .hiro-topic{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px}
:is(.hiro,.editor-styles-wrapper) .hiro-topic h3{font-size:1.05rem;margin-bottom:.6em}
:is(.hiro,.editor-styles-wrapper) .hiro-topic ul{list-style:none;padding:0;display:grid;gap:.4em;font-size:.95rem}
:is(.hiro,.editor-styles-wrapper) .hiro-topic li{padding-left:1.2em;position:relative}
:is(.hiro,.editor-styles-wrapper) .hiro-topic li::before{content:"";position:absolute;left:0;top:.8em;width:.5em;height:.5em;border-radius:50%;background:var(--green)}

/* 体験ブロック */
:is(.hiro,.editor-styles-wrapper) .experience{display:grid;gap:clamp(24px,5vw,56px);grid-template-columns:1fr 1fr;align-items:center}
:is(.hiro,.editor-styles-wrapper) .experience__img{aspect-ratio:3/4;width:min(100%,340px);justify-self:center}
@media (max-width:760px){:is(.hiro,.editor-styles-wrapper) .experience{grid-template-columns:1fr}:is(.hiro,.editor-styles-wrapper) .experience__img{width:min(60%,260px)}}
:is(.hiro,.editor-styles-wrapper) .quote-big{font-family:var(--font-head);font-size:clamp(1.15rem,2.6vw,1.5rem);line-height:2;padding:1.4em 0;text-align:center}
:is(.hiro,.editor-styles-wrapper) .quote-big span{display:block}

/* ヒロ（プロフィール） */
:is(.hiro,.editor-styles-wrapper) .profile{display:grid;gap:clamp(28px,5vw,64px);grid-template-columns:.8fr 1.2fr;align-items:start}
:is(.hiro,.editor-styles-wrapper) .profile__side{position:sticky;top:96px}
:is(.hiro,.editor-styles-wrapper) .profile__img{aspect-ratio:3/4;width:min(100%,320px);margin-inline:auto}
:is(.hiro,.editor-styles-wrapper) .credential{margin-top:24px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:16px 20px}
:is(.hiro,.editor-styles-wrapper) .credential dt{font-size:.82rem;color:var(--ink-soft)}
:is(.hiro,.editor-styles-wrapper) .credential dd{font-weight:700;color:var(--night);margin-bottom:.6em}
:is(.hiro,.editor-styles-wrapper) .credential dd:last-child{margin-bottom:0}
:is(.hiro,.editor-styles-wrapper) .profile__body p{font-family:var(--font-story);line-height:2.15}
:is(.hiro,.editor-styles-wrapper) .profile__body p+p{margin-top:1.4em}
:is(.hiro,.editor-styles-wrapper) .profile__body .lead-line{font-family:var(--font-head);font-size:1.25rem;font-weight:700;color:var(--night)}
@media (max-width:820px){:is(.hiro,.editor-styles-wrapper) .profile{grid-template-columns:1fr}:is(.hiro,.editor-styles-wrapper) .profile__side{position:static}}

/* 食材図鑑 */
:is(.hiro,.editor-styles-wrapper) .ing-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
:is(.hiro,.editor-styles-wrapper) .ing{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;scroll-margin-top:90px}
:is(.hiro,.editor-styles-wrapper) .ing h3{font-size:1.2rem;display:flex;align-items:center;gap:.6em}
:is(.hiro,.editor-styles-wrapper) .ing h3::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px var(--green-soft);flex:none}
:is(.hiro,.editor-styles-wrapper) .ing p{margin-top:.6em;font-size:.95rem}
:is(.hiro,.editor-styles-wrapper) .ing .chips{margin-top:1em}

/* ノート（コラム一覧） */
:is(.hiro,.editor-styles-wrapper) .cat-nav{margin-bottom:32px}
:is(.hiro,.editor-styles-wrapper) .post-list{display:grid;gap:clamp(16px,3vw,28px);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
:is(.hiro,.editor-styles-wrapper) .post-meta{font-size:.82rem;color:var(--ink-soft);display:flex;gap:.8em;flex-wrap:wrap}

/* お問い合わせフォーム */
:is(.hiro,.editor-styles-wrapper) .form{display:grid;gap:22px}
:is(.hiro,.editor-styles-wrapper) .field label,:is(.hiro,.editor-styles-wrapper) .field legend{display:block;font-weight:700;margin-bottom:.4em;font-size:.95rem}
:is(.hiro,.editor-styles-wrapper) .field .req{color:var(--roof);font-size:.8rem;margin-left:.5em}
:is(.hiro,.editor-styles-wrapper) .field input[type=text],:is(.hiro,.editor-styles-wrapper) .field input[type=email],:is(.hiro,.editor-styles-wrapper) .field select,:is(.hiro,.editor-styles-wrapper) .field textarea{width:100%;min-height:48px;padding:.6em .9em;background:var(--white);border:1.5px solid var(--sage);border-radius:10px}
:is(.hiro,.editor-styles-wrapper) .field textarea{min-height:180px}
:is(.hiro,.editor-styles-wrapper) .field input:focus,:is(.hiro,.editor-styles-wrapper) .field select:focus,:is(.hiro,.editor-styles-wrapper) .field textarea:focus{outline:3px solid var(--lamp);border-color:var(--lamp-deep)}
:is(.hiro,.editor-styles-wrapper) .field .radio-row{display:flex;flex-wrap:wrap;gap:10px 22px}
:is(.hiro,.editor-styles-wrapper) .field .radio-row label{font-weight:400;display:inline-flex;gap:.5em;align-items:center;margin:0}

/* 免責・方針 */
:is(.hiro,.editor-styles-wrapper) .policy h2{font-size:1.25rem;margin-top:2.2em}
:is(.hiro,.editor-styles-wrapper) .policy ul{padding-left:1.4em}
:is(.hiro,.editor-styles-wrapper) .policy li+li{margin-top:.4em}

/* ---------- Cocoon の見出し装飾を、ブロックの中だけ打ち消す ---------- */
:is(.hiro,.editor-styles-wrapper) .article .hiro-block :is(h1,h2,h3,h4){padding:0;background:none;border:0;border-radius:0}
:is(.hiro,.editor-styles-wrapper) .article .hiro-block .prose>h2{padding:0 0 .4em;border-bottom:2px solid var(--lamp)}
:is(.hiro,.editor-styles-wrapper) .article .hiro-block .about-teaser h2,:is(.hiro,.editor-styles-wrapper) .article .hiro-block .cta h2{border:0}
:is(.hiro,.editor-styles-wrapper) .hiro-block .prose.hiro-prose>*+*{margin-top:1.2em}
:is(.hiro,.editor-styles-wrapper) .hiro-block .prose.hiro-prose>:first-child{margin-top:0}
:is(.hiro,.editor-styles-wrapper) .hiro-block .prose>h2:first-child{margin-top:0}
/* 注意書き・チェックリストなど、ブロック単体で置いたときの余白 */
:is(.hiro,.editor-styles-wrapper) .entry-content>.hiro-block.notice,:is(.hiro,.editor-styles-wrapper) .entry-content>.hiro-block.check-list,:is(.hiro,.editor-styles-wrapper) .entry-content>.hiro-block.flow,:is(.hiro,.editor-styles-wrapper) .entry-content>.hiro-block.topic-grid{margin-block:1.6em}
:is(.hiro,.editor-styles-wrapper) .hiro-block.section>.hiro-wrap>.prose:empty{display:none}

:is(.hiro,.editor-styles-wrapper) .hiro-block strong{background:none}