/*
Theme Name: Takenaka Print
Theme URI: https://takenaka-silk.com
Author: Takenaka Insatsu Kogei Co., Ltd.
Description: 株式会社竹中印刷工芸 コーポレートサイト用オリジナルテーマ（白＋ライトグリーン基調）。静的HTMLサイトからの変換版です。
Version: 1.1.0
Requires at least: 7.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: takenaka-print
*/

/* =========================================================
   TAKENAKA PRINT
   0. Design Tokens
   ========================================================= */
:root{
  --c-white:      #ffffff;
  --c-bg-soft:    #f3f9f4;   /* ごく淡いグリーン背景 */
  --c-green-pale: #e6f3e9;   /* 淡いグリーン背景（濃いめ） */
  --c-green:      #6fb383;   /* メインアクセントのライトグリーン */
  --c-green-deep: #4a8f5f;   /* 濃いグリーン（ホバー・強調） */
  --c-hero-green: #2f6b46;   /* ヒーロー左側の緑ベタ（白文字が読める濃さ） */
  --c-line:       #dde8e0;   /* 罫線 */
  --c-gray:       #7c8a80;   /* サブテキスト */
  --c-ink:        #2c352e;   /* 基調テキスト（グリーン寄りの濃色） */

  --font-en: "Poppins", "Helvetica Neue", Arial, sans-serif;
  --font-jp: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;

  --wrap: 1120px;
  --pad: 20px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

/* =========================================================
   1. Reset / Base
   ========================================================= */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:64px; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--font-jp);
  font-weight:400;
  font-size:15px;
  line-height:1.9;
  color:var(--c-ink);
  background:var(--c-white);
  letter-spacing:.02em;
  overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; transition:opacity .3s var(--ease), color .3s var(--ease); }
a:hover{ opacity:.7; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
h1,h2,h3,p{ margin:0; }

.container{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }
.sp-only{ display:inline; }

/* =========================================================
   2. Buttons
   ========================================================= */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:52px; padding:0 30px;
  font-size:14px; font-weight:500; letter-spacing:.06em;
  border:1px solid transparent; border-radius:999px;
  transition:background-color .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.btn:hover{ opacity:1; }
.btn--primary{ background:var(--c-green); color:var(--c-white); }
.btn--primary:hover{ background:var(--c-green-deep); }
.btn--ghost{ background:rgba(255,255,255,.12); color:var(--c-white); border-color:rgba(255,255,255,.6); }
.btn--ghost:hover{ background:var(--c-white); color:var(--c-ink); }
.btn--outline-green{ background:transparent; color:var(--c-green-deep); border-color:var(--c-green); }
.btn--outline-green:hover{ background:var(--c-green); color:var(--c-white); }
.btn--outline-white{ background:transparent; color:var(--c-ink); border-color:var(--c-ink); }
.btn--outline-white:hover{ background:var(--c-ink); color:var(--c-white); }
.btn--lg{ min-height:60px; padding:0 38px; }

/* =========================================================
   3. Header
   ========================================================= */
.header{
  position:fixed; inset:0 0 auto 0; z-index:100;
  border-bottom:1px solid var(--c-line);
}
.header::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:saturate(180%) blur(12px);
  backdrop-filter:saturate(180%) blur(12px);
}
.header__inner{
  position:relative;
  max-width:var(--wrap); margin-inline:auto;
  padding:0 var(--pad);
  height:64px;
  display:flex; align-items:center; justify-content:space-between;
}
.logo{ display:flex; align-items:center; flex:none; }
.logo__img{ height:24px; width:auto; display:block; }

/* --- SPナビ（オフキャンバス） --- */
.nav{
  position:fixed; inset:64px 0 0 0;
  background:var(--c-white);
  padding:40px var(--pad);
  transform:translateX(100%);
  transition:transform .45s var(--ease);
  visibility:hidden;
  overflow-y:auto;
  z-index:99;
}
.nav__list{ display:flex; flex-direction:column; gap:4px; }
.nav__list a{
  display:block; padding:18px 4px;
  font-size:17px; font-weight:500; letter-spacing:.04em;
  border-bottom:1px solid var(--c-line);
}
.nav__cta{ margin-top:20px; color:var(--c-green-deep) !important; }

.nav__icon-link{ display:flex !important; align-items:center; gap:8px; }
.nav__icon-link svg{ width:18px; height:18px; flex:none; }

.nav-toggle:checked ~ .nav{ transform:translateX(0); visibility:visible; }

.nav-btn{
  width:26px; height:18px; position:relative; cursor:pointer;
  display:block;
}
.nav-btn span{
  position:absolute; left:0; width:100%; height:1px; background:var(--c-ink);
  transition:transform .35s var(--ease), opacity .2s var(--ease);
}
.nav-btn span:nth-child(1){ top:0; }
.nav-btn span:nth-child(2){ top:50%; }
.nav-btn span:nth-child(3){ bottom:0; }
.nav-toggle:checked ~ .nav-btn span:nth-child(1){ top:50%; transform:rotate(45deg); }
.nav-toggle:checked ~ .nav-btn span:nth-child(2){ opacity:0; }
.nav-toggle:checked ~ .nav-btn span:nth-child(3){ bottom:auto; top:50%; transform:rotate(-45deg); }

/* =========================================================
   4. Hero
   ========================================================= */
.hero{
  display:flex; flex-direction:column;
  padding-top:64px;
}
.hero__content{
  background:var(--c-hero-green);
  color:var(--c-white);
  padding:56px var(--pad) 48px;
}
.hero__inner{ width:100%; max-width:var(--wrap); margin-inline:auto; }
.hero__sub{
  font-family:var(--font-en); font-size:12px; letter-spacing:.28em;
  color:rgba(255,255,255,.75); margin-bottom:22px;
}
.hero__title{
  font-size:min(45px, calc((100vw - 56px) / 10.4));
  font-weight:700; line-height:1.5; letter-spacing:.02em;
  white-space:nowrap;
}
.hero__lead{
  margin-top:22px; font-size:14px; font-weight:300; line-height:2;
  color:rgba(255,255,255,.85);
}
.hero__actions{ margin-top:36px; display:flex; flex-direction:column; gap:12px; }
.hero__actions .btn{ width:100%; }

.hero__visual{
  background:var(--c-bg-soft);
}
.hero__visual img{
  display:block; width:100%; height:auto;
}

.hero__scroll{
  display:none;
  margin-top:40px;
  font-family:var(--font-en); font-size:11px; letter-spacing:.24em;
  color:rgba(255,255,255,.7);
}
.hero__scroll::after{
  content:""; display:block; width:1px; height:36px; margin:10px 0 0;
  background:linear-gradient(180deg, rgba(255,255,255,.6), transparent);
}

/* =========================================================
   5. Section 共通
   ========================================================= */
.section{ padding:80px 0; }
.section__label{
  font-family:var(--font-en); font-size:11px; font-weight:500; letter-spacing:.26em;
  color:var(--c-green-deep); margin-bottom:16px;
}
.section__title{
  font-size:clamp(22px, 6vw, 32px);
  font-weight:700; line-height:1.5; letter-spacing:.02em;
  margin-bottom:24px;
}
.section__lead{ color:var(--c-gray); font-size:14px; margin-bottom:40px; }

/* =========================================================
   6. Concept
   ========================================================= */
.concept{ background:var(--c-bg-soft); }
.concept__grid{ display:grid; gap:48px; }
.concept__text p + p{ margin-top:20px; }
.concept__sign{
  margin-top:28px !important;
  font-family:var(--font-en); font-size:13px; letter-spacing:.1em; color:var(--c-gray);
}
.concept__points{ display:grid; gap:20px; }
.concept__points li{
  background:var(--c-white);
  padding:28px 24px;
  border:1px solid var(--c-line);
  border-radius:16px;
}
.concept__points .num{
  font-family:var(--font-en); font-size:12px; font-weight:500; letter-spacing:.16em; color:var(--c-green);
}
.concept__points h3{
  margin:8px 0 10px; font-size:17px; font-weight:700; letter-spacing:.02em;
}
.concept__points p{ font-size:14px; color:var(--c-gray); line-height:1.85; }

/* =========================================================
   7. Works（製作実績）
   ========================================================= */
.works__grid{ display:grid; gap:28px; }
.works__photo{
  position:relative;
  aspect-ratio:4/3;
  border-radius:14px;
  overflow:hidden;
  background:
    repeating-linear-gradient(45deg, var(--c-green-pale) 0 12px, #f7fbf8 12px 24px);
  border:1px solid var(--c-line);
  display:grid; place-items:center;
}
.works__photo span{
  font-family:var(--font-en); font-size:12px; letter-spacing:.28em; color:var(--c-gray);
}
.works__photo img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.works__cat{
  margin-top:14px; font-size:12px; font-weight:500; letter-spacing:.1em; color:var(--c-green-deep);
}
.works__name{ margin-top:4px; font-size:15px; font-weight:500; }
.works__more{ margin-top:44px; text-align:center; }

/* =========================================================
   7.5 News（お知らせ）
   ========================================================= */
.news__list{ display:flex; flex-direction:column; }
.news__item{
  display:flex; flex-direction:column; gap:8px;
  padding:24px 0;
  border-bottom:1px solid var(--c-line);
}
.news__item:first-child{ border-top:1px solid var(--c-line); }
.news__meta{ display:flex; align-items:center; gap:12px; }
.news__date{
  font-family:var(--font-en); font-size:13px; letter-spacing:.04em; color:var(--c-gray);
}
.news__tag{
  padding:3px 12px;
  font-size:11px; font-weight:500; letter-spacing:.06em;
  color:var(--c-green-deep);
  background:var(--c-green-pale);
  border-radius:999px;
}
.news__title{
  font-size:16px; font-weight:700; letter-spacing:.02em; color:var(--c-green-deep);
}
.news__text{ font-size:14.5px; line-height:1.85; color:var(--c-gray); }
.news__text p + p{ margin-top:.8em; }

/* =========================================================
   8. Company（会社情報）
   ========================================================= */
.company{ background:var(--c-bg-soft); }
.company__grid{ display:grid; gap:40px; }
.company__row{
  display:grid; gap:4px;
  padding:18px 0; border-bottom:1px solid var(--c-line);
}
.company__row:first-child{ border-top:1px solid var(--c-line); }
.company__row dt{
  font-size:12px; font-weight:500; letter-spacing:.14em; color:var(--c-gray);
}
.company__row dd{ font-size:14.5px; line-height:1.9; }
.company__row a{ border-bottom:1px solid var(--c-line); }

.company__map{
  position:relative;
  aspect-ratio:4/3;
  border-radius:14px;
  overflow:hidden;
  border:1px solid var(--c-line);
}
.company__map iframe{
  width:100%; height:100%; border:0; display:block;
}

/* =========================================================
   8.5 Calendar Page（営業日カレンダー）
   ========================================================= */
.calendar-image{
  border:1px solid var(--c-line);
  border-radius:16px;
  overflow:hidden;
  background:var(--c-bg-soft);
}
.calendar-image img{ width:100%; height:auto; display:block; }
.calendar-actions{ margin-top:24px; text-align:center; }
.calendar-note{
  margin-top:24px; font-size:13px; line-height:1.9; color:var(--c-gray);
}

/* =========================================================
   9. Contact（お問い合わせ）
   ========================================================= */
.contact{
  background: linear-gradient(160deg, #3f5c48 0%, #2c4433 55%, #1d2f22 100%);
  color:var(--c-white);
  padding:88px 0 100px;
}
.contact .section__label{ color:rgba(255,255,255,.65); }
.contact__inner{ text-align:center; }
.contact__title{
  font-size:clamp(22px, 6.2vw, 34px);
  font-weight:700; line-height:1.6; letter-spacing:.02em;
  margin-bottom:22px;
}
.contact__lead{
  font-size:14px; font-weight:300; line-height:2;
  color:rgba(255,255,255,.8);
}
.contact__actions{
  margin-top:38px; display:flex; flex-direction:column; gap:12px;
}
.contact__actions .btn{ width:100%; }

/* 電話番号：モバイルはタップ可能なリンク、タブレット以上は番号表示のみ（グリーン文字・白枠） */
.contact__tel--text{
  display:none;
  cursor:default;
  background:transparent;
  color:var(--c-green);
  border-color:rgba(255,255,255,.7);
}
.contact__note{
  margin-top:22px; font-size:12px; letter-spacing:.06em; color:rgba(255,255,255,.55);
}

/* =========================================================
   9.5 Contact Form Page（お問い合わせフォーム）
   ========================================================= */
.contact-page .section__lead a{ color:var(--c-green-deep); border-bottom:1px solid var(--c-line); }
.contact-page__notice{
  max-width:720px;
  margin-top:28px;
  padding:20px 22px;
  background:var(--c-bg-soft);
  border:1px solid var(--c-line);
  border-radius:12px;
  font-size:14px; line-height:1.9; color:var(--c-gray);
}
.contact-page__notice p + p{ margin-top:8px; }
.contact-page__notice-strong{ color:var(--c-ink); font-weight:500; }
.form{
  max-width:720px;
  margin-top:48px;
  display:flex; flex-direction:column; gap:26px;
}
.form__row{ display:flex; flex-direction:column; gap:8px; }
.form__row label{
  font-size:13.5px; font-weight:500; letter-spacing:.04em; color:var(--c-ink);
}
.form__required{
  margin-left:8px;
  padding:2px 8px;
  font-size:11px; font-weight:500; letter-spacing:.04em;
  color:var(--c-white); background:var(--c-green);
  border-radius:999px;
  vertical-align:middle;
}
.form__grid2{ display:grid; gap:26px; }
.form input[type="text"],
.form input[type="email"],
.form input[type="tel"],
.form select,
.form textarea{
  width:100%;
  padding:14px 16px;
  font-family:var(--font-jp); font-size:15px; color:var(--c-ink);
  background:var(--c-white);
  border:1px solid var(--c-line);
  border-radius:10px;
  transition:border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.form textarea{ resize:vertical; line-height:1.8; }
.form input:focus,
.form select:focus,
.form textarea:focus{
  outline:none;
  border-color:var(--c-green);
  box-shadow:0 0 0 3px var(--c-green-pale);
}
.form select{
  appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%237c8a80' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M5 7.5l5 5 5-5'/></svg>");
  background-repeat:no-repeat;
  background-position:right 14px center;
  padding-right:40px;
}
.form__check{
  display:flex; align-items:flex-start; gap:10px;
  font-size:13.5px; line-height:1.7; color:var(--c-gray);
  cursor:pointer;
}
.form__check input{ margin-top:3px; flex:none; width:16px; height:16px; accent-color:var(--c-green); }
.form__check a{ color:var(--c-green-deep); border-bottom:1px solid var(--c-line); }
.form__actions{ margin-top:8px; }
.form__actions .btn{ width:100%; }

/* =========================================================
   9.8 Form Submit Notice（送信結果メッセージ）
   ========================================================= */
.form-notice{
  max-width:720px;
  margin-top:48px;
  padding:22px 24px;
  border-radius:14px;
  font-size:14.5px; line-height:1.9;
}
.form-notice--success{
  background:var(--c-green-pale);
  border:1px solid var(--c-green);
  color:var(--c-ink);
}
.form-notice--error{
  background:#fdeceb;
  border:1px solid #e2a39c;
  color:var(--c-ink);
}

/* =========================================================
   10. Footer / 固定CTA
   ========================================================= */
.footer{ background:var(--c-white); color:var(--c-ink); padding:52px 0 88px; border-top:1px solid var(--c-line); }
.footer__inner{ display:grid; gap:26px; text-align:center; justify-items:center; }
.footer__nav{ display:flex; flex-wrap:wrap; justify-content:center; gap:20px; }
.footer__nav a{ font-size:13px; letter-spacing:.04em; }
.footer__icon-link{ display:flex; align-items:center; gap:6px; }
.footer__icon-link svg{ width:16px; height:16px; flex:none; }
.footer__copy{ font-size:11px; letter-spacing:.04em; color:var(--c-gray); }

.fixed-cta{
  position:fixed; inset:auto 0 0 0; z-index:90;
  display:grid; grid-template-columns:1fr 1.4fr;
  border-top:1px solid var(--c-line);
}
.fixed-cta a{
  min-height:56px; display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:500; letter-spacing:.06em;
}
.fixed-cta__tel{ background:var(--c-ink); color:var(--c-white); }
.fixed-cta__contact{ background:var(--c-green); color:var(--c-white); }

/* =========================================================
   11. Responsive
   ========================================================= */

/* ---- Tablet 768px〜 ---- */
@media (min-width:768px){
  body{ font-size:16px; }
  .section{ padding:110px 0; }
  .sp-only{ display:none; }

  .hero__content{ padding:72px 40px 64px; }
  .hero__actions{ flex-direction:row; gap:16px; }
  .hero__actions .btn{ width:auto; min-width:200px; }
  .hero__lead{ font-size:15px; }

  .concept__points{ grid-template-columns:repeat(3,1fr); gap:20px; }
  .works__grid{ grid-template-columns:repeat(3,1fr); gap:32px; }
  .company__grid{ grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
  .company__row{ grid-template-columns:120px 1fr; gap:16px; align-items:baseline; }
  .company__map{ aspect-ratio:1/1; position:sticky; top:96px; }

  .contact__actions{ flex-direction:row; justify-content:center; gap:16px; }
  .contact__actions .btn{ width:auto; min-width:260px; }

  .contact__tel--link{ display:none; }
  .contact__tel--text{ display:inline-flex; }
  .contact__tel--text:hover{ opacity:1; }

  .form__grid2{ grid-template-columns:1fr 1fr; }
  .form__actions .btn{ width:auto; min-width:220px; }

  .footer{ padding:60px 0; }
  .footer__inner{ grid-template-columns:auto 1fr; align-items:center; text-align:left; justify-items:start; }
  .footer__nav{ justify-content:flex-end; justify-self:end; }
  .footer__copy{ grid-column:1 / -1; }

  .fixed-cta{ display:none; }
}

/* ---- Desktop 1024px〜 ---- */
@media (min-width:1024px){
  html{ scroll-padding-top:80px; }
  .header__inner{ height:80px; max-width:1360px; }
  .logo{ margin-right:40px; }
  .logo__img{ height:22px; }
  .nav-btn{ display:none; }

  .nav{
    position:static; inset:auto; padding:0;
    background:transparent; transform:none; visibility:visible;
  }
  .nav__list{ flex-direction:row; align-items:center; gap:14px; }
  .nav__list a{
    padding:0; border:0; white-space:nowrap;
    font-size:14px; letter-spacing:.02em;
  }
  .nav__cta{
    margin:0; padding:12px 26px !important;
    background:var(--c-green); color:var(--c-white) !important;
    border-radius:999px;
  }
  .nav__cta:hover{ background:var(--c-green-deep); opacity:1; }

  .hero{
    flex-direction:row;
    min-height:calc(100svh - 80px);
    padding-top:80px;
  }
  .hero__content{
    flex:1 1 50%;
    display:flex; flex-direction:column; justify-content:center;
    padding:64px 60px;
  }
  .hero__visual{
    flex:1 1 50%;
    display:flex; align-items:center; justify-content:center;
    padding:48px;
  }
  .hero__visual img{
    width:auto; height:auto; max-width:100%; max-height:100%;
  }
  .hero__title{ font-size:min(45px, calc((50vw - 104px) / 10.2)); }
  .hero__inner{ max-width:none; }
  .hero__lead{ max-width:28em; }
  .hero__scroll{ display:block; }

  .section{ padding:140px 0; }
  .concept__grid{ grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:start; }
  .concept__points{ grid-template-columns:1fr; }
  .concept__points li{ display:grid; grid-template-columns:56px 1fr; gap:0 16px; padding:26px 28px; }
  .concept__points .num{ grid-row:span 2; padding-top:4px; }
  .concept__points h3{ margin-top:0; }

  .works__grid{ gap:36px; }
  .section__lead{ max-width:40em; }

  .news__text{ max-width:48em; }
}

@media (min-width:1150px){
  .nav__list{ gap:20px; }
}

/* ---- Wide 1280px〜 ---- */
@media (min-width:1280px){
  :root{ --pad:40px; }
  .logo__img{ height:26px; }
  .nav__list{ gap:24px; }
}

/* ---- モーション配慮 ---- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
}