
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Inter", "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
      -webkit-font-smoothing: antialiased;
    }
    .page-view {
      display: none;
      opacity: 0;
      transition: opacity 0.25s ease-in-out;
    }
    .page-view.active {
      display: block;
      opacity: 1;
    }
    .hero-glow {
      background: radial-gradient(circle at 50% 25%, rgba(225, 29, 72, 0.22) 0%, rgba(225, 29, 72, 0.05) 50%, transparent 75%);
    }
    .card-glass {
      background: rgba(17, 24, 39, 0.75);
      backdrop-filter: blur(16px);
      border: 1px solid rgba(255, 255, 255, 0.08);
    }
    .modal-hidden {
      display: none !important;
      opacity: 0;
      pointer-events: none;
    }
    /* The supplied Tailwind build does not include dynamic opacity classes.
       Use explicit CSS so the decorative watermark never becomes opaque. */
    .ts-hero-watermark {
      position: absolute;
      top: 110px;
      left: 50%;
      width: min(82vw, 1050px);
      height: auto;
      transform: translateX(-50%);
      opacity: 0.055;
      pointer-events: none;
      user-select: none;
      z-index: 0;
      filter: blur(0.6px);
    }
    .ts-hero-watermark-shade {
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background: linear-gradient(to bottom, rgba(7,8,13,.14), rgba(7,8,13,.06) 25%, rgba(7,8,13,.30) 56%, rgba(7,8,13,.62) 100%);
    }
    @media (max-width: 640px) {
      .ts-hero-watermark {
        top: 135px;
        width: 125vw;
        max-width: none;
        opacity: 0.045;
      }
    }
  


.cw-demo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.cw-demo-card{background:#131720;border:1px solid #343b49;border-radius:18px;overflow:hidden;transition:border-color .2s,transform .2s}.cw-demo-card:hover{border-color:#e11d48;transform:translateY(-3px)}.cw-demo-top{display:flex;justify-content:space-between;gap:12px;padding:13px 18px;color:#b9c2d2;font-size:12px;letter-spacing:.05em}.cw-demo-screen{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;background:#f1f1f1}.cw-demo-screen iframe{width:1440px;height:900px;transform:scale(var(--preview-scale,.39));transform-origin:0 0;border:0;pointer-events:none}.cw-demo-shield{position:absolute;inset:0}.cw-demo-info{display:flex;justify-content:space-between;gap:12px;align-items:end;padding:20px}.cw-demo-info h3{color:#fff;font-size:20px;font-weight:500}.cw-demo-info p{color:#aeb8c7;font-size:12px;margin-top:5px}.cw-demo-link{flex-shrink:0;color:#fda4af;font-size:13px;border:1px solid #9f2344;padding:10px 12px;border-radius:9px}.cw-demo-link:hover{background:#9f2344;color:#fff}@media(max-width:800px){.cw-demo-grid{grid-template-columns:1fr;gap:20px}.cw-demo-info{flex-wrap:wrap}.cw-demo-link{width:100%;text-align:center}.cw-demo-screen iframe{transform:scale(var(--preview-scale,.28))}}



/* Tsumoa catalogue: readability improvements */
.cw-demo-info p,.cw-demo-top{font-size:14px !important;line-height:1.6}
.cw-demo-link{font-size:14px!important;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.cw-demo-info{align-items:center}
@media(max-width:640px){.cw-demo-info h3{font-size:19px}.cw-demo-top{font-size:13px!important}}



.ts-brand{flex:0 0 auto;min-width:0;max-width:310px;text-decoration:none}
.ts-brand-img{display:block;width:180px;max-width:100%;height:auto;max-height:50px;object-fit:contain}
.ts-brand-tag{line-height:1.65;white-space:nowrap}
.ts-desktop-nav{gap:clamp(12px,1.6vw,26px);min-width:0}
.ts-desktop-nav button{white-space:nowrap;font-size:13px}
@media(min-width:768px) and (max-width:1199px){
 .ts-desktop-nav{display:none!important}
 .ts-menu-trigger{display:block!important}
 .ts-mobile-menu:not(.hidden){display:block!important}
}
@media(max-width:767px){.ts-brand-img{width:174px}.ts-brand-tag{display:none}}
@media(max-width:380px){.ts-brand-img{width:153px}}
/* avoid clipping menu buttons on tight tablet widths */
.ts-mobile-menu button{min-height:44px}



/* Hero watermark: subtle and lower than the main headline. */
.ts-hero-watermark { top: 260px; opacity: .044; width: min(77vw, 980px); }
.ts-hero-watermark-shade { background: linear-gradient(to bottom, rgba(7,8,13,.10), rgba(7,8,13,.16) 35%, rgba(7,8,13,.42) 70%, rgba(7,8,13,.72)); }
/* Three selected design cards: legible and image-forward. */
.ts-showcase-heading { color: #f8fafc !important; font-weight: 500; letter-spacing: -.025em; }
.ts-showcase-lead { color: #cbd5e1 !important; font-size: 15px !important; line-height: 1.9; }
.ts-showcase-card { display: block; min-width: 0; border-color: rgba(255,255,255,.22) !important; }
.ts-showcase-preview { height: 292px !important; padding: 19px !important; gap: 12px; }
.ts-showcase-visual { display: grid !important; grid-template-columns: minmax(0, .77fr) minmax(0, 1.23fr); gap: 13px; align-items: center; min-height: 0; flex: 1 1 auto; }
.ts-showcase-visual > div { min-width: 0; }
.ts-showcase-photo { width: 100% !important; height: 180px !important; border-radius: 8px; object-fit: cover; box-shadow: 0 8px 24px rgba(0,0,0,.13); }
.ts-showcase-details { padding: 18px 19px !important; background: #171c28; border-top: 1px solid rgba(255,255,255,.11); }
.ts-showcase-details strong { display:block; color:#fff !important; font-size:16px; font-weight:600; }
.ts-showcase-details p { color:#d0d9e8 !important; font-size:14px !important; line-height:1.65; }
.ts-showcase-card:hover .ts-showcase-photo { transform: scale(1.025); transition: transform .25s ease; }
.ts-showcase-card:focus-visible { outline: 2px solid #fb7185; outline-offset: 3px; }
@media (max-width: 960px) { .ts-showcase-preview {height: 265px !important;} .ts-showcase-photo { height:150px !important;} }
@media (max-width: 640px) { .ts-hero-watermark {top: 285px; width: 120vw; opacity:.038;} .ts-showcase-preview { height: 265px !important; padding:17px !important;} .ts-showcase-photo {height:155px !important;} .ts-showcase-details { padding:17px !important;} }
@media (prefers-reduced-motion: reduce) { .ts-showcase-photo { transition:none!important; transform:none!important;} }



/* Watermark: restore the original higher placement and a clearly perceptible, but quiet, logo. */
#page-home > section:first-of-type .ts-hero-watermark {
  top: 142px;
  width: min(78vw, 960px);
  max-width: none;
  opacity: .105;
  filter: blur(.35px);
}
#page-home > section:first-of-type .ts-hero-watermark-shade {
  background: linear-gradient(to bottom, rgba(7,8,13,.02) 0%, rgba(7,8,13,.05) 37%, rgba(7,8,13,.22) 70%, rgba(7,8,13,.52) 100%);
}
/* The whole showcase card responds; the photo stays perfectly still. */
#page-home .ts-showcase-card {
  transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease, background-color .24s ease;
  will-change: auto;
}
#page-home .ts-showcase-card:hover, #page-home .ts-showcase-card:focus-visible {
  transform: translateY(-4px);
  border-color: rgba(251,113,133,.78) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.26), 0 0 0 1px rgba(251,113,133,.10);
}
#page-home .ts-showcase-card .ts-showcase-photo,
#page-home .ts-showcase-card:hover .ts-showcase-photo,
#page-home .ts-showcase-card:focus-visible .ts-showcase-photo {
  transform: none !important;
  transition: none !important;
}
@media (max-width: 640px) {
  #page-home > section:first-of-type .ts-hero-watermark { top: 150px; width: 120vw; opacity: .078; }
  #page-home .ts-showcase-card:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  #page-home .ts-showcase-card { transition: none !important; }
  #page-home .ts-showcase-card:hover, #page-home .ts-showcase-card:focus-visible { transform: none !important; }
}



/* Brand mark stands alone in the header; the service category is already in the hero. */
.ts-brand {max-width:225px}
.ts-brand-img {width:205px;max-height:56px}
.ts-brand-story {border-bottom:1px solid rgba(255,255,255,.10);padding:76px 24px;background:linear-gradient(130deg,#0e1019 0%,#101019 58%,#170d17 100%)}
.ts-brand-story-inner {max-width:1120px;margin:0 auto;display:grid;grid-template-columns:minmax(0,0.92fr) minmax(0,1.08fr);gap:clamp(30px,6vw,88px);align-items:center}
.ts-brand-story-visual {min-width:0}
.ts-brand-story-logo-frame {min-height:215px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.10);border-radius:24px;display:flex;align-items:center;justify-content:center;padding:clamp(28px,4vw,54px)}
.ts-brand-story-logo-frame img {display:block;width:100%;max-width:420px;height:auto;object-fit:contain}
.ts-brand-story-caption {color:#8e95a5;font-size:11px;letter-spacing:.14em;margin-top:17px;text-align:center}
.ts-brand-story-eyebrow {display:block;color:#fb7185;font-size:12px;letter-spacing:.18em;font-weight:600;margin-bottom:13px}
.ts-brand-story-copy h2 {font-size:clamp(25px,3vw,38px);font-weight:300;color:#fff;line-height:1.4;letter-spacing:.015em;margin:0 0 15px}
.ts-brand-story-lead {font-size:clamp(18px,2vw,23px)!important;line-height:1.7!important;color:#fda4af!important;font-weight:400;margin:0 0 21px!important}
.ts-brand-story-copy p {font-size:15px;line-height:2.1;color:#cbd5e1;margin:0 0 16px}
.ts-brand-story-copy strong {color:#f8fafc;font-weight:500}
.ts-footer-logo {display:block;width:154px;max-width:100%;height:auto;object-fit:contain}
@media(max-width:767px){.ts-brand-img{width:178px}.ts-brand-story{padding:56px 20px}.ts-brand-story-inner{grid-template-columns:1fr;gap:28px}.ts-brand-story-logo-frame{min-height:165px;padding:30px}.ts-brand-story-copy p{font-size:15px;line-height:1.95}}
@media(max-width:380px){.ts-brand-img{width:155px}}



/* ===== Tsumoa campaign: CMS/HTML editable content blocks ===== */
.ts-campaign { box-sizing:border-box; color:#f8fafc; border:1px solid rgba(251,113,133,.40); background:linear-gradient(115deg,rgba(78,23,45,.75),rgba(25,27,42,.95) 62%); border-radius:20px; }
.ts-campaign * { box-sizing:border-box; }
.ts-campaign-eyebrow { color:#fda4af; font:600 12px/1.5 Inter, sans-serif; letter-spacing:.18em; }
.ts-campaign-head { font-size:clamp(18px,2.4vw,25px); line-height:1.5; font-weight:500; color:#fff; }
.ts-campaign-price { color:#fff; font-size:clamp(30px,4vw,43px); font-weight:600; line-height:1.25; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.ts-campaign-small { color:#cbd5e1; font-size:13px; line-height:1.7; }
.ts-campaign-status { display:inline-block; padding:5px 11px; border:1px solid rgba(253,164,175,.45); border-radius:999px; background:rgba(225,29,72,.11); color:#fecdd3; font-size:12px; font-weight:600; white-space:nowrap; }
.ts-campaign-hero { max-width:690px; margin:6px auto 26px; padding:19px 24px; text-align:left; }
.ts-campaign-hero-inner { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.ts-campaign-hero-price { text-align:right; flex-shrink:0; }
.ts-campaign-page { padding:28px; margin-bottom:32px; }
.ts-campaign-contact { padding:18px 22px; margin-bottom:24px; }
.ts-campaign-cta { min-height:44px; display:inline-flex; align-items:center; justify-content:center; padding:10px 19px; background:#e11d48; color:#fff; border-radius:999px; font-size:14px; font-weight:500; cursor:pointer; transition:background .2s; }
.ts-campaign-cta:hover {background:#be123c;}
.ts-campaign-note { font-size:12px; color:#aeb7c9; line-height:1.7; }
@media(max-width:640px){.ts-campaign-hero{padding:19px 17px;}.ts-campaign-hero-inner{flex-direction:column;align-items:flex-start;gap:12px;}.ts-campaign-hero-price{text-align:left;}.ts-campaign-page{padding:22px 18px;}.ts-campaign-contact{padding:18px;}}

:where(.page-link){display:inline-block}
nav a[aria-current="page"]{color:#fb7185;border-bottom:1px solid currentColor;font-weight:600}
