/* ===== しろくま：スクロール表示＆ヒーロー演出（追加分） ===== */

/* スクロールで“ふわっと表示” */
.reveal{opacity:0;transform:translateY(16px);
  transition:opacity .9s cubic-bezier(.2,.6,.2,1),transform .9s cubic-bezier(.2,.6,.2,1)}
.reveal.in{opacity:1;transform:none}
/* 写真はフェード＋ほんのりズーム */
main img.reveal{transform:translateY(16px) scale(1.05);
  transition:opacity .9s ease,transform 1.4s cubic-bezier(.2,.6,.2,1)}
main img.reveal.in{transform:none}

/* ヒーローのキャッチ：手書き(Klee)＋1行ずつ左から“書かれる” */
.hero-copy h1{font-family:"Klee One","Zen Old Mincho",serif;font-weight:600;
  text-shadow:0 1px 16px rgba(0,0,0,.24)}
.hero-copy h1 .wl{display:block;clip-path:inset(0 100% 0 0);
  animation:writeIn 1s cubic-bezier(.55,0,.2,1) forwards}
.hero-copy h1 .wl:nth-child(1){animation-delay:.25s}
.hero-copy h1 .wl:nth-child(2){animation-delay:.85s}
.hero-copy h1 .wl:nth-child(3){animation-delay:1.45s}
@keyframes writeIn{to{clip-path:inset(0 0 0 0)}}
/* 書き終わりに続けてサブ→補足→ボタンがフェードイン */
.hero-copy .lead,.hero-copy .opening,.hero-actions{opacity:0;animation:heroFade .9s ease forwards}
.hero-copy .lead{animation-delay:1.7s}
.hero-copy .opening{animation-delay:1.95s}
.hero-actions{animation-delay:2.2s}
@keyframes heroFade{to{opacity:1}}

/* 「視差効果を減らす」設定では静止 */
@media(prefers-reduced-motion:reduce){
  .reveal,.reveal.in{opacity:1!important;transform:none!important;transition:none}
  .hero-copy h1 .wl{clip-path:none!important;animation:none!important}
  .hero-copy .lead,.hero-copy .opening,.hero-actions{opacity:1!important;animation:none!important}
}

/* フッター（紺背景）のロゴを白抜きに（ヘッダーは黒のまま） */
.footer-main .brand img{filter:brightness(0) invert(1)}


/* お問い合わせフォーム（紺背景・Netlify Forms） */
.form-card .contact-form{display:flex;flex-direction:column;gap:.85rem;margin-top:.6rem}
.contact-form label{display:flex;flex-direction:column;gap:.35rem;font-size:.8rem;color:#eaf2f6;letter-spacing:.02em}
.contact-form label span{color:#ffd0c4;font-size:.7rem}
.contact-form input,.contact-form select,.contact-form textarea{font-family:inherit;font-size:.95rem;padding:.6rem .7rem;border:1px solid rgba(255,255,255,.5);border-radius:8px;background:rgba(255,255,255,.96);color:#232628;width:100%}
.contact-form textarea{resize:vertical}
.contact-form .agree{flex-direction:row;align-items:center;gap:.5rem;font-size:.78rem}
.contact-form .agree input{width:auto}
.contact-form button{margin-top:.3rem;background:#fff;color:#213352;border:none;border-radius:9px;padding:.85rem;font-weight:700;font-size:.95rem;cursor:pointer;transition:filter .15s}
.contact-form button:hover{filter:brightness(.94)}
.contact-form small{color:#cfe0e8;font-size:.72rem}
.hp-hidden{position:absolute!important;left:-9999px}

/* 医療・介護関係者向け：利用申込書ダウンロード導線 */
.pro-download{grid-column:1/-1;margin-top:1.6rem;background:#fffefa;color:#183d43;border-radius:8px;padding:1.7rem 1.9rem;display:grid;grid-template-columns:1.05fr 1fr;gap:1.5rem 2.6rem;align-items:center}
.pro-dl-flow{align-self:center}
.pro-dl-kicker{font-family:"Zen Old Mincho",serif;font-size:1.1rem;margin:0 0 .9rem;color:#183d43}
.pro-flow{list-style:none;display:flex;flex-wrap:wrap;padding:0;margin:0;gap:.4rem}
.pro-flow li{flex:1 1 0;min-width:90px;display:flex;flex-direction:column;gap:.4rem;font-size:.8rem;line-height:1.45;position:relative;padding-right:.7rem}
.pro-flow li b{width:1.6rem;height:1.6rem;border-radius:50%;background:#d46e53;color:#fff;display:grid;place-items:center;font-size:.82rem;font-weight:700}
.pro-flow li:not(:last-child)::after{content:"›";position:absolute;right:-.1rem;top:0;color:#c9bfad;font-size:1.1rem}
.pro-dl-button{align-self:center;display:flex;align-items:center;gap:1rem;background:#d46e53;color:#fff;text-decoration:none;padding:1.05rem 1.3rem;border-radius:8px;transition:filter .2s;box-shadow:0 6px 18px rgba(212,110,83,.28)}
.pro-dl-button:hover{filter:brightness(.95)}
.pro-dl-button svg{width:27px;height:27px;flex:none}
.pro-dl-button b{font-family:"Zen Kaku Gothic New",sans-serif;font-size:1.02rem;font-weight:700;display:block;line-height:1.2}
.pro-dl-button small{font-size:.7rem;opacity:.92}
.pro-dl-contact{grid-column:1/-1;display:flex;align-items:baseline;gap:1.6rem;flex-wrap:wrap;border-top:1px solid #e6e1d6;padding-top:1.1rem}
.pro-dl-contact>div{display:flex;align-items:baseline;gap:.55rem}
.pro-dl-contact span{font-size:.7rem;letter-spacing:.12em;color:#7d8f8f}
.pro-dl-contact b{font-family:"Zen Old Mincho",serif;font-size:1.4rem;font-weight:400}
.pro-dl-contact a{color:#183d43;text-decoration:none}
.pro-dl-hint{font-size:.74rem;color:#8a9a99;letter-spacing:0}
.pro-recruit-note{grid-column:1/-1;font-size:.76rem;color:#cfe0e0;margin:1rem 0 0}
.pro-recruit-note a{color:#fff;text-underline-offset:.25em}
@media(max-width:900px){.pro-download{grid-template-columns:1fr;gap:1.3rem}}
@media(max-width:620px){.pro-download{padding:1.3rem}.pro-flow li{min-width:78px}.pro-flow li:not(:last-child)::after{display:none}.pro-dl-contact{gap:.4rem 1.4rem}}

/* Medical downloads: top, professionals section, and page end. */
.pro-flow li b,.pro-dl-button{background:#213352}
.pro-dl-button{box-shadow:0 5px 16px rgba(33,51,82,.15)}
.pro-dl-button span{min-width:0}
.pro-dl-button small{display:block;line-height:1.6;margin-top:5px}
@media(max-width:620px){.pro-box{padding:24px 16px}.pro-dl-button{padding:16px;gap:10px}.pro-dl-button b{line-height:1.6}.pro-dl-button svg{width:20px;height:20px}}
.download-strip{background:#f4f0e8;color:#213352;padding:32px 0;border-block:1px solid #dedbd7}
.download-strip-inner{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.download-strip h2{font-size:1.5rem;margin:0 0 8px}
.download-strip p{margin:0;font-size:.9rem}
.download-strip .kicker{font-size:.8rem;margin-bottom:8px}
.download-strip .pro-dl-button{width:fit-content;max-width:100%;min-height:56px}
.download-strip .pro-dl-button b{line-height:1.5}
.download-strip-contact,.download-strip-links{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center}
.download-strip-contact a,.download-strip-links a{color:inherit;text-underline-offset:4px;overflow-wrap:anywhere}
.download-strip-contact strong{font-size:1.2rem;white-space:nowrap}
.download-strip-last{padding-block:48px}
.download-strip-first{padding-block:22px}
.download-strip-first .download-strip-inner{gap:10px}
.download-strip-first h2{font-size:1.15rem;margin-bottom:4px}
.download-strip-first .kicker{margin-bottom:4px}
.download-strip-first .pro-dl-button{padding:12px 18px;min-height:48px}
.contact-wrap>div{min-width:0}
.contact-status a{overflow-wrap:anywhere}
@media(min-width:761px){.download-strip-inner{padding-right:240px}}
@media(max-width:760px){.download-strip .pro-dl-button{width:100%}.download-strip-contact{align-items:flex-start;flex-direction:column}.download-strip-contact strong{font-size:1.15rem}.download-strip-last{padding-bottom:48px}}
.mail-draft-action{margin:20px 0;max-width:100%}
.mail-draft-action .button{background:#213352;color:#fff;white-space:normal;text-align:center}
.mail-draft-action p{font-size:.82rem;line-height:1.8;margin:10px 0;overflow-wrap:anywhere}
.mail-draft-dialog{width:min(640px,calc(100vw - 32px));max-height:85dvh;box-sizing:border-box;overflow:auto;border:1px solid #b8b5b5;border-radius:20px;padding:24px;color:#213352;background:#fff}
.mail-draft-dialog::backdrop{background:rgba(33,51,82,.5)}
.mail-draft-dialog h2{font-size:1.5rem;clear:both;margin:12px 0}
.mail-draft-dialog p{font-size:.9rem;line-height:1.8}
.mail-draft-dialog label{display:block;font-size:.9rem;margin:14px 0}
.mail-draft-dialog input,.mail-draft-dialog textarea{display:block;width:100%;box-sizing:border-box;margin-top:5px;border:1px solid #b8b5b5;border-radius:8px;background:#fff;padding:10px;font:inherit;font-size:16px;color:#213352}
.mail-draft-dialog textarea{resize:vertical}
.mail-draft-close{float:right;background:#f4f0e8;border:0;border-radius:8px;padding:12px;color:#213352;cursor:pointer;font:inherit}
.mail-draft-options{display:flex;flex-wrap:wrap;gap:10px}
.mail-draft-options .button{background:#213352;color:white;font:inherit;font-size:.9rem;white-space:normal;border:0;cursor:pointer;padding:12px 16px;text-decoration:none}
.mail-draft-dialog :focus-visible{outline:3px solid #54918f;outline-offset:3px}