.webapp-intro{background:var(--soft);padding:44px 0;border-bottom:1px solid var(--line)}
.webapp-intro-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:center}
.webapp-intro h1{font-size:45px;max-width:570px;line-height:1.15}
.webapp-intro .lead{font-size:19px;max-width:570px}
.webapp-intro .actions{gap:18px}
.webapp-intro .screen-gallery{margin:0;}
.webapp-page-nav{padding-block:18px;margin-top:0;border-bottom:1px solid var(--line)}
.webapp-module-picker{padding:0;border:0;margin:0;min-width:0}
.webapp-module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.webapp-module{display:flex;align-items:flex-start;gap:12px;padding:21px;background:#fff;border:1px solid #bdcad5;border-radius:7px;cursor:pointer;min-width:0}
.webapp-module:hover{border-color:var(--link)}
.webapp-module:has(input:checked){border-color:var(--accent);background:var(--brand-orange-soft,#fff0e9);box-shadow:inset 0 0 0 1px var(--accent)}
.webapp-module:has(input:focus-visible){outline:2px solid var(--link);outline-offset:-2px}
.webapp-module input{width:20px;height:20px;margin:4px 0 0;flex-shrink:0;accent-color:var(--accent)}
.webapp-module-title{display:flex;align-items:center;gap:9px;font-size:18px;line-height:1.4;font-weight:700;color:var(--ink);margin-bottom:10px}
.webapp-module-title svg{width:23px;height:23px;flex-shrink:0;color:var(--brand-blue,#051d40)}
.webapp-module-copy{display:block;font-size:15px;line-height:1.65}
.webapp-module-included{display:grid;gap:11px;margin:14px 0;padding-top:13px;border-top:1px solid var(--line)}
.webapp-module-included>span{display:block}
.webapp-module-included strong,.webapp-module-included>span>span{display:block;font-size:13px;line-height:1.6}
.webapp-module-included strong{color:var(--ink)}
.webapp-module-included>span>span{color:var(--muted)}
.webapp-selection{background:#f1f5f8;border:1px solid var(--line);border-radius:7px;margin-top:24px;padding:24px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center}
.webapp-selection h3{font-size:20px;margin-bottom:8px}
.webapp-selection p{margin-bottom:8px;font-size:15px}
.webapp-selection ul{display:flex;flex-wrap:wrap;gap:7px;list-style:none;padding:0;margin:14px 0}
.webapp-selection li{font-size:13px;background:#fff;border:1px solid #bdcad5;border-radius:4px;padding:3px 9px;margin:0}
.webapp-selection-actions{display:flex;align-items:center;gap:14px;flex-direction:column}
.webapp-selection-reset{border:0;padding:6px;background:transparent;color:var(--link);font-size:14px;text-decoration:underline;text-underline-offset:3px}
.webapp-price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:28px}
.webapp-price-grid article{border-top:3px solid #bdcad5;padding-top:18px}
.webapp-price-grid h3{font-size:20px}
.webapp-price-grid p{font-size:16px;margin-bottom:0}
.webapp-price-note{font-size:14px;color:var(--muted);margin:26px 0 0;max-width:850px}
.webapp-fit .section-heading{max-width:820px}
.webapp-fit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:28px}
.webapp-fit-grid article{min-width:0;padding:24px;border:1px solid var(--line);border-radius:8px;background:#fff}
.webapp-fit-icon{display:grid;place-items:center;width:42px;height:42px;margin-bottom:18px;border-radius:10px;background:var(--brand-blue-soft,#eaf0f8);color:var(--brand-blue,#051d40);font-size:27px;line-height:1}
.webapp-fit-grid h3{font-size:20px;margin-bottom:10px}
.webapp-fit-grid p{margin:0;font-size:16px}
.webapp-fit-soft{background:var(--soft);border-block:1px solid var(--line)}
.webapp-fit-options{display:grid;gap:12px;max-width:920px;margin-top:26px}
.webapp-fit-options details{min-width:0;padding:0 22px;border:1px solid #bdcad5;border-radius:8px;background:#fff}
.webapp-fit-options summary{padding:20px 0;font-size:19px;font-weight:700;color:var(--ink);cursor:pointer;overflow-wrap:anywhere}
.webapp-fit-options details>div{padding:0 0 22px}
.webapp-fit-options p{max-width:790px;margin:0 0 14px}
.webapp-fit-options p:last-child{margin-bottom:0}
.webapp-fit-link{margin:26px 0 0}
@media(max-width:760px){.webapp-fit-grid{grid-template-columns:1fr;gap:14px}.webapp-fit-grid article{padding:21px}.webapp-fit-options details{padding-inline:18px}.webapp-fit-options summary{font-size:18px}.webapp-fit-icon{margin-bottom:12px}}
.webapp-api-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;align-items:start;margin-top:26px}
.webapp-api-group{padding:0 21px;border:1px solid #c5d0da;border-radius:7px;background:#fff}
.webapp-api-group summary{font-size:18px;font-weight:700;color:var(--ink);cursor:pointer;padding:18px 0;line-height:1.5}
.webapp-api-group summary span{font-weight:400;font-size:12px;color:var(--muted);margin-left:9px;white-space:nowrap}
.webapp-api-group p{font-size:14px;margin:0 0 15px}
.webapp-api-group ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));list-style:none;gap:0 18px;padding:0;margin:0 0 16px}
.webapp-api-group li{margin:0;min-width:0}
.webapp-api-group a{display:inline-block;padding:8px 0;font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.webapp-dataflow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;list-style:none;padding:0;margin:28px 0 0}
.webapp-dataflow li{margin:0;padding:20px;border:1px solid var(--line);border-radius:6px;background:#fff}
.webapp-dataflow h3{font-size:19px}
.webapp-dataflow p{font-size:15px;margin:0}
.webapp-case-link{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:28px}
.webapp-case-link img{width:170px;max-height:50px;object-fit:contain}
.webapp-faq details{border-bottom:1px solid var(--line);padding:17px 0;max-width:850px}
.webapp-faq summary{cursor:pointer;font-weight:650;color:var(--ink)}
.webapp-faq details p{font-size:16px;margin:15px 0 0}
@media(max-width:1000px){.webapp-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.webapp-intro-grid{gap:28px}.webapp-intro h1{font-size:38px}.webapp-intro .lead{font-size:18px}}
@media(max-width:800px){.webapp-intro-grid{grid-template-columns:1fr}.webapp-intro .screen-gallery{max-width:720px}.webapp-price-grid,.webapp-dataflow{gap:20px}.webapp-selection{grid-template-columns:1fr;gap:15px}.webapp-selection-actions{align-items:flex-start;flex-direction:row;flex-wrap:wrap}}
@media(max-width:560px){.webapp-intro{padding:30px 0}.webapp-intro h1{font-size:33px}.webapp-intro .lead{font-size:17px}.webapp-intro .actions{gap:16px}.webapp-module-grid,.webapp-price-grid,.webapp-api-grid,.webapp-dataflow{grid-template-columns:1fr}.webapp-module{padding:18px}.webapp-module-title{font-size:18px}.webapp-selection{padding:20px}.webapp-price-grid{gap:24px}.webapp-api-group{padding-inline:17px}.webapp-api-group summary{font-size:17px}.webapp-page-nav{gap:10px 20px}.webapp-page-nav span{display:none}}

/* Essential inputs, useful additions and processing stay readable on every screen. */
.webapp-source{border-top:1px solid var(--line);padding:0 0 3px}
.webapp-source:last-child{border-bottom:1px solid var(--line)}
.webapp-source summary{cursor:pointer;padding:18px 0;font-weight:650;color:var(--ink)}
.webapp-source-title{display:inline-flex;align-items:center;gap:10px;vertical-align:middle}
.webapp-source-title svg{width:23px;height:23px;flex-shrink:0;color:var(--link)}
.webapp-source dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:0 0 24px;padding:0}
.webapp-source dt{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:9px}
.webapp-source dd{font-size:15px;line-height:1.7;margin:0}
@media(max-width:800px){.webapp-source dl{grid-template-columns:1fr;gap:19px}.webapp-source-title{font-size:16px}}

/* Module pricing and prerequisite-aware selection. */
.webapp-base{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;border:2px solid var(--brand-blue,#051d40);background:#fff;padding:24px;border-radius:7px;margin-bottom:18px}
.webapp-base h3{margin:0 0 8px}.webapp-base p:last-child{margin-bottom:0}.webapp-base-price{display:flex;flex-direction:column;gap:7px;justify-content:center}
.webapp-base-price strong{font-size:22px;color:var(--ink)}.webapp-required{font-size:13px;color:var(--brand-blue,#051d40);font-weight:700}
.webapp-module-help{font-size:15px;max-width:900px;margin-bottom:22px}
.webapp-module-price{display:flex;flex-direction:column;gap:3px;margin-top:16px;padding-top:12px;border-top:1px solid var(--line);color:var(--ink);font-size:15px}
.webapp-module-price strong{font-size:17px}.webapp-module-requires{display:block;margin-top:12px;font-size:13px;line-height:1.6;color:var(--muted)}
.webapp-module-auto{display:block;margin-top:10px;font-size:13px;line-height:1.5;color:var(--brand-blue,#051d40);font-weight:600}.webapp-module-auto[hidden]{display:none}
.webapp-module:has(input:disabled){cursor:default}.webapp-module input:disabled{opacity:1}
.webapp-selection h4{font-size:16px;margin:18px 0 10px}.webapp-selection ol{margin:10px 0 20px;padding-left:24px}.webapp-selection ol li{background:none;border:0;border-radius:0;padding:2px 0;font-size:15px}
.webapp-totals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0}.webapp-totals dt{font-size:14px}.webapp-totals dd{font-size:27px;font-weight:700;color:var(--ink);margin:3px 0 0}
@media(max-width:560px){.webapp-base{grid-template-columns:1fr;padding:20px;gap:16px}.webapp-totals{grid-template-columns:1fr;gap:12px}.webapp-totals dd{font-size:24px}}

/* Prices, selection and source explanation live in the same module card. */
.webapp-module-card{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid #bdcad5;border-radius:7px}
.webapp-module-card:has(input:checked){border-color:var(--accent);background:var(--brand-orange-soft,#fff0e9);box-shadow:inset 0 0 0 1px var(--accent)}
.webapp-module-card .webapp-module{border:0;border-radius:7px 7px 0 0;background:transparent;box-shadow:none}
.webapp-module-card .webapp-module:has(input:checked){background:transparent;box-shadow:none}
.webapp-module-card .webapp-module-details{border:0;border-top:1px solid var(--line);margin:0 21px;padding:0;margin-top:auto}
.webapp-module-card .webapp-module-details summary{padding:15px 0;font-size:14px;line-height:1.5}
.webapp-module-card .webapp-module-details dl{grid-template-columns:1fr;gap:16px;margin:0 0 21px}
.webapp-module-card .webapp-module-details dt{font-size:14px;margin-bottom:6px}
.webapp-module-card .webapp-module-details dd{font-size:14px;line-height:1.65}
@media(max-width:560px){.webapp-module-card .webapp-module-details{margin-inline:18px}}

.webapp-module-details h4{font-size:15px;margin:2px 0 8px}.webapp-module-details .webapp-example-note{font-size:13px;line-height:1.6;color:var(--muted)}
.webapp-module-details .screen-gallery{margin:14px 0}.webapp-module-details>p{font-size:14px;margin-bottom:20px}.webapp-module-details[open]{padding-bottom:3px}
.webapp-discount dd{color:#246649}.webapp-expansion-note{margin:24px 0;padding:22px;background:#f1f5f8;border:1px solid var(--line);border-radius:7px}.webapp-expansion-note h3{font-size:20px;margin-bottom:10px}.webapp-expansion-note p,.webapp-expansion-note li{font-size:15px;line-height:1.65}.webapp-expansion-note p:last-child{margin-bottom:0}
.webapp-demo-links{margin:20px 0}.webapp-demo-frame{display:block;width:100%;height:calc(100svh - 180px);min-height:480px;max-height:900px;scroll-margin-top:140px;border:1px solid #bdcad5;border-radius:8px;background:#f3f6f8}
@media(max-width:560px){.webapp-demo-frame{height:calc(100svh - 160px);min-height:460px;scroll-margin-top:130px}.webapp-expansion-note{padding:18px}}

.webapp-standard-monthly{font-size:13px;color:var(--muted)}
.webapp-standard-monthly s{text-decoration-thickness:1px}
.webapp-module-price .webapp-current-monthly{font-size:17px;color:var(--brand-blue,#051d40)}
.webapp-module-price.webapp-module-monthly{margin-top:14px;padding-top:0;border-top:0}
.webapp-module-card .webapp-module{flex:1;align-items:stretch}
.webapp-module-card .webapp-module>input{align-self:flex-start}
.webapp-module-card .webapp-module>span{display:flex;flex-direction:column;min-width:0}
.webapp-module-card .webapp-module-monthly{margin-top:auto;padding-top:16px;min-height:48px;display:flex;align-items:baseline}
@media(min-width:561px){.webapp-module-card .webapp-module-title{min-height:2.8em;align-items:flex-start}}
.webapp-module-monthly strong{font-size:18px;color:var(--ink)}
.webapp-monthly-compare{display:flex;align-items:baseline;flex-wrap:nowrap;gap:4px 8px;line-height:1.4}
.webapp-monthly-was{font-size:13px;color:var(--muted);white-space:nowrap}
.webapp-monthly-compare strong{white-space:nowrap}
.webapp-monthly-current{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:0 5px;min-width:0}
.webapp-module-price .webapp-price-comparison-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px}
.webapp-monthly-unit{font-size:13px;color:var(--muted);white-space:nowrap}
.webapp-module-pricing-details{padding:0 0 17px}
.webapp-module-pricing-details>.webapp-module-price{margin-top:0;padding-top:0;border-top:0}
.webapp-module-card .webapp-module-pricing-details .webapp-module-choose{margin:15px 0 0}
.webapp-monthly-saving{font-size:13px;font-weight:650;color:#246649}

.webapp-module-card .webapp-module-choose{display:block;margin:0 21px 18px;font-size:14px;font-weight:650}
.webapp-module[data-module-overview]{cursor:default}

/* The product introduction and its readable demo follow one vertical flow. */
.webapp-intro .webapp-intro-grid{grid-template-columns:minmax(0,1fr);gap:30px;align-items:start}
.webapp-intro-copy{width:100%;max-width:none}
.webapp-intro h1{max-width:960px;font-size:clamp(34px,4vw,50px);line-height:1.15}
.webapp-intro .lead{max-width:860px}
.webapp-intro-demo{display:grid;gap:22px;min-width:0;width:100%}
.webapp-intro .webapp-demo-teaser{max-width:none;width:100%;justify-self:stretch}
.webapp-intro .webapp-demo-teaser-scroll{height:clamp(460px,62svh,700px)}
.webapp-intro .webapp-demo-teaser-heading{padding:20px 24px}
.webapp-intro .webapp-demo-teaser-footer{grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;align-items:center;padding:18px 24px}
.webapp-intro .webapp-demo-teaser-footer p{grid-column:1}
.webapp-intro .webapp-demo-teaser-footer small{grid-column:1;text-align:left}
.webapp-intro .webapp-demo-teaser-footer .button{grid-column:2;grid-row:1/span 2;width:auto}
.webapp-intro-demo>.actions{margin:0}
@media(max-width:760px){
 .webapp-intro .webapp-intro-grid{gap:25px}
 .webapp-intro .webapp-demo-teaser-heading{padding:16px}
 .webapp-intro .webapp-demo-teaser-footer{grid-template-columns:1fr;padding:16px;gap:12px}
 .webapp-intro .webapp-demo-teaser-footer .button{grid-column:1;grid-row:auto;width:100%}
 .webapp-intro-demo>.actions{flex-direction:column;align-items:flex-start}
}
@media(max-width:760px) and (orientation:portrait){
 .webapp-intro .webapp-demo-teaser,.webapp-intro-demo>.actions{max-width:360px;justify-self:center;width:100%}
 .webapp-intro .webapp-demo-teaser-scroll{height:560px}
 .webapp-intro-demo>.actions>.button{width:100%}
}
@media(orientation:landscape) and (max-height:600px){.webapp-intro .webapp-demo-teaser-scroll{height:clamp(240px,65svh,420px)}}
@media(max-width:560px){.webapp-intro{padding-block:30px}}