.portfolio-home, .portfolio-detail { letter-spacing: 0; }
.portfolio-home .hero { min-height: 680px; }
.portfolio-home .hero-bg { transform: none; }
.portfolio-home .site-header.is-scrolled { background: #14252cf5; }
.portfolio-home .hero-content { max-width: 1160px; padding-top: 120px; padding-bottom: 54px; }
.portfolio-home .hero h1 { font-size: 56px; line-height: 1.18; letter-spacing: 0; }
.portfolio-home .hero-subtitle { max-width: 760px; font-size: 19px; }
.portfolio-home .hero-logo { max-height: 132px; width: auto; object-fit: contain; }
.portfolio-home .intro-grid h2 { font-size: 36px; line-height: 1.35; letter-spacing: 0; }
.portfolio-home .section-heading h2, .portfolio-home .product-section-head h2 { font-size: 38px; letter-spacing: 0; }
.portfolio-home #products { padding: 80px 0; background: #f4f7f8; color: #16252b; }
.portfolio-home #products::before { display: none; }
.portfolio-home #products h2 { color: #16252b; font-size: 38px; }
.portfolio-home #products .section-kicker { color: #326b79; }
.portfolio-home .product-section-head { margin-bottom: 46px; }
.portfolio-home .product-section-head > p:last-child { max-width: 720px; color: #53646c; }
.portfolio-group + .portfolio-group { margin-top: 58px; }
.portfolio-group-heading { display: flex; gap: 20px; flex-wrap: wrap; align-items: baseline; padding-bottom: 18px; border-bottom: 1px solid #cbd9df; margin-bottom: 24px; }
.portfolio-group-heading h3 { margin: 0; font-size: 25px; line-height: 1.35; }
.portfolio-group-heading p { margin: 0; font-size: 15px; color: #52656e; }
.portfolio-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.portfolio-card { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #d4dfe3; border-radius: 8px; background: #fff; transition: border-color 150ms ease, box-shadow 150ms ease; }
.portfolio-card:hover { border-color: #658f9c; box-shadow: 0 10px 26px #142b3710; }
.portfolio-card-media { height: 244px; padding: 16px; display: grid; place-items: center; background: #e6eef0; border-bottom: 1px solid #e0e8eb; }
.portfolio-card-media img { width: 100%; height: 100%; max-height: 212px; object-fit: contain; }
.portfolio-card[data-product="shopping"] .portfolio-card-media { background: #eef5f1; }
.portfolio-card[data-product="pulsefit"] .portfolio-card-media { background: #151c22; }
.portfolio-card[data-product="kirisuzu"] .portfolio-card-media { background: #f1eee7; }
.portfolio-card[data-product="rail"] .portfolio-card-media { background: #e7e9ef; }
.portfolio-card-media.is-illustration { padding: 0; }
.portfolio-card-media.is-illustration img { max-height: none; object-fit: cover; }
.portfolio-card-body { flex: 1; display: flex; flex-direction: column; gap: 14px; padding: 24px; }
.portfolio-card-heading { display: flex; align-items: center; gap: 12px; min-height: 58px; }
.portfolio-card-heading img { flex: 0 0 48px; width: 48px; height: 48px; object-fit: contain; border-radius: 8px; }
.portfolio-card-heading h4 { min-width: 0; font-size: 21px; line-height: 1.35; margin: 0; overflow-wrap: anywhere; }
.portfolio-type { margin: 0; color: #4d6570; font-size: 12px; line-height: 1.5; font-weight: 600; }
.portfolio-summary { margin: 0; color: #4e6069; font-size: 15px; line-height: 1.8; }
.portfolio-tags { margin: auto 0 0; padding: 16px 0 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px 16px; color: #22746d; font-size: 12px; font-weight: 600; }
.portfolio-card-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; border-top: 1px solid #e2e9eb; padding-top: 12px; margin-top: 2px; font-size: 14px; font-weight: 700; color: #153e50; }
.portfolio-card-link:hover { color: #0f7d82; }
.portfolio-card a:focus-visible, .portfolio-detail a:focus-visible { outline: 3px solid #008b99; outline-offset: 4px; }
.portfolio-detail { background: #fff; color: #16252b; }
.portfolio-detail .site-header { background: #14252c; position: sticky; min-height: 76px; }
.portfolio-detail .section-shell { width: min(1160px, calc(100% - 64px)); margin-inline: auto; }
.portfolio-detail h1, .portfolio-detail h2, .portfolio-detail h3 { letter-spacing: 0; }
.portfolio-detail .product-intro { padding: 42px 0 44px; }
.portfolio-breadcrumb { display: inline-flex; gap: 8px; min-height: 44px; align-items: center; color: #396273; font-size: 14px; margin-bottom: 25px; }
.portfolio-product-lockup { display: flex; gap: 18px; align-items: center; margin-bottom: 18px; }
.portfolio-product-lockup img { height: 72px; width: 72px; border-radius: 8px; object-fit: contain; }
.portfolio-product-lockup p { margin: 0; color: #3d6674; font-size: 14px; font-weight: 600; }
.portfolio-detail h1 { margin: 0 0 20px; max-width: 1000px; font-size: 48px; line-height: 1.2; overflow-wrap: anywhere; }
.portfolio-lead { font-size: 20px; line-height: 1.8; max-width: 850px; margin: 0 0 24px; color: #4a6069; }
.portfolio-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.portfolio-actions a { display: inline-flex; justify-content: center; align-items: center; min-height: 48px; padding: 12px 22px; background: #145a62; color: #fff; font-size: 15px; font-weight: 700; border: 1px solid #145a62; border-radius: 6px; }
.portfolio-actions .portfolio-secondary { background: #fff; color: #145a62; }
.portfolio-stage { background: #edf3f4; padding: 36px 0; }
.portfolio-stage[data-product="pulsefit"] { background: #182126; }
.portfolio-stage figure { display: flex; justify-content: center; align-items: center; gap: 28px; margin: 0 auto; max-width: 1100px; }
.portfolio-stage img { width: auto; min-width: 0; max-width: 100%; max-height: 540px; object-fit: contain; }
.portfolio-stage figcaption { display: none; }
.portfolio-stage .stage-caption { text-align: center; font-size: 12px; margin: 18px 0 0; color: #526b75; }
.portfolio-stage[data-product="pulsefit"] .stage-caption { color: #afc8ce; }
.portfolio-features { padding: 68px 0; }
.portfolio-detail h2 { margin: 0 0 26px; font-size: 32px; line-height: 1.4; }
.portfolio-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.portfolio-feature-grid article { padding-top: 20px; border-top: 2px solid #8fb7c1; min-width: 0; }
.portfolio-feature-grid span { font-size: 13px; color: #507480; }
.portfolio-feature-grid h3 { margin: 12px 0; font-size: 21px; line-height: 1.5; }
.portfolio-feature-grid p { color: #50646c; margin: 0; font-size: 16px; line-height: 1.8; }
.portfolio-note { margin: 38px 0 0; padding-top: 24px; border-top: 1px solid #d8e3e6; color: #53656e; font-size: 14px; line-height: 1.8; }
.portfolio-detail .cta-section { padding: 64px 0; background: #eaf2f3; color: #152d36; }
.portfolio-detail .cta-grid { align-items: start; }
.portfolio-detail .cta-grid h2 { font-size: 32px; }
.portfolio-detail .cta-grid p { color: #4e666e; }
.portfolio-detail .contact-form { box-shadow: none; border: 1px solid #d1dfe2; border-radius: 8px; }
.portfolio-related { padding: 54px 0; }
.portfolio-related-links { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.portfolio-related-links a { min-height: 44px; display: inline-flex; gap: 10px; align-items: center; color: #1f606e; border-bottom: 1px solid #b8cdd4; }
.portfolio-home [data-i18n], .portfolio-detail [data-i18n] { overflow-wrap: break-word; }
.portfolio-home:not([data-lang="zh"]) .footer-inner p:first-child > span,
.portfolio-detail:not([data-lang="zh"]) .footer-inner p:first-child > span { display: none; }
.portfolio-chat-unavailable { padding: 32px 26px; height: 100%; background: #fff; color: #163540; }
.portfolio-chat-unavailable[hidden], #asukanova-chat-panel iframe[hidden] { display: none; }
.portfolio-chat-unavailable h2 { font-size: 23px; line-height: 1.5; margin: 0 0 16px; }
.portfolio-chat-unavailable p { font-size: 16px; line-height: 1.8; color: #51656e; }
.portfolio-chat-unavailable a, .portfolio-chat-unavailable button { display: block; width: 100%; padding: 12px 18px; margin-top: 14px; text-align: center; border: 1px solid #306d78; border-radius: 6px; background: #fff; color: #215d67; font-size: 15px; cursor: pointer; }
.portfolio-chat-unavailable a { background: #215d67; color: #fff; }
@media (max-width: 1050px) {
  .portfolio-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portfolio-detail .nav-links { display: none; }
  .portfolio-feature-grid { gap: 24px; }
}
@media (max-width: 680px) {
  .portfolio-home .hero { min-height: 640px; }
  .portfolio-home .hero-content { padding-top: 116px; padding-bottom: 34px; }
  .portfolio-home .hero h1 { font-size: 36px; }
  .portfolio-home .hero-subtitle { font-size: 16px; }
  .portfolio-home .hero-logo { max-height: 100px; }
  .portfolio-home .hero-metrics { margin-top: 24px; }
  .portfolio-home .intro-grid h2, .portfolio-home .section-heading h2, .portfolio-home .product-section-head h2 { font-size: 28px; }
  .portfolio-home #products { padding: 48px 0; }
  .portfolio-home #products h2 { font-size: 28px; }
  .portfolio-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .portfolio-card-media { height: 258px; }
  .portfolio-card-media img { max-height: 226px; }
  .portfolio-card-body { padding: 22px; }
  .portfolio-group-heading { gap: 10px; }
  .portfolio-group-heading h3 { font-size: 23px; }
  .portfolio-detail .section-shell { width: calc(100% - 36px); }
  .portfolio-detail .site-header { gap: 12px; padding: 12px 18px; }
  .portfolio-detail .header-action { display: none; }
  .portfolio-detail .brand { gap: 8px; }
  .portfolio-detail .brand-mark { width: 40px; height: 36px; }
  .portfolio-detail .brand strong { font-size: 14px; }
  .portfolio-detail .brand small { font-size: 9px; }
  .portfolio-detail .language-switcher { gap: 0; padding: 3px; }
  .portfolio-detail .language-switcher button { min-width: 34px; min-height: 38px; padding: 6px; font-size: 13px; }
  .portfolio-detail .product-intro { padding: 24px 0 32px; }
  .portfolio-detail h1 { font-size: 32px; }
  .portfolio-lead { font-size: 17px; }
  .portfolio-actions { flex-direction: column; }
  .portfolio-stage figure { flex-wrap: wrap; gap: 18px; }
  .portfolio-stage img { max-height: 480px; max-width: 90%; }
  .portfolio-stage img:not(:first-child) { max-width: calc(50% - 9px); max-height: 330px; }
  .portfolio-detail h2, .portfolio-detail .cta-grid h2 { font-size: 27px; }
  .portfolio-feature-grid { grid-template-columns: 1fr; gap: 30px; }
  .portfolio-features { padding: 44px 0; }
  .portfolio-detail .cta-grid { grid-template-columns: 1fr; }
  .portfolio-detail .site-footer { padding-bottom: 90px; }
}
@media (prefers-reduced-motion: reduce) {
  .portfolio-card { transition: none; }
}