/* CHP product page. Shared navigation, theme and language stay in site.css. */
.chp-page { --chp-accent:var(--orange); --chp-tint:var(--orange-bg); }
.chp-page .eyebrow { color:var(--chp-accent); }
.chp-page .chp-primary { background:var(--ink); color:var(--bg); }
.chp-page .chp-primary:hover { box-shadow:var(--shadow); }
.chp-hero { display:grid; grid-template-columns:1fr 1.08fr; align-items:center; gap:40px; padding:64px 0 48px; }
.chp-hero h1 { font-size:clamp(38px,4.4vw,62px); line-height:1.2; letter-spacing:-.045em; }
.chp-hero h1 em { font-style:normal; color:var(--chp-accent); }
.chp-hero .lead { font-size:17px; }
.chp-hero .button-row { gap:10px; }
.chp-hero .button { padding-inline:18px; }
.chp-release { display:inline-flex; align-items:center; gap:8px; margin-bottom:18px; color:var(--muted); font-size:12px; font-weight:650; }
.chp-release i { color:var(--chp-accent); }
.chp-tags { display:flex; flex-wrap:wrap; gap:10px 18px; margin:22px 0 0; padding:0; list-style:none; color:var(--muted); font-size:12px; }
.chp-tags i { margin-right:5px; color:var(--chp-accent); }
.chp-art { min-width:0; margin:0; }
.chp-art-frame { overflow:hidden; border:1px solid var(--line); border-radius:30px; background:#f6f0e8; box-shadow:var(--shadow); }
.chp-art-frame picture,.chp-art-frame img { display:block; width:100%; }
.chp-art-frame img { aspect-ratio:4/3; object-fit:cover; }
.chp-art-caption { display:flex; justify-content:space-between; gap:12px; padding:14px 4px 0; color:var(--muted); font-size:11px; line-height:1.6; }
.chp-art-caption span:last-child { flex:none; }
.chp-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:24px 0; border-block:1px solid var(--line); }
.chp-summary > div { display:flex; align-items:center; justify-content:center; gap:14px; padding-inline:20px; }
.chp-summary > div + div { border-left:1px solid var(--line); }
.chp-summary strong { color:var(--chp-accent); font-size:32px; line-height:1; letter-spacing:-.04em; }
.chp-summary p { margin:0; color:var(--ink); font-size:14px; font-weight:650; }
.chp-summary small { display:block; color:var(--muted); font-size:11px; font-weight:400; }
.chp-section-heading { display:flex; justify-content:space-between; align-items:end; gap:32px; margin-bottom:32px; }
.chp-section-heading > div { max-width:700px; }
.chp-section-heading h2 { margin-bottom:12px; }
.chp-section-heading p:last-child { margin-bottom:0; }
.chp-section-note { max-width:250px; flex:none; font-size:12px; }
.chp-capabilities { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.chp-capability { min-width:0; padding:28px; border:1px solid var(--line); border-radius:20px; background:var(--surface); }
.chp-card-top { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:28px; }
.chp-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:var(--chp-tint); color:var(--chp-accent); font-size:21px; flex:none; }
.chp-icon.blue { background:var(--blue-bg); color:var(--blue); }
.chp-icon.violet { background:var(--violet-bg); color:var(--violet); }
.chp-card-top code { background:transparent; padding:0; color:var(--muted); font-size:11px; }
.chp-capability h3 { font-size:20px; margin-bottom:10px; }
.chp-capability p { margin-bottom:0; font-size:14px; }
.chp-panel { padding:clamp(24px,4vw,48px); border:1px solid var(--line); border-radius:28px; background:var(--surface); }
.chp-flow { display:grid; grid-template-columns:1fr 40px 1.05fr 40px 1fr; align-items:center; gap:12px; margin:32px 0; }
.chp-flow-column { min-width:0; display:grid; gap:10px; }
.chp-flow-node { display:flex; align-items:center; gap:12px; padding:12px 16px; border:1px solid var(--line); border-radius:14px; font-size:14px; font-weight:650; }
.chp-flow-node img { width:30px; height:30px; object-fit:contain; border-radius:8px; }
.chp-flow-node > i { width:30px; text-align:center; color:var(--blue); font-size:21px; }
.chp-flow-node small { display:block; color:var(--muted); font-size:11px; font-weight:400; }
.chp-flow-arrow { color:var(--muted); text-align:center; font-size:20px; }
.chp-flow-hub { padding:28px 16px; border:1px solid var(--chp-accent); border-radius:22px; background:var(--chp-tint); text-align:center; }
.chp-flow-hub > i { display:block; margin-bottom:12px; color:var(--chp-accent); font-size:38px; }
.chp-flow-hub strong { display:block; font-size:32px; letter-spacing:-.04em; }
.chp-flow-hub p { margin:4px 0 0; font-size:12px; }
.chp-flow-caption { border-top:1px solid var(--line); padding-top:20px; color:var(--muted); font-size:13px; text-align:center; }
.chp-principles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin-top:32px; }
.chp-principles h3 { font-size:17px; }
.chp-principles h3 i { margin-right:8px; color:var(--chp-accent); }
.chp-principles p { margin:0; font-size:14px; }
.chp-speech { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:48px; padding:40px; border-radius:28px; background:var(--blue-bg); }
.chp-speech .eyebrow { color:var(--blue); }
.chp-speech h2 { font-size:clamp(28px,3vw,40px); }
.chp-speech p { font-size:15px; }
.chp-speech p:last-child { margin-bottom:0; }
.chp-audio { min-width:0; margin:0; padding:28px; border:1px solid var(--line); border-radius:22px; background:var(--surface); }
.chp-audio-title { display:flex; align-items:center; gap:10px; color:var(--ink); font-size:14px; font-weight:650; }
.chp-audio-title i { color:var(--blue); }
.chp-waveform { display:flex; justify-content:center; align-items:center; gap:5px; height:120px; margin:16px 0; overflow:hidden; }
.chp-waveform span { display:block; width:6px; flex:0 0 6px; border-radius:5px; background:var(--blue); opacity:.72; }
.chp-audio-formats { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:11px; }
.chp-audio figcaption { margin-top:18px; padding-top:14px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; text-align:center; }
.chp-setup { display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:start; }
.chp-download { padding:32px; border:1px solid var(--line); border-radius:24px; background:var(--surface); }
.chp-download-heading { display:flex; align-items:center; gap:16px; margin-bottom:24px; }
.chp-download-heading > img { width:48px; height:48px; }
.chp-download-heading h3 { margin-bottom:4px; }
.chp-download-heading p { margin:0; font-size:12px; }
.chp-download > p { font-size:14px; }
.chp-download .button { margin-top:12px; width:100%; }
.chp-download-links { display:flex; flex-wrap:wrap; gap:12px 20px; margin-top:20px; font-size:13px; }
.chp-steps { display:grid; gap:26px; margin:0; padding:0; list-style:none; counter-reset:chp-step; }
.chp-steps li { position:relative; padding-left:54px; counter-increment:chp-step; }
.chp-steps li::before { content:"0" counter(chp-step); display:grid; place-items:center; position:absolute; top:0; left:0; width:36px; height:36px; border-radius:12px; background:var(--chp-tint); color:var(--chp-accent); font-size:12px; font-weight:750; }
.chp-steps h3 { font-size:18px; }
.chp-steps p { margin:0; font-size:14px; }
.chp-path { display:block; margin-top:12px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--muted); font-size:12px; overflow-wrap:anywhere; }
.chp-apps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.chp-app { min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:24px; background:var(--surface); }
.chp-app-visual { display:flex; justify-content:center; padding:28px 20px 0; height:300px; overflow:hidden; background:var(--soft); }
.chp-app:nth-child(1) .chp-app-visual { background:var(--orange-bg); }
.chp-app:nth-child(2) .chp-app-visual { background:var(--violet-bg); }
.chp-app:nth-child(3) .chp-app-visual { background:var(--blue-bg); }
.chp-app-visual img { display:block; flex:none; width:210px; height:auto; max-width:100%; align-self:flex-start; border:5px solid var(--line); border-radius:24px 24px 0 0; box-shadow:var(--shadow); }
.chp-app-copy { padding:26px; }
.chp-app-heading { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.chp-app-heading img { width:32px; height:32px; border-radius:9px; }
.chp-app-heading h3 { margin:0; font-size:21px; }
.chp-app-copy p { margin-bottom:18px; font-size:14px; }
.chp-app-copy a { font-size:13px; font-weight:650; }
.chp-app-note { margin-top:18px; color:var(--muted); font-size:12px; }
.chp-faq { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; }
.chp-faq details { padding:20px 24px; border:1px solid var(--line); border-radius:18px; background:var(--surface); }
.chp-faq summary { position:relative; list-style:none; padding-right:28px; color:var(--ink); font-size:15px; font-weight:650; }
.chp-faq summary::-webkit-details-marker { display:none; }
.chp-faq summary::after { content:"+"; position:absolute; right:0; top:0; color:var(--chp-accent); font-size:22px; line-height:1.25; }
.chp-faq details[open] summary::after { content:"−"; }
.chp-faq details p { margin:16px 0 0; font-size:14px; }
.chp-closing { display:flex; align-items:center; justify-content:space-between; gap:32px; padding:40px; margin-bottom:64px; border:1px solid var(--line); border-radius:28px; background:var(--surface); }
.chp-closing h2 { margin-bottom:8px; font-size:clamp(27px,3vw,38px); }
.chp-closing p { margin:0; font-size:14px; }
.chp-closing .button { flex:none; }
@media(min-width:1000px) { .chp-page:lang(en) .chp-hero h1 { font-size:52px; } }
@media(max-width:1000px) {
  .chp-hero { grid-template-columns:1fr 1fr; gap:28px; }
  .chp-hero h1 { font-size:40px; }
  .chp-capability { padding:22px; }
  .chp-section-note { max-width:200px; }
  .chp-flow { grid-template-columns:1fr 24px 1fr 24px 1fr; gap:8px; }
  .chp-flow-node { padding:10px; gap:8px; }
  .chp-speech { gap:28px; padding:28px; }
  .chp-setup { gap:28px; }
}
@media(max-width:760px) {
  .chp-hero { grid-template-columns:1fr; gap:32px; padding:40px 0 32px; }
  .chp-hero h1 { font-size:clamp(36px,7.8vw,52px); }
  .chp-hero .lead { max-width:560px; }
  .chp-art { max-width:560px; width:100%; margin-inline:auto; }
  .chp-art-frame { border-radius:24px; }
  .chp-summary { padding:20px 0; }
  .chp-summary > div { display:block; padding:0 10px; text-align:center; }
  .chp-summary strong { display:block; margin-bottom:8px; font-size:28px; }
  .chp-summary p { font-size:12px; }
  .chp-summary small { font-size:10px; }
  .chp-section-heading { display:block; }
  .chp-section-note { max-width:none; margin-top:16px; }
  .chp-capabilities { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .chp-capability { padding:22px; }
  .chp-card-top { margin-bottom:20px; }
  .chp-flow { grid-template-columns:1fr; gap:16px; margin-block:24px; }
  .chp-flow-column { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .chp-flow-column:last-of-type { grid-template-columns:1fr 1fr; }
  .chp-flow-node { flex-direction:column; align-items:center; text-align:center; font-size:12px; }
  .chp-flow-arrow { transform:rotate(90deg); line-height:1; }
  .chp-flow-hub { padding:20px; }
  .chp-flow-hub > i { display:inline-block; margin:0 12px 0 0; vertical-align:middle; font-size:30px; }
  .chp-flow-hub strong { display:inline-block; font-size:28px; vertical-align:middle; }
  .chp-principles { grid-template-columns:1fr; gap:24px; }
  .chp-speech,.chp-setup { grid-template-columns:1fr; gap:28px; }
  .chp-speech { padding:24px; }
  .chp-audio { padding:22px; }
  .chp-apps { gap:12px; }
  .chp-app-visual { height:200px; padding:20px 12px 0; }
  .chp-app-visual img { width:150px; border-width:3px; border-radius:16px 16px 0 0; }
  .chp-app-copy { padding:20px 16px; }
  .chp-app-heading { flex-direction:column; align-items:flex-start; }
  .chp-app-heading h3 { font-size:18px; }
  .chp-app-copy p { font-size:13px; }
  .chp-faq { grid-template-columns:1fr; }
  .chp-closing { flex-direction:column; align-items:flex-start; padding:28px; margin-bottom:48px; }
}
@media(max-width:480px) {
  .chp-capabilities { grid-template-columns:1fr; }
  .chp-capability { padding:24px; }
  .chp-card-top { margin-bottom:18px; }
  .chp-apps { grid-template-columns:1fr; gap:20px; }
  .chp-app-visual { height:280px; padding-top:24px; }
  .chp-app-visual img { width:220px; border-width:5px; border-radius:24px 24px 0 0; }
  .chp-app-copy { padding:24px; }
  .chp-app-heading { flex-direction:row; align-items:center; }
  .chp-app-copy p { font-size:14px; }
  .chp-art-caption { font-size:10px; }
  .chp-download { padding:24px; }
  .chp-steps li { padding-left:48px; }
  .chp-flow-node { padding:10px 6px; }
  .chp-audio-formats { flex-direction:column; gap:6px; }
}