/* ==========================================================================
   funemedia.jp — shared design tokens & components
   Derived from "Funemedia A - Standalone.html" (top page design)
   ========================================================================== */

:root{
  --bg:      #FBF8F1;
  --ink:     #15140F;
  --teal:    #28F0C0;
  --orange:  #FF8A33;
  --pink:    #FF63A0;
  --lime:    #C6FF1A;
  --green:   #00B894;
  --white:   #FFFFFF;
  --ink-60:  rgba(21,20,15,0.6);
  --ink-40:  rgba(21,20,15,0.4);
  --ink-15:  rgba(21,20,15,0.15);
  --border:  2.5px solid var(--ink);
  --border-thin: 1.5px solid var(--ink);
  --maxw: 1160px;
}

*{ margin:0; padding:0; box-sizing:border-box; }

html{ scroll-behavior:smooth; }

/* !important here because Kadence's own Customizer background output
   (site background / homepage background) is added inline in wp_head and
   can otherwise win the cascade over this external stylesheet, even
   though this rule loads later in source order. */
body{
  background-color:var(--bg) !important;
  color:var(--ink);
  font-family:'Outfit','Noto Sans JP',sans-serif;
  line-height:1.7;
  background-image:
    linear-gradient(rgba(0,184,148,0.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,184,148,0.16) 1px, transparent 1px) !important;
  background-size: 24px 24px !important;
  background-position: -1px -1px !important;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 40px; }

/* ---------- highlighter marker text ---------- */
.mark{
  background-image: linear-gradient(transparent 56%, var(--lime) 56%, var(--lime) 94%, transparent 94%);
  padding:0 2px;
}

/* ---------- pill / badge ---------- */
.pill{
  display:inline-flex; align-items:center; gap:6px;
  font-family:'Archivo',sans-serif; font-weight:800; font-size:12px;
  letter-spacing:0.06em; text-transform:uppercase;
  padding:7px 14px; border:2px solid var(--ink); color:var(--ink);
}
.pill.teal{ background:var(--teal); }
.pill.orange{ background:var(--orange); }
.pill.pink{ background:var(--pink); }
.pill.lime{ background:var(--lime); font-family:'Spline Sans Mono',monospace; text-transform:none; }
.pill.white{ background:var(--white); }

/* ---------- header ---------- */
.site-header{
  background:var(--bg);
  border-bottom:var(--border);
  position:sticky; top:0; z-index:100;
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:18px; padding-bottom:18px;
}
.logo{ display:flex; align-items:center; gap:14px; }
.logo svg{ display:block; flex-shrink:0; }
.logo-text{ display:flex; flex-direction:column; line-height:1.2; }
.logo-title{ font-family:'Outfit',sans-serif; font-weight:600; font-size:20px; letter-spacing:0.02em; color:#2B2A28; }
.logo-tag{ font-family:'Outfit','Noto Sans JP',sans-serif; font-size:11px; letter-spacing:0.03em; color:#5A5750; margin-top:2px; }

.site-nav{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.site-nav .tab-pill{
  font-family:'Archivo',sans-serif; font-weight:800; font-size:11px;
  letter-spacing:0.06em; padding:8px 12px; border:2px solid var(--ink);
}
.site-nav .tab-pill.teal{ background:var(--teal); }
.site-nav .tab-pill.orange{ background:var(--orange); }
.site-nav .tab-pill.pink{ background:var(--pink); }
.site-nav .nav-link{
  font-family:'Outfit',sans-serif; font-weight:600; font-size:14px;
  padding:8px 4px; border-bottom:2px solid transparent;
}
.site-nav .nav-link:hover{ border-bottom:2px solid var(--ink); }

/* ---------- page title banner ---------- */
.page-title{
  padding:64px 0 40px;
  border-bottom:var(--border);
}
.page-title .kicker{
  font-family:'Caveat',cursive; font-weight:700; font-size:22px; color:var(--green);
  display:block; margin-bottom:4px;
}
.page-title h1{
  font-family:'Archivo',sans-serif; font-weight:900; font-size:48px; letter-spacing:-0.01em;
}
.page-title p{
  margin-top:12px; font-size:15px; color:var(--ink-60); max-width:560px;
}

/* ---------- card ---------- */
.card{
  background:var(--white); border:var(--border);
}

/* ---------- generic content section (01/02/03 on the front page, the
   SCHEDULE widget, etc.) — this was missing from the port, which is why
   those blocks had no left/right margin. ---------- */
.section{ max-width:var(--maxw); margin:72px auto 0; padding:0 40px; }

/* ---------- section heading (numbered, like top page) ---------- */
.section-head{ display:flex; align-items:baseline; gap:16px; margin-bottom:24px; }
.section-head .num{
  background:var(--ink); color:var(--bg); font-family:'Archivo',sans-serif;
  font-weight:800; font-size:14px; padding:6px 10px;
}
.section-head h2{
  font-family:'Archivo',sans-serif; font-weight:900; font-size:28px;
}
.section-head h2 .hl{
  background-image: linear-gradient(transparent 60%, var(--teal) 60%, var(--teal) 92%, transparent 92%);
}
.section-head h2 .hl.orange{
  background-image: linear-gradient(transparent 60%, var(--orange) 60%, var(--orange) 92%, transparent 92%);
}
.section-head h2 .hl.pink{
  background-image: linear-gradient(transparent 60%, var(--pink) 60%, var(--pink) 92%, transparent 92%);
}
.section-head .desc{ font-size:13px; color:var(--ink-60); margin-left:auto; }

/* ---------- footer ---------- */
.site-footer{ border-top:var(--border); margin-top:80px; background:var(--white); }
.footer-top{
  display:flex; justify-content:space-between; align-items:flex-start;
  padding:48px 0 32px; gap:24px; flex-wrap:wrap;
}
.footer-nav-row{ display:flex; align-items:center; gap:28px; flex-wrap:wrap; }
.footer-nav{ display:flex; gap:28px; flex-wrap:wrap; }
.footer-nav a{ font-size:14px; font-weight:600; }
.footer-nav a:hover{ text-decoration:underline; }
.footer-nav-row .btn{ padding:10px 20px; font-size:13px; flex-shrink:0; }
.footer-bottom{
  border-top:var(--border-thin); padding:18px 0; font-size:12px; color:var(--ink-60);
  font-family:'Spline Sans Mono',monospace;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;
}

/* ---------- misc utility ---------- */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Outfit',sans-serif; font-weight:600; font-size:14px;
  padding:12px 22px; border:2.5px solid var(--ink); background:var(--ink); color:var(--bg);
}
.btn.outline{ background:transparent; color:var(--ink); }

.breadcrumb{ font-size:12px; color:var(--ink-60); margin-bottom:18px; font-family:'Outfit',sans-serif; }
.breadcrumb a:hover{ text-decoration:underline; }

@media (max-width: 860px){
  .wrap{ padding:0 20px; }
  .page-title h1{ font-size:34px; }
  .site-nav{ display:none; }
}

/* ==========================================================================
   Scrapbook components — derived from "Funemedia Article v2 - Standalone.html"
   ========================================================================== */

/* small gray meta-label used above decorative elements (design-annotation tag) */
.meta-label{
  font-family:'Spline Sans Mono',monospace; font-size:10px; letter-spacing:0.03em;
  color:#B09A2A; display:block; margin-bottom:6px;
}

/* full-bleed category band at top of article */
.category-band{
  background:var(--teal); padding:14px 0;
}
.category-band .wrap{ display:flex; align-items:center; justify-content:space-between; }
.category-band .cat{ font-family:'Archivo','Zen Kaku Gothic New',sans-serif; font-weight:800; font-size:13px; }
.category-band .date{ font-family:'Spline Sans Mono',monospace; font-size:12px; }
.category-band.orange{ background:var(--orange); }
.category-band.pink{ background:var(--pink); }

/* "scrapbook" card used for body paragraphs, quotes, headings */
.scrap-card{
  background:var(--white); box-shadow:4px 5px 14px rgba(0,0,0,0.12);
  padding:32px 36px; position:relative;
}
.scrap-card + .scrap-card{ margin-top:28px; }

/* drop cap (teal) inside scrap-card */
.drop-teal{
  font-family:'Archivo',sans-serif; font-weight:900; font-size:44px; color:var(--teal);
  float:left; line-height:1; margin:2px 10px 0 0;
  -webkit-text-stroke:1.5px var(--ink);
}

/* sticky note (yellow, slight rotation, folded corner) */
.sticky-note{
  background:#FFF1A8; box-shadow:3px 4px 9px rgba(0,0,0,0.13);
  padding:16px 20px 20px; max-width:280px; transform:rotate(2.4deg);
  position:relative;
}
.sticky-note::after{
  content:''; position:absolute; right:0; bottom:0; width:0; height:0;
  border-style:solid; border-width:0 0 16px 16px; border-color:transparent transparent rgba(21,20,15,0.25) transparent;
}
.sticky-note .body{ font-family:'Yomogi',cursive; font-size:15px; line-height:1.5; }
.sticky-note.tilt-l{ transform:rotate(-2deg); }

/* speech-bubble sticky note (mint) */
.speech-note{
  background:#E3F7F0; padding:14px 18px; max-width:260px; position:relative;
  box-shadow:2px 3px 8px rgba(0,0,0,0.10);
}
.speech-note::after{
  content:''; position:absolute; left:24px; bottom:-12px; width:0; height:0;
  border-style:solid; border-width:14px 10px 0 0; border-color:#E3F7F0 transparent transparent transparent;
}
.speech-note .body{ font-family:'Yomogi',cursive; font-size:15px; line-height:1.4; }

/* round sticker */
.round-sticker{
  width:130px; height:130px; border-radius:50%; background:var(--pink);
  box-shadow:3px 4px 10px rgba(0,0,0,0.18); color:#fff;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
}
.round-sticker .num{ font-family:'Archivo',sans-serif; font-weight:900; font-size:30px; line-height:1; }
.round-sticker .sub{ font-family:'Yomogi',cursive; font-size:12px; margin-top:4px; }

/* handwritten annotation (pink, rotated) */
.handwritten{
  font-family:'Yomogi',cursive; font-size:16px; color:var(--pink);
  display:inline-block; transform:rotate(-3deg);
}

/* photo frame variants */
.photo-frame{ position:relative; }
.photo-frame img, .photo-frame .ph{ display:block; width:100%; }
.photo-frame figcaption{ font-size:13px; color:var(--ink-60); margin-top:8px; }

.frame-hard{ }
.frame-hard .ph{
  border:2.5px solid var(--ink); box-shadow:6px 6px 0 var(--ink);
  aspect-ratio:16/10; background:linear-gradient(135deg,#dfe7ea,#c9d3d6);
  display:flex; align-items:center; justify-content:center; color:var(--ink-40);
  font-family:'Spline Sans Mono',monospace; font-size:13px;
}

.frame-tape{ padding:14px; background:var(--white); box-shadow:2px 3px 10px rgba(0,0,0,0.14); position:relative; display:inline-block; }
.frame-tape .ph{ aspect-ratio:4/3; background:#c7d0d3; display:flex; align-items:center; justify-content:center; color:var(--ink-40); font-family:'Spline Sans Mono',monospace; font-size:13px; }
.frame-tape::before, .frame-tape::after{
  content:''; position:absolute; top:-10px; width:56px; height:22px;
  background:rgba(198,255,26,0.55); transform:rotate(-8deg);
}
.frame-tape::before{ left:18px; }
.frame-tape::after{ right:18px; transform:rotate(8deg); }

.frame-torn{ }
.frame-torn .ph{
  aspect-ratio:4/3; background:#e9e4d7; display:flex; align-items:center; justify-content:center;
  color:var(--ink-40); font-family:'Spline Sans Mono',monospace; font-size:13px;
  clip-path: polygon(0 2%, 3% 0, 97% 1%, 100% 3%, 99% 97%, 96% 100%, 2% 99%, 0 96%);
  box-shadow:3px 4px 10px rgba(0,0,0,0.12);
}

/* summary box */
.summary-box{
  background:var(--white); box-shadow:5px 6px 0 var(--ink); border:2px solid var(--ink);
  padding:32px 36px;
}
.summary-box .label{
  display:inline-block; font-family:'Archivo',sans-serif; font-weight:900; font-size:15px;
  background-image: linear-gradient(transparent 55%, var(--teal) 55%, var(--teal) 92%, transparent 92%);
  margin-bottom:16px;
}

/* share row */
.share-row2{ display:flex; align-items:center; gap:14px; margin:40px 0; flex-wrap:wrap; }
.share-row2 .lbl{ font-family:'Archivo',sans-serif; font-weight:800; font-size:13px; margin-right:6px; }
.share-row2 a{
  border:2px solid var(--ink); padding:10px 20px; font-family:'Outfit',sans-serif; font-weight:600; font-size:14px;
}

/* next bar */
.next-bar{
  background:var(--ink); color:var(--bg); padding:26px 32px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.next-bar .tag{ font-family:'Spline Sans Mono',monospace; font-size:12px; color:var(--teal); }
.next-bar .t{ font-family:'Archivo','Zen Kaku Gothic New',sans-serif; font-weight:800; font-size:20px; }

/* ==========================================================================
   Single article (single.php)
   ========================================================================== */
.article-head{ max-width:760px; margin:40px auto 32px; }
.article-head .title{
  font-family:'Archivo','Zen Kaku Gothic New',sans-serif; font-weight:900; font-size:44px;
  line-height:1.25; margin:18px 0 16px;
}
.byline-row{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; font-size:13px; }
.byline-row .tags{ display:flex; gap:12px; flex-wrap:wrap; }
.byline-row .tags a{ font-family:'Spline Sans Mono',monospace; font-size:12px; color:var(--green); }

.hero-wrap{ max-width:820px; margin:0 auto 48px; }

/* the_content()'s top-level blocks get the scrapbook paper-card look
   automatically, so any future post written in the block editor keeps
   the same feel without needing bespoke markup per article. */
.article-body{ max-width:720px; margin:0 auto; display:flex; flex-direction:column; gap:28px; }
.article-body > p,
.article-body > ul,
.article-body > ol,
.article-body > blockquote,
.article-body > table{
  background:var(--white); box-shadow:4px 5px 14px rgba(0,0,0,0.12);
  padding:32px 36px; font-size:16px; margin:0;
}
.article-body > h2{
  font-family:'Archivo','Zen Kaku Gothic New',sans-serif; font-weight:900; font-size:23px;
  display:inline-block; margin:0;
  background-image: linear-gradient(transparent 60%, var(--lime) 60%, var(--lime) 92%, transparent 92%);
}
.article-body > figure,
.article-body > img{
  border:2.5px solid var(--ink); box-shadow:6px 6px 0 var(--ink); margin:0;
}
.article-body > figure img{ display:block; width:100%; }
.article-body > figure figcaption{ font-size:13px; color:var(--ink-60); margin-top:8px; }

.tag-row{ display:flex; gap:8px; flex-wrap:wrap; margin:8px auto 0; max-width:720px; }
.tag-row a{ font-family:'Spline Sans Mono',monospace; font-size:12px; border:1.5px solid var(--ink); padding:5px 10px; }

.related{ max-width:var(--maxw); margin:56px auto 0; padding:0 40px; }
.related-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.rcard{ padding:0; overflow:hidden; }
.rcard .thumb{ aspect-ratio:4/3; background:#dfe4e0; display:flex; align-items:center; justify-content:center; color:var(--ink-40); font-size:12px; font-family:'Spline Sans Mono',monospace; border-bottom:var(--border); }
.rcard .thumb img{ width:100%; height:100%; object-fit:cover; }
.rcard .body{ padding:16px; }
.rcard .date{ font-family:'Spline Sans Mono',monospace; font-size:11px; color:var(--green); }
.rcard .t{ font-family:'Zen Kaku Gothic New',sans-serif; font-weight:700; font-size:16px; margin-top:6px; }

.next-wrap{ max-width:var(--maxw); margin:20px auto 0; padding:0 40px; }

@media (max-width:760px){
  .article-head .title{ font-size:30px; }
  .related-grid{ grid-template-columns:1fr; }
}

/* ==========================================================================
   Category archive (category.php)
   ========================================================================== */
.list-head{ max-width:720px; margin:0 auto; padding:40px 0 8px; }
.list-head h1{ font-family:'Archivo',sans-serif; font-weight:900; font-size:38px; }
.list-head p{ margin-top:12px; font-size:15px; color:var(--ink-60); }

.article-list{ max-width:720px; margin:32px auto 0; }
.a-item{
  display:grid; grid-template-columns:160px 1fr; gap:24px; padding:24px 0; border-bottom:var(--border-thin);
  align-items:start;
}
.a-item .thumb{
  aspect-ratio:4/3; background:#dfe4e0; border:1.5px solid var(--ink); overflow:hidden;
  display:flex; align-items:center; justify-content:center; color:var(--ink-40);
  font-size:11px; font-family:'Spline Sans Mono',monospace;
}
.a-item .thumb img{ width:100%; height:100%; object-fit:cover; }
.a-item .date{ font-family:'Spline Sans Mono',monospace; font-size:12px; color:var(--green); }
.a-item .t{ font-family:'Archivo','Zen Kaku Gothic New',sans-serif; font-weight:800; font-size:19px; margin-top:6px; }
.a-item .d{ font-size:13px; color:var(--ink-60); margin-top:8px; }

@media (max-width:600px){
  .a-item{ grid-template-columns:96px 1fr; gap:14px; }
  .a-item .t{ font-size:16px; }
}

/* ==========================================================================
   About page (page-templates/template-about.php) — quiet, single text block
   ========================================================================== */
.page-template-page-templates-template-about-php{ background-image:none; }
.page-template-page-templates-template-about-php .page-title .kicker{
  font-family:'Outfit','Noto Sans JP',sans-serif; font-style:normal; font-weight:500; font-size:15px; letter-spacing:0.02em;
}
.kicker-brand{ font-weight:600; color:#2B2A28; }
.page-template-page-templates-template-about-php .page-title{ padding-bottom:56px; }

.letter{ max-width:640px; margin:0 auto; padding:56px 24px 8px; }
.letter p{ font-size:16px; line-height:2.05; margin-bottom:32px; }

.signature{ max-width:640px; margin:64px auto 0; padding:32px 24px 0; border-top:1.5px solid var(--ink); }
.signature .role{ font-size:12px; color:var(--ink-60); font-family:'Spline Sans Mono',monospace; }
.signature .name{ font-family:'Outfit',sans-serif; font-weight:600; font-size:22px; margin-top:8px; color:#2B2A28; }

.cta-row{ max-width:640px; margin:40px auto 0; padding:0 24px; display:flex; gap:16px; flex-wrap:wrap; }

.values{ max-width:900px; margin:72px auto 0; padding:0 40px; }
.values-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:24px; }
.vcard{ padding:26px; }
.vcard .icon{
  width:44px; height:44px; border-radius:50%; background:var(--teal); border:2px solid var(--ink);
  display:flex; align-items:center; justify-content:center; margin-bottom:16px; font-size:19px;
}
.vcard h3{ font-family:'Archivo',sans-serif; font-weight:800; font-size:17px; margin-bottom:8px; }
.vcard p{ font-size:13px; color:var(--ink-60); }

@media (max-width:760px){
  .letter{ padding:40px 12px 8px; }
  .signature{ padding:28px 12px 0; }
  .cta-row{ padding:0 12px; }
  .values-grid{ grid-template-columns:1fr; }
}

/* ==========================================================================
   Schedule (template-parts/schedule-widget.php + template-schedule.php)
   ========================================================================== */
.schedule-widget .kicker{
  font-family:'Caveat',cursive; font-weight:700; font-size:22px; color:var(--green); display:block; margin-bottom:12px;
}
.cal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; flex-wrap:wrap; gap:16px; }
.cal-nav{ display:flex; align-items:center; gap:16px; }
.cal-head .month{ font-family:'Archivo',sans-serif; font-weight:800; font-size:24px; }
.cal-nav-buttons{ display:flex; align-items:center; gap:10px; }
.cal-prev,
.cal-next{
  width:36px; height:36px; border:2px solid var(--ink); background:var(--white);
  font-size:16px; cursor:pointer; flex-shrink:0;
}
.cal-prev:hover:not(:disabled),
.cal-next:hover:not(:disabled){ background:var(--teal); }
.cal-prev:disabled,
.cal-next:disabled{ opacity:0.3; cursor:not-allowed; }
.calendar{ border:var(--border); background:var(--white); }
.cal-dow{ display:grid; grid-template-columns:repeat(7,1fr); border-bottom:var(--border); }
.cal-dow div{ text-align:center; padding:10px 4px; font-family:'Archivo',sans-serif; font-weight:800; font-size:12px; color:var(--ink-60); }
.cal-dow div:first-child{ color:#E0526B; }
.cal-dow div:last-child{ color:#3E7CB1; }
.cal-month-panel{ display:none; }
.cal-month-panel.is-active{ display:block; }
.cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); grid-auto-rows:96px; }
.cal-cell{ border-right:1.5px solid var(--ink-15); border-bottom:1.5px solid var(--ink-15); padding:6px; position:relative; font-family:'Spline Sans Mono',monospace; font-size:11px; overflow:hidden; }
.cal-cell.empty{ background:repeating-linear-gradient(135deg, transparent, transparent 8px, var(--ink-15) 8px, var(--ink-15) 9px); }
.cal-cell.today .d{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; background:var(--ink); color:var(--bg); border-radius:50%; }
.evt{ margin-top:4px; font-family:'Outfit','Noto Sans JP',sans-serif; font-size:10px; font-weight:600; padding:2px 4px; border:1.5px solid var(--ink); line-height:1.2; }
.evt.teal{ background:var(--teal); }
.evt.orange{ background:var(--orange); }
.evt.pink{ background:var(--pink); }
.evt.lime{ background:var(--lime); }
.holiday{ font-family:'Spline Sans Mono',monospace; font-size:9px; color:#E0526B; margin-top:3px; }
.schedule-widget .see-all{ margin-top:16px; }

.legend{ display:flex; gap:20px; margin-top:20px; flex-wrap:wrap; font-size:12px; }
.legend span{ display:inline-flex; align-items:center; gap:6px; }
.legend i{ width:14px; height:14px; border:1.5px solid var(--ink); display:inline-block; }

.upcoming{ max-width:var(--maxw); margin:64px auto 0; padding:0 40px; }
.u-list{ border-top:var(--border-thin); }
.u-item{ display:flex; align-items:center; gap:20px; padding:18px 0; border-bottom:var(--border-thin); }
.u-item .date{ font-family:'Spline Sans Mono',monospace; font-size:13px; width:110px; flex-shrink:0; color:var(--ink-60); }
.u-item .tag{ width:90px; flex-shrink:0; }
.u-item .t{ font-weight:600; font-size:15px; }

@media (max-width:760px){
  .cal-grid{ grid-auto-rows:72px; }
  .evt{ font-size:7px; padding:1px 3px; }
  .holiday{ font-size:7px; }
  .u-item{ flex-wrap:wrap; gap:8px; }
}

/* ==========================================================================
   Legal pages (template-copyright.php / template-privacy.php)
   ========================================================================== */
.legal{ max-width:720px; margin:0 auto; padding:8px 0 60px; }
.legal h2{
  font-family:'Archivo',sans-serif; font-weight:900; font-size:20px; margin:44px 0 14px;
  padding-bottom:8px; border-bottom:var(--border-thin);
}
.legal h2:first-child{ margin-top:0; }
.legal p{ font-size:15px; margin-bottom:14px; color:var(--ink); }
.legal ul{ margin:0 0 14px 20px; font-size:15px; }
.legal li{ margin-bottom:6px; }
.updated{ font-family:'Spline Sans Mono',monospace; font-size:12px; color:var(--ink-60); margin-top:8px; }
.contact-box{ border:var(--border); background:var(--white); padding:24px; margin-top:16px; }
.contact-box .t{ font-family:'Archivo',sans-serif; font-weight:800; font-size:14px; margin-bottom:8px; }
table.tbl{ width:100%; border-collapse:collapse; margin-bottom:14px; font-size:14px; }
table.tbl th, table.tbl td{ border:1.5px solid var(--ink); padding:10px 12px; text-align:left; vertical-align:top; }
table.tbl th{ background:var(--white); font-family:'Archivo',sans-serif; font-weight:800; font-size:12px; width:32%; }

/* ==========================================================================
   Front page sections (01 FOLLOWING cards / 02 ON DECK / 03 TALKING)
   ========================================================================== */
.cards-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.fcard{ padding:0; overflow:hidden; }
.fcard .thumb{ aspect-ratio:4/3; background:#dfe4e0; display:flex; align-items:center; justify-content:center; color:var(--ink-40); font-size:12px; font-family:'Spline Sans Mono',monospace; border-bottom:var(--border); position:relative; }
.fcard .thumb img{ width:100%; height:100%; object-fit:cover; }
.fcard .thumb.pending{ background:repeating-linear-gradient(135deg, #efe9db, #efe9db 8px, #e3ddcf 8px, #e3ddcf 16px); }
.fcard .body{ padding:16px; }
.fcard .date{ font-family:'Spline Sans Mono',monospace; font-size:11px; color:var(--green); }
.fcard .t{ font-family:'Zen Kaku Gothic New',sans-serif; font-weight:700; font-size:16px; margin-top:6px; }
.see-all{ margin-top:20px; text-align:right; }
.see-all a{ font-family:'Outfit',sans-serif; font-weight:600; font-size:13px; }

.stub-box{
  border:var(--border); background:var(--white); padding:32px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.stub-box p{ font-size:14px; color:var(--ink-60); }

@media (max-width:760px){
  .cards-grid{ grid-template-columns:1fr; }
}

/* ==========================================================================
   Contact (page-templates/template-contact.php) — CSS-only 個人/法人 tabs
   ========================================================================== */
.page-template-page-templates-template-contact-php .page-title{ border-bottom:none; }

.c-notice{ border:var(--border); padding:16px 20px; margin-bottom:24px; font-size:14px; max-width:640px; }
.c-notice.success{ background:var(--teal); }
.c-notice.error{ background:var(--pink); }

.contact-tabs{ max-width:640px; margin:0 auto; }
.contact-tabs > input[type="radio"]{
  position:absolute; opacity:0; width:1px; height:1px; pointer-events:none;
}
.contact-tabs .tab-labels{ display:flex; gap:12px; margin-bottom:32px; }
.contact-tabs .tab-labels label{
  font-family:'Archivo',sans-serif; font-weight:800; font-size:13px; letter-spacing:0.04em;
  padding:12px 24px; border:2px solid var(--ink); cursor:pointer; background:var(--white);
}
#contact-tab-individual:checked ~ .tab-labels label[for="contact-tab-individual"],
#contact-tab-corporate:checked ~ .tab-labels label[for="contact-tab-corporate"]{
  background:var(--teal);
}
.contact-panel{ display:none; }
#contact-tab-individual:checked ~ .panel-individual{ display:block; }
#contact-tab-corporate:checked ~ .panel-corporate{ display:block; }

.c-field{ margin-bottom:20px; }
.c-field label{ display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.c-field input, .c-field textarea{
  width:100%; border:1.5px solid var(--ink); padding:12px 14px;
  font-family:'Outfit','Noto Sans JP',sans-serif; font-size:14px; background:var(--white);
}
.c-field textarea{ min-height:140px; resize:vertical; }
.c-required{ color:var(--pink); font-size:11px; font-weight:800; margin-left:6px; }
.c-honeypot{ position:absolute; left:-9999px; top:-9999px; }

@media (max-width:600px){
  .contact-tabs .tab-labels label{ padding:10px 16px; font-size:12px; }
}