/* Product-page sample only. Geometry does not animate or move on hover. */
.p19 { background:#faf9f5; color:#173f42; }
.p19-hero,.p19-section { position:relative; isolation:isolate; overflow:hidden; }
.p19-backdrop { position:absolute; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; }
.p19-hero { border-bottom:1px solid #dbe3dc; }
.p19-hero-in { min-height:470px; display:grid; grid-template-columns:1.16fr 1fr; align-items:center; gap:24px; padding-block:44px; }
.p19-hero h1 { font-size:clamp(36px,4vw,59px); line-height:1.24; letter-spacing:-.045em; margin:22px 0; }
.p19-hero .pg-lede { max-width:540px; font-size:17px; line-height:1.9; }
.p19-hero-art { width:100%; height:auto; overflow:visible; }
.p19 .eyebrow { color:#647d72; font-size:12px; letter-spacing:.06em; }
.p19-index { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding-block:28px; gap:0 38px; }
.p19-index a { display:flex; gap:16px; align-items:center; border-bottom:1px solid #d6e1d7; padding:21px 0; color:#1e5759; font-size:15px; min-height:64px; }
.p19-index a span { color:#b07b56; font-size:11px; }
.p19-index a b { font-weight:500; }
.p19-index a i { margin-left:auto; font-style:normal; color:#b07b56; }
.p19-index a:hover { color:#c44e22; border-color:#e9a976; }
.p19-section { padding:72px 0 82px; scroll-margin-top:88px; border-bottom:1px solid #dbe4dc; }
.p19-section:nth-of-type(2n) { background:#eaf1eb45; }
.p19-section .p19-backdrop { opacity:.65; transform:scaleX(-1); }
.p19-section .p19-backdrop { mask-image:linear-gradient(90deg,#0003,#000 72%); }
.p19-section:nth-of-type(2n) .p19-backdrop { transform:none; opacity:.8; }
.p19-feature { display:grid; grid-template-columns:minmax(0,.84fr) minmax(0,1.26fr); gap:58px; align-items:center; }
.p19-copy { position:relative; }
.p19-number { font-size:15px; margin-right:12px; color:#cb7545; }
.p19-copy h2 { font-size:clamp(28px,2.75vw,40px); line-height:1.3; font-weight:600; letter-spacing:-.035em; text-wrap:balance; margin-top:25px; }
.p19-copy h2 small { display:block; font-size:32px; font-weight:450; margin-top:9px; letter-spacing:-.02em; }
.p19-summary { color:#3c6660; font-size:17px; line-height:1.9; margin-top:23px; max-width:440px; }
.p19-copy h3 { margin:40px 0 14px; font-size:16px; line-height:1.7; font-weight:600; }
.p19-definition { font-size:14px; color:#66766c; line-height:2; max-width:460px; }
.p19-model { margin:0; min-width:0; border-radius:24px; background:linear-gradient(130deg,#ffffffa8,#f9fbf6b0 48%,#d4e7df60 74%,#fff0e384); border:1px solid #fff; box-shadow:inset 0 1px 0 #fff,0 24px 52px -38px #497d6c; overflow:hidden; }
.p19-model figcaption { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; padding:23px 25px 0; color:#52766c; font-size:12px; font-weight:500; }
.p19-model figcaption span { font-size:10px; color:#75867c; font-weight:400; }
.p19-art { padding:0 14px; }
.p19-art svg { width:100%; height:auto; display:block; }
.p19-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:0 24px; gap:8px; }
.p19-choice { position:relative; font:inherit; font-size:12px; font-weight:500; display:flex; align-items:center; gap:7px; text-align:left; padding:12px 9px; min-height:46px; color:#376a62; background:#ffffffb8; border:1px solid #d9e6de; border-radius:7px; cursor:pointer; transition:background .22s,border-color .22s,color .22s; }
.p19-choice span { font-size:9px; color:#8c9e90; }
.p19-choice:hover { background:#fff8ef; border-color:#e1bfa0; }
.p19-choice[aria-pressed=true] { background:#fff0df; border-color:#e8b68d; color:#95512e; }
.p19-choice[aria-pressed=true] span { color:#be7448; }
.p19-choice:focus-visible { outline:3px solid #12636a; outline-offset:3px; }
.p19-explain { margin:18px 24px 23px; padding:17px 0 0; border-top:1px solid #d9e4db; min-height:103px; }
.p19-explain .vm-detail-title { font-size:14px; margin-bottom:5px; }
.p19-explain .vm-detail p:last-child { font-size:12px; line-height:1.85; }
.p19-trace { stroke:#7faca0; stroke-width:2.2; opacity:.45; }
.p19-trace.is-current { stroke:#ed8a4c; stroke-width:3; opacity:1; stroke-dasharray:22 8; animation:p19-flow 2.8s linear infinite; animation-play-state:paused; }
.p19-model.is-visible .p19-trace.is-current { animation-play-state:running; }
.p19-glint { opacity:.34; animation:p19-glint 4.5s ease-in-out infinite; animation-play-state:paused; }
.p19-model.is-visible .p19-glint { animation-play-state:running; }
.p19-solid:nth-of-type(2n) .p19-glint { animation-delay:-1.6s; }
.p19-close { padding:76px 0 92px; background:#f3f5ef; }
.p19-close h2 { font-size:clamp(28px,3vw,40px); margin-top:18px; font-weight:500; }
@keyframes p19-flow { to { stroke-dashoffset:-120; } }
@keyframes p19-glint { 0%,100% { opacity:.16; } 50% { opacity:.7; } }
@media(max-width:1100px) { .p19-feature { gap:32px; grid-template-columns:.8fr 1.2fr; } .p19-choice { font-size:11px; padding-inline:7px; } }
@media(max-width:860px) { .p19-hero-in { grid-template-columns:1fr .8fr; min-height:390px; } .p19-feature { grid-template-columns:1fr; gap:30px; } .p19-copy h2 small { display:inline; margin-left:12px; } .p19-summary,.p19-definition { max-width:650px; } .p19-copy h3 { margin-top:24px; } .p19-model { max-width:700px; width:100%; margin:auto; } .p19-choices { grid-template-columns:repeat(3,minmax(0,1fr)); } .p19-choice { font-size:13px; } .p19-index { gap:0 18px; } .p19-index a { font-size:13px; gap:8px; } }
@media(max-width:600px) { .p19-hero-in { grid-template-columns:1fr; gap:0; padding-block:30px 15px; } .p19-hero h1 { font-size:37px; } .p19-hero .pg-lede { font-size:15px; } .p19-hero-art { max-width:360px; justify-self:center; margin-top:-12px; } .p19-index { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 18px; padding-block:18px; } .p19-index a { font-size:12px; min-height:66px; padding:16px 0; line-height:1.6; } .p19-index a i { display:none; } .p19-section { padding:44px 0 52px; } .p19-copy h2 { font-size:29px; margin-top:18px; } .p19-copy h2 small { font-size:26px; display:block; margin-left:0; } .p19-summary { font-size:15px; margin-top:18px; } .p19-copy h3 { font-size:14px; } .p19-definition { font-size:13px; } .p19-model { border-radius:18px; } .p19-model figcaption { padding:18px 16px 0; font-size:11px; } .p19-model figcaption span { display:none; } .p19-art { padding:8px 0; } .p19-choices { padding:0 13px; gap:6px; grid-template-columns:repeat(2,minmax(0,1fr)); } .p19-choice { font-size:12px; padding:11px 8px; min-height:46px; } .p19-explain { margin:16px 16px 18px; min-height:111px; } .p19-close { padding:50px 0 60px; } .p19-backdrop { opacity:.5; } }
@media(prefers-reduced-motion:reduce) { .p19-trace.is-current,.p19-glint { animation:none; } .p19-choice { transition:none; } }