:root {
  --ink: #173f37; --ink-soft: #48665f; --cream: #f7f4ea; --paper: #fffdf7;
  --leaf: #a8cb9c; --sun: #f2a15f; --line: rgba(23,63,55,.14);
  --max-width: 1180px; --product-ink: #173f37; --product-cream: #f7f4ea;
  --product-paper: #fffdf7; --product-leaf: #a8cb9c; --product-sun: #f2a15f;
  --product-font: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}
.product-header, .product-footer { color: var(--ink); font-family: var(--product-font); }
.product-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 96px; border-bottom: 1px solid var(--line); }
.product-brand { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-size: 25px; font-weight: 760; letter-spacing: -.065em; line-height: 1; text-decoration: none; flex-shrink: 0; }
.product-brand img, .product-brand svg { width: 35px; height: 35px; flex-shrink: 0; }
.product-nav { display: flex; align-items: center; gap: clamp(18px, 3vw, 38px); }
.product-nav a { color: var(--ink-soft); font-size: 14px; font-weight: 580; text-decoration: none; white-space: nowrap; }
.product-nav a:hover, .product-nav a[aria-current="page"] { color: var(--ink); text-decoration: underline; text-underline-offset: 7px; }
.product-actions { display: flex; align-items: center; gap: 18px; }
.language-switch { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 999px; white-space: nowrap; background: rgba(255,253,247,.6); }
.language-switch a, .language-switch button { display: inline-flex; justify-content: center; align-items: center; min-width: 34px; min-height: 32px; padding: 4px 9px; border: 0; border-radius: 999px; font: 600 12px var(--product-font); color: var(--ink-soft); background: transparent; text-decoration: none; cursor: pointer; }
.language-switch [aria-current="true"], .language-switch [aria-pressed="true"] { color: var(--paper); background: var(--ink); }
.product-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 50px; padding: 13px 25px; border: 1px solid var(--ink); border-radius: 999px; background: var(--ink); color: var(--paper); font: 600 14px var(--product-font); text-decoration: none; cursor: pointer; transition: background .18s, transform .18s; }
.product-button:hover { background: #25594d; transform: translateY(-1px); }
.product-button.secondary { background: transparent; color: var(--ink); border-color: var(--line); }
.product-button.secondary:hover { background: rgba(168,203,156,.16); }
.product-button.compact { min-height: 40px; padding: 9px 20px; font-size: 13px; }
.product-header :focus-visible, .product-footer :focus-visible, .language-switch :focus-visible, .product-button:focus-visible { outline: 3px solid var(--sun); outline-offset: 4px; }
.product-footer { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 32px; margin-top: 50px; padding: 50px 0 22px; border-top: 1px solid var(--line); font-size: 13px; }
html[data-himula-website="true"] .product-footer { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
.product-footer p { color: var(--ink-soft); max-width: 270px; margin: 17px 0; }
.product-footer-links { display: flex; align-items: flex-start; flex-direction: column; gap: 10px; }
.product-footer-links strong { margin-bottom: 7px; font-size: 12px; }
.product-footer-links a { color: var(--ink-soft); text-decoration: none; }
.product-footer-links a:hover { color: var(--ink); text-decoration: underline; }
.product-copyright { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 15px; padding-top: 25px; margin-top: 15px; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 11px; }
@media (max-width: 900px) {
  .product-header { flex-wrap: wrap; gap: 16px; min-height: 0; padding: 20px 0 14px; }
  .product-header .product-nav { order: 3; width: 100%; justify-content: center; flex-wrap: wrap; gap: 12px 20px; padding-top: 5px; }
  .product-actions { margin-left: auto; gap: 10px; }
  .product-header .product-button.compact { padding: 9px 14px; font-size: 12px; }
}
@media (max-width: 760px) {
  .product-footer, html[data-himula-website="true"] .product-footer { grid-template-columns: 1fr 1fr; gap: 28px 20px; }
  .product-footer > :first-child { grid-column: 1 / -1; }
  .product-copyright { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { .product-button { transition: none; } .product-button:hover { transform: none; } }