/*
Theme Name: Senda Digital
Theme URI: https://senda-digital.com
Author: Senda Digital
Author URI: https://senda-digital.com
Description: センダデジタル コーポレートサイト用テーマ
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: senda-digital
*/

/* =========================================================
   design/ の CSS をそのまま流用（:root 変数・共通要素）
   ========================================================= */
:root{
  --c-bg:#FFFFFF; --c-surface:#F4F4F2; --c-line:#E5E5E5; --c-ink:#111111; --c-sub:#666664; --c-aux:#8A8A85; --c-link:#2B4C7E;
  --fs-hero:clamp(28px,4.2vw,44px); --fs-h2:clamp(22px,2.6vw,28px); --fs-h3:clamp(16px,1.7vw,18px); --fs-body:clamp(15px,1.5vw,16px); --fs-aux:clamp(13px,1.3vw,14px);
  --pad-x:clamp(20px,4.5vw,48px); --sec-y:clamp(56px,7vw,88px); --sp-1:24px; --sp-2:40px; --sp-3:64px; --radius:4px;
  --font:"Noto Sans JP","Yu Gothic Medium","游ゴシック Medium",YuGothic,"Hiragino Sans",sans-serif;
}
/* トップページ（front-page.php）のみヒーロー見出しを大きくする（design/index.dc.html準拠） */
body.home{
  --fs-hero:clamp(30px,4.8vw,56px);
}
html{scroll-behavior:smooth}
body{margin:0;background:var(--c-bg);color:var(--c-ink);font-family:var(--font);font-weight:400;font-size:var(--fs-body);line-height:1.9;letter-spacing:0.02em;-webkit-font-smoothing:antialiased}
a{color:var(--c-link);text-decoration:underline;text-underline-offset:3px}
a:hover{color:#1F3A63}
input,select,textarea{font-family:var(--font)}
input:focus,select:focus,textarea:focus{outline:none;border-color:#111111}

/* =========================================================
   アクセシビリティ（design/ に無い追加要件）
   ========================================================= */
.screen-reader-text{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.skip-link{
  position:absolute;
  left:8px;
  top:-48px;
  z-index:100;
  background:var(--c-ink);
  color:#FFFFFF;
  text-decoration:none;
  font-size:14px;
  padding:12px 20px;
  border-radius:var(--radius);
  transition:top .15s ease;
}
.skip-link:focus{
  top:8px;
  color:#FFFFFF;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid var(--c-link);
  outline-offset:2px;
}

/* デザイン上の style-hover を再現するための最小限のクラス */
/* 墨色ベタ塗りのCTA: a:hover 等のグローバルなリンク色より詳細度を上げ、
   通常時・hover・focus・visited・active のすべてで白文字を保証する */
.hover-dark,
a.hover-dark:link,
a.hover-dark:visited,
a.hover-dark:hover,
a.hover-dark:focus,
a.hover-dark:active{
  color:#FFFFFF;
}
.hover-dark:hover,
.hover-dark:focus{
  background:#333333;
  color:#FFFFFF;
}
.hover-dark *{color:inherit}

.hover-link:hover,
.hover-link:focus{color:#2B4C7E}

/* =========================================================
   ヘッダー
   ========================================================= */
.site-header{position:sticky;top:0;z-index:50;background:var(--c-bg);border-bottom:1px solid var(--c-line)}
.site-header .header-inner{max-width:1080px;margin:0 auto;padding:0 var(--pad-x);height:64px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.site-header .site-title{color:var(--c-ink);text-decoration:none;font-size:18px;font-weight:500;letter-spacing:0.04em}
.site-header .primary-nav{display:flex;align-items:center;gap:clamp(16px,2.5vw,32px);flex-wrap:wrap}
.site-header .primary-nav a{color:var(--c-ink);text-decoration:none;font-size:14px}
.site-header .nav-cta{color:#FFFFFF !important;background:var(--c-ink);text-decoration:none;font-size:14px;font-weight:500;padding:10px 20px;border-radius:var(--radius)}
.nav-toggle{display:none}
.nav-toggle-btn{display:none}

@media (max-width:760px){
  .site-header .header-inner{flex-wrap:wrap;height:auto;min-height:64px;padding-top:12px;padding-bottom:12px}
  .nav-toggle-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:40px;height:40px;
    border:1px solid var(--c-line);
    border-radius:var(--radius);
    background:var(--c-bg);
    cursor:pointer;
    padding:0;
  }
  .nav-toggle-btn span{display:block;position:relative;width:18px;height:2px;background:var(--c-ink)}
  .nav-toggle-btn span::before,.nav-toggle-btn span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--c-ink)}
  .nav-toggle-btn span::before{top:-6px}
  .nav-toggle-btn span::after{top:6px}
  .site-header .primary-nav{
    display:none;
    width:100%;
    flex-direction:column;
    align-items:flex-start;
    gap:0;
    order:3;
  }
  .site-header .primary-nav.is-open{display:flex}
  .site-header .primary-nav a{width:100%;padding:12px 0;border-top:1px solid var(--c-line)}
  .site-header .primary-nav .nav-cta{width:auto;margin-top:12px;border-top:none}
}

/* =========================================================
   ヒーロー（トップ）
   ========================================================= */
.sec-hero{padding:clamp(56px,7vw,96px) 0}
.sec-hero .hero-inner{max-width:1080px;margin:0 auto;padding:0 var(--pad-x);display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:flex-start}
.sec-hero .hero-main{flex:7;min-width:300px}
.sec-hero h1{margin:0;font-size:var(--fs-hero);font-weight:500;line-height:1.35;letter-spacing:0.01em}
.sec-hero .hero-sub{margin:var(--sp-1) 0 0;font-size:var(--fs-h3);font-weight:400;color:var(--c-sub);line-height:1.9}
.sec-hero .hero-ctas{margin-top:var(--sp-2);display:flex;align-items:center;gap:var(--sp-1);flex-wrap:wrap}
.btn-primary{color:#FFFFFF;background:var(--c-ink);text-decoration:none;font-size:16px;font-weight:500;padding:16px 32px;border-radius:var(--radius);display:inline-block;border:none;cursor:pointer;font-family:var(--font);letter-spacing:0.02em}
/* a:hover 等の詳細度に負けないよう、ボタンリンクの文字色を全状態で明示 */
a.btn-primary,
a.btn-primary:link,
a.btn-primary:visited,
a.btn-primary:hover,
a.btn-primary:focus,
a.btn-primary:active{
  color:#FFFFFF;
}
.btn-primary *{color:inherit}
.hero-scope{flex:3;min-width:220px;display:flex;flex-direction:column;padding-top:8px}
.hero-scope p{margin:0;border-top:1px solid var(--c-line);padding:14px 0;font-size:14px;color:var(--c-sub);line-height:1.7}
.hero-scope p:last-child{padding-bottom:0}

/* =========================================================
   数字の帯
   ========================================================= */
.sec-stats{border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line)}
.sec-stats .stats-inner{max-width:1080px;margin:0 auto;padding:var(--sp-2) var(--pad-x);display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--sp-1)}
.stat p:first-child{margin:0;font-size:36px;font-weight:500;line-height:1.4}
.stat p:last-child{margin:4px 0 0;font-size:13px;color:var(--c-sub);line-height:1.8}

/* =========================================================
   セクション共通（見出し・番号・下線）
   ========================================================= */
.sec-inner{max-width:1080px;margin:0 auto;padding:0 var(--pad-x)}
.sec-num{margin:0;font-size:13px;letter-spacing:0.1em;color:var(--c-aux)}
.sec-title{margin:12px 0 0;font-size:var(--fs-h2);font-weight:500;line-height:1.6;letter-spacing:0.01em}
.sec-rule{width:32px;border-top:1px solid #111111;margin-top:20px}

/* こんなことで困っていませんか */
.sec-problems{background:var(--c-surface);padding:var(--sec-y) 0}
.problem-grid{margin-top:var(--sp-2);display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--sp-1)}
.card-problem{background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--radius);padding:var(--sp-1);display:flex;gap:16px;align-items:flex-start}
.card-problem svg{flex:none;margin-top:6px}
.card-problem .problem-title{margin:0;font-weight:500;line-height:1.8}
.card-problem .problem-desc{margin:8px 0 0;font-size:var(--fs-aux);color:var(--c-sub);line-height:1.8}

/* できること */
.sec-services{padding:var(--sec-y) 0}
.service-grid{margin-top:var(--sp-2);display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--sp-1)}
.card-service{background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--radius);padding:calc(var(--sp-1) + 8px);display:flex;flex-direction:column;gap:16px}
.card-service h3{margin:0;font-size:var(--fs-h3);font-weight:500;line-height:1.6}
.card-service .service-desc{margin:0;font-size:var(--fs-aux);color:var(--c-sub);line-height:1.9;flex:1}
.card-service .service-examples{border-top:1px solid var(--c-line);padding-top:16px}
.card-service .service-examples p{margin:0;font-size:12px;letter-spacing:0.06em;color:var(--c-aux)}
.card-service .service-examples ul{margin:8px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px}
.card-service .service-examples li{font-size:var(--fs-aux);color:var(--c-sub);line-height:1.8}
.card-service > a{font-size:var(--fs-aux)}
.services-note{margin:var(--sp-1) 0 0;font-size:var(--fs-aux);color:var(--c-aux);line-height:1.8}

/* 料金の目安 */
.sec-pricing{background:var(--c-surface);padding:var(--sec-y) 0}
.pricing-lead{margin:var(--sp-1) 0 0;color:var(--c-sub)}
.pricing-grid{margin-top:var(--sp-2);display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--sp-1)}
.card-pricing{background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--radius);padding:calc(var(--sp-1) + 8px);display:flex;flex-direction:column;gap:16px}
.card-pricing h3{margin:0;font-size:var(--fs-h3);font-weight:500}
.card-pricing .price{margin:0;font-size:var(--fs-h2);font-weight:500;line-height:1.5}
.card-pricing .price small{font-size:var(--fs-aux);font-weight:400;color:var(--c-aux)}
.card-pricing .price-block{border-top:1px solid var(--c-line);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.card-pricing .price-block:last-child{flex:1}
.card-pricing .price-block p:first-child{margin:0;font-size:var(--fs-aux);color:var(--c-aux)}
.card-pricing .price-block p:last-child{margin:0;font-size:var(--fs-aux);color:var(--c-sub);line-height:1.8}

/* 選ばれる理由 */
.sec-reasons{padding:var(--sec-y) 0}
.reason-list{margin-top:var(--sp-3);display:flex;flex-direction:column;gap:var(--sp-3)}
.reason{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.reason .reason-num{margin:0;flex:none;width:80px;font-size:48px;font-weight:500;color:var(--c-line);line-height:1.2}
.reason .reason-body{flex:1;min-width:280px;max-width:680px}
.reason h3{margin:0;font-size:clamp(18px,2.2vw,24px);font-weight:500;line-height:1.6}
.reason p{margin:var(--sp-1) 0 0;line-height:1.9}
.reason p.sub{color:var(--c-sub)}
.reason-divider{border-top:1px solid var(--c-line)}
.reason ul{margin:16px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.reason ul li{display:flex;gap:12px;align-items:flex-start}
.reason ul li .mark{flex:none;width:14px;border-top:1px solid #111111;margin-top:14px}
.reason ul li span.txt{line-height:1.9}

/* プロフィール */
.sec-profile{background:var(--c-surface);padding:var(--sec-y) 0}
.profile-inner{margin-top:var(--sp-2);display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:flex-start}
.profile-photo{width:320px;height:320px;flex:none;max-width:100%;border-radius:4px;object-fit:cover;background:var(--c-line)}
.profile-photo-placeholder{width:320px;height:320px;flex:none;max-width:100%;border-radius:4px;background:var(--c-line);display:flex;align-items:center;justify-content:center;color:var(--c-aux);font-size:var(--fs-aux)}
.profile-body{flex:1;min-width:280px;max-width:600px}
.profile-body .profile-name{margin:0;font-size:var(--fs-h3);font-weight:500}
.profile-body .profile-role{margin-left:12px;font-size:var(--fs-aux);font-weight:400;color:var(--c-aux)}
.profile-body p.profile-text{margin:16px 0 0;line-height:1.9}
.profile-body p.profile-text.sub{color:var(--c-sub)}
.profile-skills{margin-top:var(--sp-1)}
.profile-skills p.label{margin:0;font-size:12px;letter-spacing:0.06em;color:var(--c-aux)}
.profile-skills p.item{margin:0;border-top:1px solid var(--c-line);padding:12px 0;font-size:var(--fs-aux);color:var(--c-sub);line-height:1.7}
.profile-skills p.item:first-of-type{margin-top:8px}
.profile-skills p.item:last-child{padding-bottom:0}

/* 支援事例 */
.sec-cases{padding:var(--sec-y) 0}
.case-grid{margin-top:var(--sp-2);display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--sp-1)}
.card-case{background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--radius);padding:calc(var(--sp-1) + 8px);display:flex;flex-direction:column;gap:16px;text-decoration:none;color:inherit}
.card-case .case-industry{margin:0;font-size:var(--fs-aux);color:var(--c-aux)}
.card-case h3{margin:0;font-size:var(--fs-h3);font-weight:500;line-height:1.6}
.card-case .case-block{border-top:1px solid var(--c-line);padding-top:16px}
.card-case .case-block:last-child{flex:1}
.card-case .case-block p.label{margin:0;font-size:12px;letter-spacing:0.06em;color:var(--c-aux)}
.card-case .case-block p.text{margin:6px 0 0;font-size:var(--fs-aux);color:var(--c-sub);line-height:1.8}

/* ご相談の流れ */
.sec-flow{background:var(--c-surface);padding:var(--sec-y) 0}
.flow-grid{margin-top:var(--sp-2);display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 var(--sp-1)}
.step{border-top:1px solid var(--c-line);padding-top:20px;margin-right:calc(var(--sp-1) * -1);padding-right:var(--sp-1)}
.step:last-child{margin-right:0}
.step .step-num{margin:0;font-size:48px;font-weight:500;color:var(--c-line);line-height:1.2}
.step h3{margin:12px 0 0;font-size:var(--fs-h3);font-weight:500}
.step p{margin:8px 0 24px;font-size:var(--fs-aux);color:var(--c-sub);line-height:1.8}

/* お知らせ */
.sec-news{padding:var(--sec-y) 0}
.news-list{margin-top:var(--sp-2);border-top:1px solid var(--c-line);display:flex;flex-direction:column}
.news-row{display:flex;gap:var(--sp-1);align-items:baseline;flex-wrap:wrap;padding:20px 0;border-bottom:1px solid var(--c-line);text-decoration:none;color:var(--c-ink)}
.news-row .news-date{font-size:var(--fs-aux);color:var(--c-aux);flex:none}
.news-row .news-cat{font-size:var(--fs-aux);color:var(--c-aux);flex:none;width:5em}
.news-row .news-title{font-size:var(--fs-body)}

/* お問い合わせCTA */
.sec-contact-cta{background:var(--c-surface);padding:var(--sec-y) 0}
.sec-contact-cta .cta-inner{max-width:1080px;margin:0 auto;padding:0 var(--pad-x);display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-1)}
.sec-contact-cta h2{margin:0;font-size:var(--fs-h2);font-weight:500;line-height:1.6;letter-spacing:0.01em}
.sec-contact-cta p{margin:0;color:var(--c-sub);line-height:1.9}

/* =========================================================
   フッター
   ========================================================= */
.site-footer{border-top:1px solid var(--c-line);padding:var(--sp-3) 0 var(--sp-2)}
.site-footer .footer-inner{max-width:1080px;margin:0 auto;padding:0 var(--pad-x)}
.site-footer .footer-top{display:flex;justify-content:space-between;gap:var(--sp-2);flex-wrap:wrap}
.site-footer .footer-about{max-width:420px}
.site-footer .footer-about p.footer-brand{margin:0;font-size:var(--fs-h3);font-weight:500}
.site-footer .footer-about p.footer-desc{margin:12px 0 0;font-size:var(--fs-aux);color:var(--c-sub);line-height:1.8}
.site-footer .footer-about p.footer-contact-link{margin:12px 0 0;font-size:var(--fs-aux)}
.site-footer nav.footer-nav{display:flex;flex-direction:column;gap:10px}
.site-footer nav.footer-nav a{color:var(--c-ink);text-decoration:none;font-size:var(--fs-aux)}
.site-footer nav.footer-legal{display:flex;flex-direction:column;gap:10px}
.site-footer nav.footer-legal a{color:var(--c-sub);text-decoration:none;font-size:var(--fs-aux)}
.site-footer .footer-copyright{margin:var(--sp-2) 0 0;font-size:12px;color:var(--c-aux)}

/* サブページ共通フッター（お問い合わせ／お知らせ詳細／サービス詳細 等） */
.site-footer.footer-simple{padding:var(--sp-2) 0}
.site-footer.footer-simple .footer-inner{display:flex;justify-content:space-between;gap:var(--sp-1);flex-wrap:wrap;align-items:baseline}
.site-footer.footer-simple .footer-brand{margin:0;font-size:var(--fs-aux);font-weight:500}
.site-footer.footer-simple nav{display:flex;gap:var(--sp-1);flex-wrap:wrap}
.site-footer.footer-simple nav a{color:var(--c-sub);text-decoration:none;font-size:12px}
.site-footer.footer-simple .footer-copyright{margin:0;font-size:12px;color:var(--c-aux)}

/* =========================================================
   記事・詳細ページ共通
   ========================================================= */
.sec-article,.sec-service-detail,.sec-works-detail,.sec-contact{padding:var(--sec-y) 0}
.article-inner{max-width:680px;margin:0 auto;padding:0 var(--pad-x)}
.breadcrumb{margin:0;font-size:var(--fs-aux);color:var(--c-aux)}
.breadcrumb a{color:var(--c-aux)}
.article-meta{margin-top:var(--sp-1);display:flex;gap:16px;align-items:baseline}
.article-meta span{font-size:var(--fs-aux);color:var(--c-aux)}
.article-title{margin:16px 0 0;font-size:var(--fs-h2);font-weight:500;line-height:1.6;letter-spacing:0.01em}
.article-body{margin-top:var(--sp-2);border-top:1px solid var(--c-line);padding-top:var(--sp-2)}

/* .entry-content タイポグラフィ（design/ の本文設定を踏襲） */
.entry-content{line-height:1.9}
.entry-content > *:first-child{margin-top:0}
.entry-content p{margin:16px 0 0;line-height:1.9}
.entry-content h2{margin:var(--sp-2) 0 0;font-size:var(--fs-h3);font-weight:500;line-height:1.6}
.entry-content h3{margin:var(--sp-1) 0 0;font-size:var(--fs-body);font-weight:500;line-height:1.8}
.entry-content h4,.entry-content h5,.entry-content h6{margin:var(--sp-1) 0 0;font-size:var(--fs-body);font-weight:500;line-height:1.8}
.entry-content ul,.entry-content ol{margin:16px 0 0;padding-left:1.4em;line-height:1.9}
.entry-content li{margin-top:4px}
.entry-content a{color:var(--c-link)}
.entry-content blockquote{margin:16px 0 0;padding:16px 20px;border-left:2px solid var(--c-line);color:var(--c-sub);background:var(--c-surface)}
.entry-content blockquote p{margin:0}
.entry-content img{max-width:100%;height:auto;margin:16px 0 0;border-radius:var(--radius)}
.entry-content figure{margin:16px 0 0}
.entry-content figcaption{margin-top:8px;font-size:var(--fs-aux);color:var(--c-aux)}
.entry-content hr{margin:var(--sp-2) 0 0;border:none;border-top:1px solid var(--c-line)}
.entry-content table{margin:16px 0 0;border-collapse:collapse;width:100%}
.entry-content th,.entry-content td{border:1px solid var(--c-line);padding:10px 12px;text-align:left;font-size:var(--fs-aux)}

/* 一覧ページ（archive / archive-works / search） */
.sec-list{padding:var(--sec-y) 0}
.list-lead{margin:var(--sp-1) 0 0;color:var(--c-sub)}
.pagination-nav{margin-top:var(--sp-2);display:flex;gap:var(--sp-1);flex-wrap:wrap;align-items:center}
.pagination-nav a,.pagination-nav span{font-size:var(--fs-aux)}
.no-results{margin-top:var(--sp-2);color:var(--c-sub);line-height:1.9}

/* お問い合わせフォーム */
.contact-form{margin-top:var(--sp-2);display:flex;flex-direction:column;gap:var(--sp-1)}
.contact-form label{display:flex;flex-direction:column;gap:8px}
.contact-form label > span{font-size:var(--fs-aux);font-weight:500}
.contact-form .req{margin-left:8px;color:var(--c-aux);font-weight:400}
.contact-form input[type="text"],.contact-form input[type="email"],.contact-form input[type="tel"],.contact-form select,.contact-form textarea{
  border:1px solid var(--c-line);border-radius:var(--radius);padding:12px 14px;font-size:16px;background:var(--c-bg);color:var(--c-ink)
}
.contact-form textarea{resize:vertical;line-height:1.8}
.contact-form button[type="submit"]{align-self:flex-start;color:#FFFFFF;background:var(--c-ink);border:none;font-size:16px;font-weight:500;font-family:var(--font);padding:16px 40px;border-radius:var(--radius);cursor:pointer;letter-spacing:0.02em}
.contact-form .form-note{margin:0;font-size:var(--fs-aux);color:var(--c-aux);line-height:1.8}
.contact-lead{margin:var(--sp-1) 0 0;color:var(--c-sub);line-height:1.9}

/* 検索フォーム */
.search-form{display:flex;gap:8px;margin-top:var(--sp-1)}
.search-form input[type="search"]{flex:1;border:1px solid var(--c-line);border-radius:var(--radius);padding:12px 14px;font-size:16px;background:var(--c-bg);color:var(--c-ink)}
.search-form button{color:#FFFFFF;background:var(--c-ink);border:none;font-size:14px;font-weight:500;font-family:var(--font);padding:0 24px;border-radius:var(--radius);cursor:pointer}

/* 404 */
.sec-404{padding:var(--sec-y) 0;text-align:left}
.sec-404 .code{margin:0;font-size:64px;font-weight:500;color:var(--c-line);line-height:1.2}
