/* DINAKpartner 共通スタイル（下層ページ用）。色・フォントはトップページと共通 */
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body { -webkit-font-smoothing: antialiased; }

/* 見出しの背面に置く大きな英字 */
.bigword { font-family: Montserrat, sans-serif; font-weight: 900; line-height: .85; letter-spacing: -.02em;
           font-size: clamp(3.6rem, 11vw, 9.5rem); color: transparent; -webkit-text-stroke: 1.5px #D5E3F6; user-select: none; white-space: nowrap; }
.bigword--dark { -webkit-text-stroke: 1.5px rgba(255,255,255,.12); }
.eyebrow { font-family: Montserrat, sans-serif; font-weight: 800; letter-spacing: .2em; font-size: .75rem; text-transform: uppercase; }

/* ヒーロー */
.hero { background:
          radial-gradient(60rem 40rem at 85% -10%, rgba(56,198,244,.35), transparent 60%),
          radial-gradient(50rem 40rem at -10% 110%, rgba(30,107,224,.55), transparent 60%),
          linear-gradient(135deg, #071A3D 0%, #0A3D91 55%, #1E6BE0 100%); }
.hero-grid { background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
             background-size: 56px 56px; mask-image: linear-gradient(180deg, #000 30%, transparent 95%); -webkit-mask-image: linear-gradient(180deg, #000 30%, transparent 95%); }
.hero-photo { opacity: .22; mix-blend-mode: luminosity; mask-image: linear-gradient(90deg, transparent 0%, #000 60%); -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 60%); }
.glass { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.grad-text { background: linear-gradient(90deg, #7FD8FF, #38C6F4 40%, #FFFFFF); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hl { background: linear-gradient(transparent 62%, rgba(56,198,244,.35) 62%); }

/* カード：ホバーで青に反転 */
.card { position: relative; background: #fff; border: 1px solid #E2E9F3; border-radius: 20px; overflow: hidden; transition: transform .25s, box-shadow .25s, border-color .25s; }
.card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, #0A3D91, #1E6BE0); opacity: 0; transition: opacity .3s; }
.card > * { position: relative; }
.card-hover:hover { transform: translateY(-4px); border-color: transparent; box-shadow: 0 20px 40px -12px rgba(10,61,145,.45); }
.card-hover:hover::before { opacity: 1; }
.card-hover:hover, .card-hover:hover .card-sub, .card-hover:hover .card-more, .card-hover:hover li { color: #fff; }
.card-hover:hover .card-icon { background: rgba(255,255,255,.15); color: #fff; }
.card-hover:hover .card-no { -webkit-text-stroke-color: rgba(255,255,255,.35); }
.card-hover:hover .text-brand { color: #A5E6FF; }
.card-no { font-family: Montserrat, sans-serif; font-weight: 900; font-size: 3rem; line-height: 1; color: transparent; -webkit-text-stroke: 1.2px #C9D9F0; }

/* よくある質問 */
.faq summary { list-style: none; cursor: pointer; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary .faq-icon { transition: transform .25s; }
.faq[open] summary .faq-icon { transform: rotate(45deg); }

/* フォーム */
.field { width: 100%; border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.08); color: #fff; border-radius: 12px; padding: .8rem 1rem; outline: none; transition: border-color .2s, background .2s; }
.field::placeholder { color: rgba(255,255,255,.45); }
.field:focus { border-color: #38C6F4; background: rgba(255,255,255,.12); }
select.field option { color: #0B1B33; }

/* 横スクロールのギャラリー */
.scroller { scroll-snap-type: x mandatory; scrollbar-width: thin; }
.scroller > * { scroll-snap-align: start; }

/* スクロールでふわっと表示 */
.fade { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.fade.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .fade { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }
