/* finish.css — 問い合わせの3導線とフッターの作り直し（2026-09-23 Claude）。最後に読む */

/* ===== 問い合わせ：同じ大きさの3枚。電話を主役（オレンジ）に ===== */
.cta3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cta-card{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;min-height:236px;padding:28px 28px 24px;border:1px solid #ffffff2b;border-radius:8px;background:linear-gradient(160deg,#ffffff12,#ffffff04);color:#fff;transition:transform .45s cubic-bezier(.16,.84,.24,1),border-color .45s,box-shadow .45s}
.cta-card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,#f57b26,#ff9a4d);transform:translateY(101%);transition:transform .55s cubic-bezier(.7,0,.2,1)}
.cta-head{display:flex;align-items:center;gap:14px}
.cta-icon{flex:none;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;border:1px solid #f57b26;color:#ff9b43;transition:background .45s,color .45s,border-color .45s}
.cta-icon svg{width:22px;height:22px}
.cta-label{font:700 11px/1.6 Arial,var(--sans),sans-serif;letter-spacing:.12em;color:#b9c6d6;transition:color .45s}
.cta-title{display:block;margin:auto 0 18px;padding-top:26px;font-size:26px;font-weight:800;line-height:1.35;letter-spacing:-.01em}
.cta-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;border-top:1px solid #ffffff21;transition:border-color .45s}
.cta-sub{font-size:12px;line-height:1.7;color:#b9c6d6;transition:color .45s}
.cta-go{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#ffffff14;font-size:18px;transition:transform .45s cubic-bezier(.3,1.5,.5,1),background .45s,color .45s}
/* 電話：主役 */
.cta-card--tel{background:linear-gradient(135deg,#f57b26,#ff9244);border-color:#f57b26;color:#0c1b2d;box-shadow:0 20px 50px #f57b2633}
.cta-card--tel::before{background:linear-gradient(135deg,#ff9244,#ffb178)}
.cta-card--tel .cta-icon{background:#0c1b2d;border-color:#0c1b2d;color:#ff9b43}
.cta-card--tel .cta-label,.cta-card--tel .cta-sub{color:#0c1b2dcc}
.cta-card--tel .cta-title{font:900 clamp(30px,2.9vw,40px)/1.15 Arial,sans-serif;letter-spacing:-.03em;white-space:nowrap}
.cta-card--tel .cta-foot{border-top-color:#0c1b2d33}
.cta-card--tel .cta-go{background:#0c1b2d;color:#ff9b43}
/* ホバー：下からオレンジが満ちる */
.cta-card:hover{transform:translateY(-6px);border-color:#f57b26;box-shadow:0 26px 60px #00000055}
.cta-card:hover::before{transform:none}
.cta-card:not(.cta-card--tel):hover{color:#0c1b2d}
.cta-card:not(.cta-card--tel):hover .cta-label,.cta-card:not(.cta-card--tel):hover .cta-sub{color:#0c1b2dcc}
.cta-card:not(.cta-card--tel):hover .cta-icon{background:#0c1b2d;border-color:#0c1b2d}
.cta-card:not(.cta-card--tel):hover .cta-foot{border-top-color:#0c1b2d33}
.cta-card:hover .cta-go{transform:rotate(45deg);background:#0c1b2d;color:#ff9b43}
.closing-note{margin-top:18px}
@media (max-width:1000px){
  .cta3{grid-template-columns:1fr 1fr}
  .cta-card--tel{grid-column:1/-1;min-height:0}
  .cta-card--tel .cta-title{font-size:40px}
}
@media (max-width:600px){
  .cta3{grid-template-columns:1fr;gap:12px}
  .cta-card{min-height:0;padding:20px 20px 18px}
  .cta-icon{width:44px;height:44px}
  .cta-title{padding-top:18px;margin-bottom:14px;font-size:22px}
  .cta-card--tel .cta-title{font-size:clamp(30px,10vw,40px)}
  .cta-go{width:38px;height:38px}
}
@media (prefers-reduced-motion:reduce){.cta-card,.cta-card::before,.cta-go{transition:none}}

/* ===== フッター：紺で締める ===== */
.closing-footer{position:relative;overflow:clip;background:#08131f var(--noise);color:#cfd9e5;padding:84px 0 0;border-top:1px solid #ffffff14}
.closing-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#f57b26,#ffb178 40%,transparent 75%)}
.closing-footer-main{gap:70px;padding-bottom:48px;border-bottom:1px solid #ffffff17;margin-bottom:0}
.closing-brand>a>span{color:#ff9b43;letter-spacing:.16em}
.closing-brand strong{color:#fff;font-size:28px}
.closing-brand strong>span{color:#cfd9e5}
.closing-brand p{color:#cfd9e5;font-size:13px}
.closing-brand small{color:#7d8fa3}
.footer-nap{color:#9fb0c3;border-left:2px solid #f57b26;padding-left:14px;margin-top:24px}
.footer-tel{margin-top:24px;padding:16px 22px;border:1px solid #ffffff2b;border-radius:8px;color:#fff;transition:border-color .3s,background .3s}
.footer-tel:hover{border-color:#f57b26;background:#f57b2614}
.footer-tel small{color:#ff9b43}
.footer-sitemap>div>span{color:#fff;font-size:12px;letter-spacing:.1em;border-bottom:0;padding-bottom:0;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.footer-sitemap>div>span::before{content:"";width:18px;height:2px;background:#f57b26}
.footer-sitemap a{color:#aebccd;padding-left:0;transition:color .3s,translate .3s}
.footer-sitemap a::before{display:none}
.footer-sitemap a:not(.is-planned):hover{color:#fff;text-decoration:none;translate:4px 0}
.footer-sitemap a.is-planned{color:#7d8fa3}
.closing-legal{padding:22px 0 0;font-size:11px;color:#9fb0c3}
.closing-legal a{color:#cfd9e5}
.closing-legal>small{color:#7d8fa3;font-size:11px}
.closing-top{border-color:#ffffff38;color:#fff;border-radius:50%;width:42px;height:42px;transition:background .3s,border-color .3s}
.closing-top:hover{background:#f57b26;border-color:#f57b26;color:#0c1b2d}
.closing-footer .image-disclosure{color:#7d8fa3}
.footer-wordmark{margin:44px 0 -.14em;font:900 clamp(72px,15.5vw,250px)/.8 Arial,sans-serif;letter-spacing:-.06em;text-align:center;white-space:nowrap;color:transparent;-webkit-text-stroke:1px #ffffff21;background:linear-gradient(90deg,transparent,#f57b2626,transparent) 50% 100%/100% 1px no-repeat;user-select:none;pointer-events:none}
@supports not (-webkit-text-stroke:1px #fff){.footer-wordmark{color:#ffffff0d}}
@media (max-width:600px){
  .closing-footer{padding-top:56px}
  .closing-footer-main{gap:36px;padding-bottom:36px}
  .closing-brand strong{font-size:22px}
  .footer-wordmark{margin-top:30px}
}

/* スマホ下部の固定ボタンに隠れないよう余白 */
@media (max-width:700px){.closing-footer{padding-bottom:64px}}

/* ===== ヒーローの「無料」バッジ：回る円周文字＋オレンジの芯 ===== */
.hero-free-badge.hfb{width:156px;height:156px;padding:0;border:1px solid #ffffff3d;border-radius:50%;background:radial-gradient(circle,#0c1b2d80 0 60%,#0c1b2dd9 61%);box-shadow:0 18px 50px #0006;transform:none;display:grid;place-items:center;color:#fff}
.hfb-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hfb-ring text{fill:#fff;font:700 12px Arial,var(--sans),sans-serif;letter-spacing:.06em}
.hfb-core{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:92px;height:92px;border-radius:50%;background:linear-gradient(140deg,#ff9a4d,#f57b26 60%,#e2650f);color:#0c1b2d;box-shadow:inset 0 -6px 14px #0000001f,0 6px 18px #f57b2659;transition:transform .45s cubic-bezier(.3,1.5,.5,1)}
.hfb-core small{font-size:9px!important;font-weight:800;letter-spacing:.02em;line-height:1.2}
.hfb-core strong{font-size:31px!important;font-weight:900;line-height:1.05!important;letter-spacing:-.04em!important;margin-top:2px}
.hfb-core i{font-style:normal;font-size:12px;line-height:1;margin-top:1px;transition:transform .35s}
.hfb:hover .hfb-core{transform:scale(1.07)}
.hfb:hover .hfb-core i{transform:translate(2px,-2px)}
@media (prefers-reduced-motion:no-preference){.hfb-ring{animation:hfbSpin 22s linear infinite}.hfb:hover .hfb-ring{animation-duration:8s}}
@keyframes hfbSpin{to{transform:rotate(360deg)}}
@media (max-width:1000px){.hero-free-badge.hfb{width:132px;height:132px}.hfb-core{width:78px;height:78px}.hfb-core strong{font-size:26px!important}.hfb-core small{font-size:8px!important}.hfb-ring text{font-size:13px}}
@media (max-width:700px){.hero-free-badge.hfb{width:116px;height:116px;border-width:1px}.hfb-core{width:68px;height:68px}.hfb-core strong{font-size:23px!important}.hfb-core small{font-size:7px!important}.hfb-core i{display:none}}

/* ===== ロゴ（マーク＋社名）===== */
.site-header .brand{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:12px;align-items:center;justify-content:start}
.site-header .brand .brand-mark{grid-row:1/3;width:44px;height:44px;border-radius:10px}
.site-header .brand .brand-kicker{align-self:end}
.site-header .brand .brand-name{align-self:start}
.closing-brand>a:first-child{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center}
.closing-brand>a:first-child .brand-mark{grid-row:1/3;width:52px;height:52px;border-radius:12px;box-shadow:0 0 0 1px #ffffff2e}
.closing-brand>a:first-child>span{margin-bottom:2px!important;align-self:end}
.closing-brand>a:first-child>strong{align-self:start}
@media (max-width:700px){.site-header .brand{column-gap:9px}.site-header .brand .brand-mark{width:36px;height:36px;border-radius:8px}.closing-brand>a:first-child .brand-mark{width:44px;height:44px}}

/* ===== スマホのヒーロー：文字の面と写真を1枚に（写真を背景に敷く）===== */
@media (max-width:700px){
  .impact-hero{display:block;position:relative;min-height:0;isolation:isolate;overflow:hidden}
  .impact-hero-visual{position:absolute;inset:0;z-index:-1;min-height:0}
  .impact-hero-visual>img{object-position:72% 38%}
  .impact-hero-visual::before{display:none}
  .visual-overlay{background:linear-gradient(180deg,#0c1b2dd9 0%,#0c1b2d9e 38%,#0c1b2dc2 68%,#0c1b2df5 100%),var(--noise)}
  .impact-hero-copy{background:transparent;padding:26px 22px 104px}
  /* 削る：英字の地域表記・補足の一文・写真側の添え書き・縦書き */
  .impact-eyebrow{font-size:0;margin-bottom:18px}
  .impact-eyebrow>span{font-size:11px}
  .impact-hero-support,.hero-image-copy>span,.hero-vertical{display:none}
  .impact-hero h1{font-size:clamp(50px,15vw,70px)}
  .impact-hero-lead{margin-top:16px;font-size:14px}
  .impact-actions{margin-top:20px}
  .hero-permit{margin-top:16px}
  /* RE:START. は左下に白抜きで、無料バッジは右下に */
  .hero-image-copy{left:22px;right:auto;bottom:30px;text-align:left}
  .hero-image-copy>strong{font-size:min(11.5vw,50px);line-height:1;color:transparent;-webkit-text-stroke:1.2px #ffffffd9;letter-spacing:-.05em}
  .hero-free-badge.hfb{top:auto;bottom:14px;right:14px;width:94px;height:94px}
  .hfb-core{width:56px;height:56px}
  .hfb-core strong{font-size:19px!important}
  .hfb-core small{font-size:6px!important}
  .hfb-ring text{font-size:14px}
}
@media (max-width:370px){.impact-hero-copy{padding:22px 18px 96px}.hero-free-badge.hfb{width:86px;height:86px}.hfb-core{width:52px;height:52px}}

/* 矢印「↗」をiPhoneで絵文字にしない */
body{font-variant-emoji:text}

/* ===== スマホ：ヒーロー下の01〜03を横3列にそろえる ===== */
@media (max-width:600px){
  .proof-ribbon{grid-template-columns:repeat(3,minmax(0,1fr));padding:20px 8px 22px}
  .proof-ribbon>div{flex-direction:column;align-items:center;text-align:center;gap:6px;padding:2px 8px;border-bottom:0;border-right:1px solid #ffffff21}
  .proof-ribbon>div:last-of-type{border-right:0}
  .proof-ribbon>div>span{font-size:26px;min-width:0;line-height:1}
  .proof-ribbon p{line-height:1.5}
  .proof-ribbon strong{font-size:12.5px;line-height:1.5;text-wrap:balance}
  .proof-ribbon small{display:none}
}
@media (max-width:360px){.proof-ribbon>div{padding:2px 5px}.proof-ribbon strong{font-size:11.5px}}

/* ===== スマホ下部の固定ボタン：電話を紺＋大きな白い番号で目立たせる ===== */
@media (max-width:700px){
  .mobile-contact{grid-template-columns:1.18fr 1fr;background:#0c1b2d;box-shadow:0 -6px 24px #0c1b2d40;border-top:2px solid #f57b26}
  .mobile-contact a{min-height:64px;padding:9px 10px;flex-direction:row;gap:10px;text-align:left}
  .mobile-contact .mc-tel{background:#0c1b2d;color:#fff;justify-content:center}
  .mobile-contact .mc-cta{background:var(--orange);color:#0c1b2d;justify-content:center;gap:8px}
  .mobile-contact .mc-icon{position:relative;flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--orange);color:#0c1b2d;font-size:0}
  .mobile-contact .mc-icon svg{width:18px;height:18px}
  .mobile-contact .mc-txt{display:flex;flex-direction:column;font-size:0;font-family:var(--sans);letter-spacing:0;line-height:1.25}
  .mobile-contact .mc-txt small{font-size:10px;font-weight:700;letter-spacing:.02em}
  .mobile-contact .mc-tel small{color:#ffb178}
  .mobile-contact .mc-cta small{color:#0c1b2dcc}
  .mobile-contact .mc-tel b{font:900 19px/1.2 Arial,sans-serif;letter-spacing:-.02em;margin-top:2px}
  .mobile-contact .mc-cta b{font-size:13.5px;font-weight:800;margin-top:2px}
  .mobile-contact .mc-arrow{font-size:18px;font-family:Arial,sans-serif}
}
@media (max-width:360px){.mobile-contact .mc-tel b{font-size:16px}.mobile-contact .mc-cta b{font-size:12px}.mobile-contact .mc-icon{width:30px;height:30px}.mobile-contact a{gap:7px;padding-inline:6px}}
@media (max-width:700px) and (prefers-reduced-motion:no-preference){
  .mobile-contact .mc-icon::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #f57b26;animation:ring 2.4s 1.5s ease-out infinite}
}
/* 01〜03の見出し：PCは1行、スマホは句ごとに2行（言葉の途中で折らない） */
.pr-l{white-space:nowrap}
@media (max-width:600px){.proof-ribbon strong .pr-l{display:block}.proof-ribbon>div{align-self:start}}

/* ===== 概要（まとめ）：AI検索・読み手の両方が要点を拾える一覧 ===== */
.glance-section{background:#f5f7fa}
.glance{margin:0;display:grid;grid-template-columns:1fr 1fr;border-top:2px solid #152a43;background:#fff;box-shadow:0 20px 50px #0d20300d}
.glance>div{display:grid;grid-template-columns:150px 1fr;gap:18px;padding:22px 26px;border-bottom:1px solid #e3e8ee}
.glance>div:nth-child(odd){border-right:1px solid #e3e8ee}
.glance>div:last-child{grid-column:1/-1;border-right:0}
.glance dt{font-size:13px;font-weight:800;color:#152a43;display:flex;align-items:flex-start;gap:10px;line-height:1.8}
.glance dt::before{content:"";flex:none;width:8px;height:8px;margin-top:.65em;border-radius:50%;background:#f57b26}
.glance dd{margin:0;font-size:14px;line-height:1.9;color:#3f4d5e}
.glance dd a{color:#152a43;font-weight:800;border-bottom:1px solid #f57b26}
@media (max-width:1000px){.glance{grid-template-columns:1fr}.glance>div{border-right:0!important}}
@media (max-width:600px){.glance>div{grid-template-columns:1fr;gap:4px;padding:16px 18px}.glance dd{font-size:13.5px}}
