/*
Theme Name: Tsuboi Construction LP
Theme URI: https://example.com/
Author: OpenAI
Description: Responsive site theme with CCUS page, site-wide phone links, and contact form page.
Version: 4.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: tsuboi-construction-lp
*/
:root { color-scheme: light; }
*, *::before, *::after { box-sizing: border-box; }
html { margin: 0; padding: 0; scroll-behavior: smooth; }
body { margin: 0; padding: 0; background: #06274b; color: #082f5d; font-family: -apple-system, BlinkMacSystemFont, "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; }
.tsuboi-page { width: 100%; margin: 0 auto; }
.tsuboi-artwork { position: relative; width: 100%; max-width: 1024px; margin-inline: auto; line-height: 0; }
.tsuboi-artwork__image { display: block; width: 100%; height: auto; margin: 0; }
.tsuboi-hotspot { position: absolute; z-index: 2; display: block; overflow: hidden; color: transparent; font-size: 0; line-height: 0; background: transparent; text-decoration: none; border: 0; border-radius: 4px; }
.tsuboi-hotspot:focus-visible { outline: 3px solid #ffcf3f; outline-offset: 2px; background: rgb(255 207 63 / 12%); }
.tsuboi-hotspot--header-phone { left: 62.5%; top: 0.3%; width: 15.5%; height: 3.1%; }
.tsuboi-hotspot--header-contact { left: 78.0%; top: 0.3%; width: 17.3%; height: 3.1%; }
.tsuboi-hotspot--service-1 { left: 12.5%; top: 49.1%; width: 15.0%; height: 2.4%; }
.tsuboi-hotspot--service-2 { left: 42.5%; top: 49.1%; width: 15.0%; height: 2.4%; }
.tsuboi-hotspot--service-3 { left: 72.8%; top: 49.1%; width: 15.0%; height: 2.4%; }
.tsuboi-hotspot--footer-phone { left: 45.2%; top: 88.0%; width: 21.8%; height: 6.4%; }
.tsuboi-hotspot--footer-contact { left: 69.0%; top: 88.0%; width: 26.5%; height: 6.4%; }
.tsuboi-mobile { display: none; }
@media (max-width: 767px) {
  body { background: #fff; }
  .tsuboi-desktop { display: none; }
  .tsuboi-mobile { display: block; width: 100%; max-width: 560px; margin: 0 auto; overflow: hidden; background: #fff; line-height: 0; }
  .tsuboi-mobile img { display: block; max-width: 100%; height: auto; margin: 0; }
  .tsuboi-mobile a { display: block; min-width: 0; line-height: 0; }
  .tsuboi-mobile__header { width: 100%; background: #fff; padding: 5px 4.5% 7px; }
  .tsuboi-mobile__brand { width: 100%; }
  .tsuboi-mobile__header-actions { display: grid; grid-template-columns: 1fr 1.15fr; align-items: center; gap: 8px; margin-top: 3px; }
  .tsuboi-mobile__header-actions img { width: 100%; }
  .tsuboi-mobile__hero { width: 100%; background: #0870b6; }
  .tsuboi-mobile__hero img { width: 100%; }
  .tsuboi-mobile__section { padding: 0 0 14px; }
  .tsuboi-mobile__section-heading { width: 100%; }
  .tsuboi-mobile__services { background: #f4f8fc; }
  .tsuboi-mobile__services > a { margin: 0 0 12px; padding: 0 4.8%; }
  .tsuboi-mobile__services > a img { width: 100%; }
  .tsuboi-mobile__reasons { background: #07518b; padding-bottom: 18px; }
  .tsuboi-mobile__reasons > img:not(.tsuboi-mobile__section-heading) { width: 100%; padding: 0 4.8%; margin: 0 0 8px; }
  .tsuboi-mobile__flow { background: #fff; padding-bottom: 12px; }
  .tsuboi-mobile__flow > img:not(.tsuboi-mobile__section-heading) { width: 100%; padding: 0 4.8%; margin: 0 0 8px; }
  .tsuboi-mobile__cta { background: #0a4779; padding: 12px 4.8% 16px; }
  .tsuboi-mobile__cta-copy { width: 100%; margin-bottom: 8px !important; }
  .tsuboi-mobile__cta > a { width: 100%; margin: 0 0 8px; }
  .tsuboi-mobile__cta > a img { width: 100%; }
  .tsuboi-mobile__footer { width: 100%; }
  .tsuboi-hotspot:focus-visible { outline-width: 2px; }
}
@media (min-width: 768px) {
  .tsuboi-mobile { display: none !important; }
  .tsuboi-desktop { display: block; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* CCUS service detail page */
.tsuboi-service-page { background:#fff; color:#163b65; line-height:1.75; }
.tsuboi-service-page a { text-decoration:none; }
.ccus-wrap { width:min(1120px, calc(100% - 48px)); margin-inline:auto; }
.ccus-header { min-height:76px; padding:14px max(24px, calc((100% - 1120px)/2)); display:flex; align-items:center; justify-content:space-between; gap:24px; background:#fff; }
.ccus-brand { color:#082f5d; font-weight:800; font-size:21px; white-space:nowrap; }
.ccus-brand span { display:block; font-size:11px; font-weight:600; letter-spacing:.04em; }
.ccus-header-actions { display:flex; align-items:center; gap:20px; }
.ccus-phone { color:#082f5d; font-weight:800; white-space:nowrap; }
.ccus-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:48px; padding:12px 24px; border-radius:6px; font-weight:800; text-align:center; transition:filter .2s ease; }
.ccus-button:hover { filter:brightness(.96); }
.ccus-button--yellow { color:#082f5d; background:#ffd044; box-shadow:0 3px 0 #d9a91f; }
.ccus-button--white { color:#082f5d; background:#fff; }
.ccus-hero { overflow:hidden; background:linear-gradient(115deg,#07518b 0%,#0874b8 58%,#0b3e70 100%); color:#fff; }
.ccus-hero-grid { min-height:390px; display:grid; grid-template-columns:1.25fr .75fr; align-items:center; gap:32px; padding-block:54px; }
.ccus-eyebrow { margin:0 0 12px; font-weight:700; letter-spacing:.06em; }
.ccus-hero h1 { margin:0 0 18px; color:#fff; font-size:clamp(34px,5vw,54px); line-height:1.2; letter-spacing:.02em; }
.ccus-hero-lead { max-width:650px; margin:0 0 14px; font-size:clamp(18px,2.2vw,24px); font-weight:800; line-height:1.55; }
.ccus-hero-text { max-width:640px; margin:0 0 26px; color:#eaf5ff; }
.ccus-hero-mark { display:flex; align-items:center; justify-content:center; }
.ccus-mark-circle { width:min(290px,100%); aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center; border:7px solid #ffdb58; border-radius:50%; color:#082f5d; background:linear-gradient(145deg,#fff1a8,#ffc62f); box-shadow:0 12px 35px #002d5740; text-align:center; transform:rotate(3deg); }
.ccus-mark-circle span { font-size:30px; font-weight:900; letter-spacing:.08em; }
.ccus-mark-circle strong { font-size:26px; }
.ccus-mark-circle small { padding:0 14px; font-weight:700; }
.ccus-section { padding:68px 0; }
.ccus-section--pale,.ccus-faq { background:#f2f7fb; }
.ccus-section-kicker { margin:0 0 8px; color:#b18400; font-size:12px; font-weight:900; letter-spacing:.18em; text-align:center; }
.ccus-section h2,.ccus-faq h2 { margin:0 0 32px; color:#082f5d; font-size:clamp(25px,3vw,34px); line-height:1.4; text-align:center; }
.ccus-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.ccus-card { position:relative; padding:30px 26px; background:#fff; border:1px solid #e1eaf3; box-shadow:0 8px 24px #0739670d; }
.ccus-card-number { color:#c89b15; font-size:14px; font-weight:900; letter-spacing:.08em; }
.ccus-card h3 { margin:10px 0 12px; color:#082f5d; font-size:21px; }
.ccus-card p { margin:0; color:#43566c; }
.ccus-note { margin:20px 0 0; color:#52677b; font-size:13px; }
.ccus-flow { max-width:850px; margin:0 auto; padding:0; list-style:none; }
.ccus-flow li { display:flex; align-items:flex-start; gap:18px; padding:18px 0; border-bottom:1px solid #d8e3ed; }
.ccus-flow li>span { flex:0 0 40px; width:40px; height:40px; display:grid; place-items:center; border-radius:50%; background:#ffd044; color:#082f5d; font-weight:900; }
.ccus-flow h3 { margin:0 0 4px; font-size:19px; }
.ccus-flow p { margin:0; color:#52677b; }
.ccus-two-col { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:48px; }
.ccus-two-col .ccus-section-kicker { text-align:left; }
.ccus-two-col h2 { margin-bottom:16px; text-align:left; }
.ccus-two-col p { color:#52677b; }
.ccus-checklist { margin:0; padding:26px 30px; background:#f5f8fb; list-style:none; }
.ccus-checklist li { position:relative; padding:9px 0 9px 28px; border-bottom:1px solid #e1e8ef; }
.ccus-checklist li:last-child { border-bottom:0; }
.ccus-checklist li:before { content:'✓'; position:absolute; left:0; color:#c89b15; font-weight:900; }
.ccus-faq { padding:64px 0; }
.ccus-faq details { max-width:850px; margin:0 auto 12px; padding:18px 22px; background:#fff; border:1px solid #e0e9f1; }
.ccus-faq summary { color:#082f5d; cursor:pointer; font-weight:800; }
.ccus-faq details p { margin:12px 0 0; color:#52677b; }
.ccus-bottom-cta { padding:54px 0; color:#fff; background:linear-gradient(120deg,#06315b,#0a5b95); text-align:center; }
.ccus-bottom-cta p { margin:0 0 6px; color:#ffdc59; font-weight:800; }
.ccus-bottom-cta h2 { margin:0 0 24px; color:#fff; font-size:clamp(25px,3vw,34px); }
.ccus-cta-actions { display:flex; justify-content:center; gap:14px; }
.ccus-footer { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:22px max(24px, calc((100% - 1120px)/2)); background:#03264a; color:#fff; font-size:13px; }
.ccus-footer a { color:#fff; font-weight:800; }
@media (max-width:767px) {
 .ccus-wrap { width:calc(100% - 36px); }
 .ccus-header { align-items:flex-start; flex-direction:column; gap:10px; padding:13px 18px; }
 .ccus-brand { font-size:18px; white-space:normal; }
 .ccus-header-actions { width:100%; gap:8px; }
 .ccus-phone,.ccus-header-actions .ccus-button { flex:1; min-width:0; padding:10px 8px; font-size:13px; }
 .ccus-hero-grid { grid-template-columns:1fr; gap:24px; padding-block:38px; }
 .ccus-hero h1 { font-size:36px; }
 .ccus-hero-mark { justify-content:flex-start; }
 .ccus-mark-circle { width:190px; border-width:5px; }
 .ccus-mark-circle span { font-size:23px; }
 .ccus-mark-circle strong { font-size:21px; }
 .ccus-section { padding:44px 0; }
 .ccus-section h2,.ccus-faq h2 { margin-bottom:24px; }
 .ccus-cards { grid-template-columns:1fr; gap:12px; }
 .ccus-card { padding:23px 22px; }
 .ccus-card h3 { font-size:19px; }
 .ccus-flow li { gap:12px; }
 .ccus-flow h3 { font-size:17px; }
 .ccus-two-col { grid-template-columns:1fr; gap:18px; }
 .ccus-cta-actions { flex-direction:column; }
 .ccus-footer { align-items:flex-start; flex-direction:column; padding:20px 18px; gap:7px; }
}