/*
Theme Name: 加藤通信 プロトタイプ（確認用）
Theme URI: -
Author: 加藤通信 新サイト制作
Description: 有限会社加藤通信 新サイトプロトタイプの検証用テーマ。ホーム／会社案内／業務内容／採用情報／お問い合わせ／SNS の6ページ構成。写真は仮置きです。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: katou-proto
*/

:root{
  --kt-bg:#f4f1ea; --kt-ink:#1c1a17; --kt-blue:#1c7cc2; --kt-blue-l:#9bc7e8;
  --kt-muted:#6b6457; --kt-sub:#8a8273; --kt-line:#e3ddd0; --kt-line2:#efeae0;
  --kt-cream:#faf8f3; --kt-dim:#bcb4a5;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--kt-bg); color:var(--kt-ink);
  font-family:'Zen Kaku Gothic New',"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  -webkit-font-smoothing:antialiased; line-height:1.7;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--kt-blue); text-decoration:none}
a:hover{color:#155f96}
h1,h2,h3,p{margin:0}
.kt-wrap{max-width:1180px; margin:0 auto; padding:0 22px}
.kt-en{font-family:'Yomogi',cursive; font-size:14px; color:var(--kt-blue)}
.kt-en--light{color:var(--kt-blue-l)}
.kt-skip{position:absolute; left:-9999px}

/* ribbon */
.kt-ribbon{background:var(--kt-blue); color:#fff; font-size:11.5px; text-align:center; padding:5px 14px; letter-spacing:.03em}

/* header */
.kt-header{position:sticky; top:0; z-index:50; background:rgba(244,241,234,.92); backdrop-filter:blur(10px); border-bottom:1px solid #ddd6c8}
.kt-header__inner{max-width:1180px; margin:0 auto; padding:13px 22px; display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap}
.kt-logo{display:flex; align-items:center; gap:10px; color:inherit}
.kt-logo:hover{color:inherit}
.kt-logo__mark{width:38px; height:38px; border-radius:9px; background:var(--kt-ink); display:flex; align-items:center; justify-content:center; flex:0 0 auto}
.kt-logo__name{display:block; font-size:16px; font-weight:900; line-height:1.1}
.kt-logo__sub{display:block; font-size:10px; color:var(--kt-sub); letter-spacing:.08em; font-family:'Yomogi',cursive}
.kt-nav{display:flex; align-items:center; gap:3px; flex-wrap:wrap}
.kt-nav__link{font-size:13.5px; font-weight:700; padding:9px 12px; border-radius:7px; color:#5e5647; transition:color .15s}
.kt-nav__link:hover,.kt-nav__link.is-active{color:var(--kt-blue)}
.kt-btn{display:inline-block; background:var(--kt-blue); color:#fff; font-weight:800; border-radius:9px; padding:14px 26px; font-size:15px}
.kt-btn:hover{background:#166ba8; color:#fff}
.kt-btn--sm{font-size:13px; padding:9px 16px; border-radius:7px; margin-left:6px}
.kt-btn--ghost{background:rgba(255,255,255,.08); color:#f4f1ea; border:1px solid rgba(255,255,255,.2)}
.kt-btn--ghost:hover{background:rgba(255,255,255,.16); color:#fff}

/* hero */
.kt-hero{position:relative; background:var(--kt-ink); color:var(--kt-bg); overflow:hidden}
.kt-hero__bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 40%}
.kt-hero--recruit .kt-hero__bg{object-position:center 45%}
.kt-hero__scrim{position:absolute; inset:0; background:linear-gradient(90deg,rgba(12,14,16,.92) 0%,rgba(12,14,16,.7) 45%,rgba(12,14,16,.35) 100%)}
.kt-hero__inner{position:relative; max-width:1180px; margin:0 auto; padding:78px 22px 84px}
.kt-badge{display:inline-flex; align-items:center; gap:8px; border:1px solid rgba(155,199,232,.4); color:var(--kt-blue-l); font-size:12px; font-weight:700; letter-spacing:.08em; padding:6px 13px; border-radius:20px; margin-bottom:24px}
.kt-badge__dot{width:7px; height:7px; background:var(--kt-blue); border-radius:50%}
.kt-hero h1{font-size:clamp(34px,6vw,60px); font-weight:900; line-height:1.16; letter-spacing:-.01em}
.kt-hero__lead{margin-top:22px; font-size:clamp(14px,2vw,17px); color:var(--kt-dim); line-height:1.9; max-width:560px}
.kt-hero__actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:34px}

/* page head (dark) */
.kt-pagehead{background:var(--kt-ink); color:var(--kt-bg)}
.kt-pagehead__inner{max-width:1180px; margin:0 auto; padding:56px 22px}
.kt-pagehead h1{margin:6px 0 10px; font-size:clamp(28px,5vw,42px); font-weight:900}
.kt-pagehead p{font-size:15px; color:var(--kt-dim); line-height:1.8; max-width:640px}

/* section */
.kt-sec{max-width:1180px; margin:0 auto; padding:54px 22px 10px}
.kt-sec--first{padding-top:60px}
.kt-sec--last{padding-bottom:78px}
.kt-sec h2{margin:4px 0 22px; font-size:26px; font-weight:900}
.kt-sec__lead{margin:0 0 26px; font-size:13.5px; color:var(--kt-muted); line-height:1.7}

/* facts */
.kt-facts{background:#fff; border-bottom:1px solid var(--kt-line)}
.kt-facts__grid{max-width:1180px; margin:0 auto; padding:0 22px; display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.kt-fact{padding:26px 18px; border-right:1px solid var(--kt-line2)}
.kt-fact__k{font-size:11px; color:var(--kt-sub); font-weight:700; letter-spacing:.06em}
.kt-fact__v{font-size:19px; font-weight:900; margin-top:5px}

/* grids */
.kt-grid{display:grid; gap:18px}
.kt-grid--4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.kt-grid--3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.kt-grid--svc{grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px}

/* card */
.kt-card{display:block; background:#fff; border:1px solid var(--kt-line); border-radius:12px; overflow:hidden; color:inherit; transition:transform .2s, box-shadow .2s}
.kt-card:hover{transform:translateY(-4px); box-shadow:0 20px 36px -18px rgba(28,26,23,.4); color:inherit}
.kt-card__media{height:130px; position:relative; overflow:hidden}
.kt-card__media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.kt-card__no{position:absolute; top:12px; left:12px; width:34px; height:34px; border-radius:8px; background:rgba(28,26,23,.85); color:var(--kt-blue); display:flex; align-items:center; justify-content:center; font-weight:900}
.kt-card__body{padding:16px 18px 20px}
.kt-card__title{font-size:17px; font-weight:900}
.kt-card__desc{font-size:12.5px; color:var(--kt-muted); line-height:1.65; margin-top:6px}
.kt-card__more{font-size:12px; color:var(--kt-blue); font-weight:800; margin-top:12px}

/* dark banner */
.kt-panel{background:var(--kt-ink); color:var(--kt-bg); border-radius:16px; padding:44px 40px; position:relative; overflow:hidden}
.kt-panel__glow{position:absolute; bottom:-70px; left:-40px; width:260px; height:260px; background:radial-gradient(circle,rgba(28,124,194,.35),transparent 65%)}
.kt-panel__glow--tr{top:-60px; right:-30px; bottom:auto; left:auto; width:240px; height:240px; background:radial-gradient(circle,rgba(28,124,194,.32),transparent 65%)}
.kt-banner{display:flex; flex-wrap:wrap; gap:26px; align-items:center; justify-content:space-between}
.kt-banner__body{position:relative; max-width:600px}
.kt-banner h2{margin:6px 0 10px; font-size:28px; font-weight:900; line-height:1.35}
.kt-banner p{font-size:14px; color:var(--kt-dim); line-height:1.8}
.kt-banner .kt-btn{position:relative; font-size:16px; padding:16px 30px; border-radius:10px; white-space:nowrap}

/* service */
.kt-svc{background:#fff; border:1px solid var(--kt-line); border-radius:12px; overflow:hidden}
.kt-svc__media{height:170px; position:relative; overflow:hidden; display:flex; align-items:flex-end; padding:13px}
.kt-svc__media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.kt-svc__mark{position:absolute; top:13px; left:13px; width:40px; height:40px; border-radius:9px; background:rgba(28,26,23,.85); display:flex; align-items:center; justify-content:center}
.kt-svc__tag{position:relative; font-size:10.5px; font-weight:700; color:var(--kt-bg); background:rgba(28,26,23,.6); padding:3px 9px; border-radius:20px}
.kt-svc__body{padding:18px 20px 22px}
.kt-svc__title{font-size:18px; font-weight:900}
.kt-svc__desc{font-size:13px; color:var(--kt-muted); line-height:1.7; margin-top:8px}
.kt-note{display:flex; gap:11px; align-items:flex-start; background:#fff; border:1px solid var(--kt-line); border-left:4px solid var(--kt-blue); border-radius:8px; padding:20px 22px; margin-top:22px}
.kt-note__k{font-family:'Yomogi',cursive; color:var(--kt-blue); font-weight:700; font-size:13px; white-space:nowrap}
.kt-note p{font-size:13.5px; line-height:1.8; color:#5e5647}

/* recruit points */
.kt-point{background:#fff; border:1px solid var(--kt-line); border-top:4px solid var(--kt-blue); border-radius:12px; padding:24px 24px 26px}
.kt-point__ico{width:44px; height:44px; border-radius:10px; background:var(--kt-ink); display:flex; align-items:center; justify-content:center; margin-bottom:14px; font-size:22px}
.kt-point__title{font-size:17px; font-weight:900; line-height:1.4}
.kt-point p{margin-top:8px; font-size:13px; color:var(--kt-muted); line-height:1.75}

/* day flow */
.kt-day{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px}
.kt-daycard{background:#fff; border:1px solid var(--kt-line); border-radius:12px; overflow:hidden; display:flex; flex-direction:column}
.kt-daycard__media{height:118px; position:relative; overflow:hidden}
.kt-daycard__media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.kt-daycard__body{padding:16px 20px 20px}
.kt-daycard__time{display:block; font-family:'Yomogi',cursive; font-size:19px; font-weight:700; color:var(--kt-blue); line-height:1; margin-bottom:8px}
.kt-daycard__title{font-size:16px; font-weight:900}
.kt-daycard p{margin-top:6px; font-size:12.5px; color:var(--kt-muted); line-height:1.7}

/* instagram block */
.kt-ig{display:block; background:var(--kt-ink); color:var(--kt-bg); border-radius:16px; padding:38px 40px; position:relative; overflow:hidden}
.kt-ig:hover{color:var(--kt-bg)}
.kt-ig__inner{position:relative; display:flex; flex-wrap:wrap; gap:26px; align-items:center; justify-content:space-between}
.kt-ig__body{max-width:520px}
.kt-ig__id{display:inline-flex; align-items:center; gap:9px; margin-bottom:14px}
.kt-ig__mark{width:44px; height:44px; border-radius:11px; background:rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center}
.kt-ig__handle{display:block; font-size:17px; font-weight:900; line-height:1.2}
.kt-ig__note{display:block; font-size:11.5px; color:var(--kt-blue-l); font-family:'Yomogi',cursive}
.kt-ig p{font-size:14px; color:var(--kt-dim); line-height:1.85}
.kt-ig .kt-btn{margin-top:18px; font-size:14px; padding:12px 24px}
.kt-ig__thumbs{display:grid; grid-template-columns:repeat(3,72px); gap:7px}
.kt-ig__thumb{aspect-ratio:1; border-radius:8px; position:relative; overflow:hidden}
.kt-ig__thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}

/* definition table */
.kt-table{background:#fff; border:1px solid var(--kt-line); border-radius:12px; overflow:hidden}
.kt-table__head{padding:20px 24px; border-bottom:1px solid var(--kt-line2); font-size:17px; font-weight:900}
.kt-row{display:flex; flex-wrap:wrap; border-top:1px solid var(--kt-line2)}
.kt-row:first-child{border-top:0}
.kt-row__k{flex:0 0 180px; background:var(--kt-cream); padding:16px 22px; font-size:13.5px; font-weight:900}
.kt-row__v{flex:1 1 260px; padding:16px 22px; font-size:13.5px; color:#3a352c; line-height:1.75}
.kt-table--sm .kt-row__k{flex:0 0 108px; padding:14px 18px; font-size:13px; font-weight:800}
.kt-table--sm .kt-row__v{padding:14px 18px; font-size:13px}

/* representative message */
.kt-msg{display:flex; flex-wrap:wrap; gap:30px; align-items:center}
.kt-msg__photo{flex:0 0 auto; width:128px; height:128px; border-radius:50%; background:#e7e2d8; display:flex; flex-direction:column; align-items:center; justify-content:center;
  background-image:repeating-linear-gradient(45deg,rgba(28,26,23,.055) 0 10px,rgba(28,26,23,0) 10px 20px)}
.kt-msg__photo span:first-child{font-size:44px}
.kt-msg__cap{font-size:8px; color:var(--kt-sub); font-family:monospace; margin-top:2px}
.kt-msg__body{flex:1 1 320px}
.kt-msg__body p{margin-top:10px; font-size:15px; line-height:1.95; color:#e3ded3}

/* entries */
.kt-entry{background:#fff; border:1px solid #cfe2f0; border-radius:12px; padding:24px 24px 26px; display:flex; flex-direction:column; color:inherit}
.kt-entry:hover{color:inherit; border-color:#9bc7e8}
.kt-entry__ico{width:46px; height:46px; border-radius:11px; background:var(--kt-blue); display:flex; align-items:center; justify-content:center; margin-bottom:14px}
.kt-entry__ico--green{background:#2f9e6f}
.kt-entry__ico--dark{background:var(--kt-ink)}
.kt-entry__no{font-size:11px; color:var(--kt-blue); font-weight:800; letter-spacing:.05em}
.kt-entry__no--green{color:#2f9e6f}
.kt-entry__no--gray{color:var(--kt-sub)}
.kt-entry__title{font-size:17px; font-weight:900; margin:3px 0 6px}
.kt-entry__desc{font-size:12.5px; color:var(--kt-muted); line-height:1.7}
.kt-entry__head{display:flex; align-items:center; gap:8px; margin-bottom:14px}
.kt-pill{font-size:9.5px; font-weight:800; color:#2f9e6f; background:#e9f5ef; border:1px solid #c7e6d6; padding:2px 8px; border-radius:20px}
.kt-tel{margin-top:22px; font-size:12.5px; color:var(--kt-sub)}

/* company */
.kt-cols{max-width:1180px; margin:0 auto; padding:52px 22px 74px; display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:24px; align-items:start}
.kt-map{height:240px; border-radius:12px; border:1px solid var(--kt-line); position:relative; overflow:hidden}
.kt-map img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.kt-map__cap{position:absolute; bottom:10px; left:10px; font-size:11px; color:#5e5647; font-family:'Yomogi',cursive; background:rgba(244,241,234,.85); padding:3px 9px; border-radius:20px}
.kt-box{background:#fff; border:1px solid var(--kt-line); border-radius:12px; padding:18px 22px; margin-top:16px}
.kt-box__t{font-size:14px; font-weight:900; margin-bottom:4px}
.kt-box__d{font-size:13px; color:var(--kt-muted); line-height:1.75}

/* contact */
.kt-contact{max-width:1180px; margin:0 auto; padding:52px 22px 74px; display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px}
.kt-ccard{background:#fff; border:1px solid var(--kt-line); border-radius:12px; padding:26px 26px 28px}
.kt-ccard__ico{width:46px; height:46px; border-radius:11px; background:var(--kt-blue); display:flex; align-items:center; justify-content:center; margin-bottom:14px}
.kt-ccard__ico--dark{background:var(--kt-ink)}
.kt-ccard__k{font-size:14px; font-weight:900}
.kt-ccard__tel{font-size:24px; font-weight:900; margin-top:4px; color:inherit}
.kt-ccard__v{font-size:15px; font-weight:800; margin-top:4px; word-break:break-all}
.kt-ccard__note{font-size:12px; color:var(--kt-sub); margin-top:4px}
.kt-ccard--cta{background:var(--kt-blue); color:#fff; border-color:var(--kt-blue); display:flex; flex-direction:column; justify-content:space-between}
.kt-ccard--cta:hover{color:#fff; background:#166ba8}
.kt-ccard--cta .kt-ccard__ico{background:rgba(255,255,255,.18)}
.kt-ccard--cta .kt-ccard__note{color:#e7f1f9; line-height:1.6; font-size:12.5px}

/* sns */
.kt-snshead{display:inline-flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--kt-line); border-radius:12px; padding:16px 22px; margin-bottom:26px; color:inherit}
.kt-snshead:hover{color:inherit}
.kt-snshead__mark{width:44px; height:44px; border-radius:11px; background:var(--kt-ink); display:flex; align-items:center; justify-content:center}
.kt-snshead__h{display:block; font-size:16px; font-weight:900}
.kt-snshead__s{display:block; font-size:12px; color:var(--kt-sub)}
.kt-posts{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px}
.kt-post{aspect-ratio:1; border-radius:8px; position:relative; overflow:hidden; display:flex; align-items:flex-end; padding:9px}
.kt-post img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.kt-post__play{position:absolute; top:9px; right:9px}
.kt-post__tag{position:absolute; top:9px; left:9px; font-size:8px; font-weight:800; color:#fff; background:rgba(28,26,23,.6); border-radius:3px; padding:1px 5px}
.kt-post__label{position:relative; font-size:11px; font-weight:800; line-height:1.3; color:var(--kt-bg); text-shadow:0 1px 4px rgba(0,0,0,.7)}

/* generic page content */
.kt-content{max-width:820px; margin:0 auto; padding:52px 22px 74px; font-size:15px; line-height:1.95}
.kt-content h1{font-size:30px; font-weight:900; margin-bottom:18px}
.kt-content p{margin:0 0 1em}

/* footer */
.kt-footer{background:var(--kt-ink); color:#cfc8ba}
.kt-footer__grid{max-width:1180px; margin:0 auto; padding:48px 22px 40px; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:28px}
.kt-footer__logo{display:flex; align-items:center; gap:10px; margin-bottom:12px}
.kt-footer__mark{width:34px; height:34px; border-radius:8px; background:var(--kt-blue); display:flex; align-items:center; justify-content:center}
.kt-footer__name{font-size:16px; font-weight:900; color:var(--kt-bg)}
.kt-footer p{font-size:12.5px; line-height:1.9}
.kt-footer__h{font-size:12px; font-weight:800; color:var(--kt-blue-l); letter-spacing:.08em; margin-bottom:12px}
.kt-footer__links{display:flex; flex-direction:column; gap:9px}
.kt-footer__links a{color:#cfc8ba; font-size:13px}
.kt-footer__links a:hover{color:#fff}
.kt-footer__info{font-size:13px; line-height:2}
.kt-footer__info a{color:#cfc8ba}
.kt-copy{border-top:1px solid rgba(255,255,255,.1); text-align:center; font-size:11px; color:var(--kt-sub); padding:16px}

@media (max-width:640px){
  .kt-hero__inner{padding:56px 22px 62px}
  .kt-panel,.kt-ig{padding:30px 24px}
  .kt-row__k{flex:0 0 100%; padding-bottom:6px}
  .kt-row__v{flex:0 0 100%; padding-top:6px}
  .kt-ig__thumbs{grid-template-columns:repeat(3,1fr); width:100%}
  .kt-fact{border-right:0; border-bottom:1px solid var(--kt-line2)}
}
