/* Compact product canvases. Desktop fits one screen; narrow screens flow naturally. */
body.product-page { background:#f3f7fd; color:#65758e; margin:0; min-height:100dvh; display:flex; flex-direction:column; }
.product-page .container { max-width:1800px; width:100%; padding:0 4.88vw; margin:auto; }
.product-main { flex:1; display:flex; flex-direction:column; padding-top:48px; }
.product-hero { background:radial-gradient(ellipse at 90% 90%,#104f99 0%,transparent 65%),linear-gradient(110deg,#07142c,#08244b); color:#fff; padding:24px 0; }
.product-hero-layout { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:6vw; }
.product-back { font-size:11px; color:#93b8ec; display:block; margin-bottom:16px; }
.product-page .product-hero .eyebrow { color:#9fcaff; font-size:10px; letter-spacing:2px; margin:0 0 10px; }
.product-hero h1 { color:white; font-size:clamp(32px,3.3vw,52px); line-height:1.06; letter-spacing:-1.7px; margin:0 0 14px; max-width:620px; }
.product-description { color:#becfe6; font-size:14px; line-height:1.6; max-width:610px; margin:0 0 20px; }
.product-actions { display:flex; align-items:center; gap:22px; }
.product-page .product-actions .btn { font-size:12px; padding:11px 18px; }
.product-contact { font-size:12px; color:#d4e7ff; }
.preview-label { display:block; font-size:10px; color:#8aa7cd; margin-top:14px; }
.product-art { width:100%; height:auto; max-height:255px; display:block; }
.product-capabilities { padding:24px 0 14px; flex:1; }
.capability-heading { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:14px; }
.capability-heading h2 { font-size:22px; letter-spacing:-.6px; margin:0; color:#132443; }
.capability-heading>span { font-size:11px; color:#8292ac; }
.product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.product-card { position:relative; background:#fff; border:1px solid #e6edf8; border-radius:12px; padding:18px; display:flex; align-items:flex-start; gap:14px; min-width:0; transition:border-color .2s,box-shadow .2s; }
.product-card:hover { border-color:#aecaff; box-shadow:0 6px 20px #2047790a; }
.product-icon { display:grid; place-items:center; width:38px; height:38px; flex:0 0 38px; border-radius:11px; background:#eaf2ff; color:#1565ee; font-size:20px; font-weight:600; }
.product-card:nth-child(3n+2) .product-icon { background:#e7faf3; color:#09a578; }
.product-card:nth-child(3n) .product-icon { background:#f2eaff; color:#8954d4; }
.product-card h2 { font-size:14px; line-height:1.3; letter-spacing:-.2px; margin:0 0 7px; }
.product-card p { font-size:12px; line-height:1.6; margin:0; color:#6c7b93; }
.product-card:has(.tile-link) { padding-bottom:36px; }
.tile-link { position:absolute; left:70px; bottom:14px; font-size:10px; color:#155bff; }
.seven-cards { grid-template-columns:repeat(4,minmax(0,1fr)); }
.seven-cards .product-card:last-child { grid-column:span 2; }
.sdk-product .product-icon { font-size:12px; }
.sdk-product .download-link { position:absolute; right:18px; bottom:14px; font-size:10px; color:#7d8ca5; }
.product-switcher { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; padding-top:14px!important; padding-bottom:18px!important; }
.product-switcher a { font-size:10px; color:#7d8ca4; padding:5px 9px; border-radius:5px; }
.product-switcher a[aria-current] { color:#155bff; background:#e6efff; }
.product-footer { background:#09162c; padding:11px 0; }
.product-footer .container { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.product-footer span,.product-footer a { color:#73819a; font-size:10px; }
.product-footer .container>div { display:flex; gap:24px; }
.skip-link { position:fixed; top:-80px; left:20px; padding:10px; z-index:2000; background:white; color:#155bff; }
.skip-link:focus { top:8px; }
@media(min-width:1100px) and (min-height:800px) { .product-hero { padding:32px 0; } .product-capabilities { padding-top:30px; } .product-card { padding:22px; } .product-card p { font-size:13px; } .product-card:has(.tile-link) { padding-bottom:40px; } .tile-link { left:74px; } }
@media(min-width:901px) and (max-height:720px) { .product-hero { padding:14px 0; } .product-back { margin-bottom:10px; } .product-art { max-height:195px; } .product-hero h1 { font-size:32px; } .product-description { font-size:12px; margin-bottom:12px; } .product-capabilities { padding:16px 0 8px; } .product-card { padding:12px; gap:10px; } .product-card p { font-size:11px; } .product-card h2 { font-size:13px; } .capability-heading h2 { font-size:19px; } .product-switcher { padding:8px 4.88vw!important; } }
@media(max-width:1100px) { .product-grid.seven-cards { grid-template-columns:repeat(3,minmax(0,1fr)); } .seven-cards .product-card:last-child { grid-column:auto; } .sdk-product { flex-wrap:wrap; } .sdk-product .tile-link { left:18px; } }
@media(max-width:900px) { .product-main { padding-top:64px; } .product-hero { padding:26px 0; } .product-hero-layout { grid-template-columns:1fr; gap:22px; } .product-hero h1 { font-size:40px; } .product-art { max-height:250px; } .product-grid,.product-grid.seven-cards { grid-template-columns:repeat(2,minmax(0,1fr)); } .capability-heading { align-items:flex-start; flex-direction:column; gap:6px; } .product-page .product-card { padding:16px; } .product-card:has(.tile-link) { padding-bottom:40px; } .tile-link { left:68px; } .product-page .sdk-product .tile-link { left:16px; } }
@media(max-width:560px) { .product-grid,.product-grid.seven-cards { grid-template-columns:1fr; } .product-page .container { padding-left:24px; padding-right:24px; } .product-hero h1 { font-size:34px; } .product-description { font-size:13px; } .product-art { max-height:200px; } .product-footer .container { flex-direction:column; gap:8px; } .product-contact { font-size:11px; } .product-actions { gap:14px; } }
@media(min-width:901px) and (max-width:1100px) { .product-grid.seven-cards { grid-template-columns:repeat(4,minmax(0,1fr)); } .seven-cards .product-card:last-child { grid-column:span 2; } }
.product-page.has-cookie-banner { padding-bottom:78px; }
.product-page .cookie-banner { max-width:none; }
.product-hero h1 { font-size:clamp(30px,2.8vw,42px); letter-spacing:-1.3px; max-width:none; }
@media(min-width:901px) { .product-hero { padding:22px 0; } .product-hero .product-back { margin-bottom:12px; } .product-card { padding:18px; } .product-card:has(.tile-link) { padding-bottom:36px; } .product-card p { font-size:12px; line-height:1.6; } }