/* Shared responsive safeguards; loaded after each page's presentation styles. */
main,main section,main article,main [class*="grid"]>*,main .wrap,main .pf-wrap{min-width:0;box-sizing:border-box}
main img,main video,main iframe{max-width:100%}
main video{height:auto}
main dialog,dialog.pf-demo-dialog,dialog.employer-case-dialog{box-sizing:border-box;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}
main h1,main h2,main h3,main p,main li,main a{overflow-wrap:break-word}
.pf-responsive-table{width:100%;max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.pf-responsive-table:focus-visible{outline:3px solid #8760df;outline-offset:3px}
@media(max-width:900px){
 main .hero-grid,main .ent-hero-grid,main .story-head,main .sbody,main .ai-intro{grid-template-columns:minmax(0,1fr)}
 main .explorer,main .imported-modules .explorer{grid-template-columns:minmax(0,1fr)}
 main .spanels,main .spanel,main .scopy,main .dpanel{min-width:0;max-width:100%}
}
@media(max-width:600px){
 main .wrap{width:calc(100% - 32px);max-width:100%;margin-inline:auto}
 main .actions,main .acts,main .hero-ctas,main .pf-ready-actions,main .case-cta .acts{flex-wrap:wrap}
 main .actions>a,main .acts>a,main .hero-ctas>a{max-width:100%;white-space:normal}
 main .mod-tabbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 main .mod-tabbar button{min-width:0;white-space:normal;font-size:14px;min-height:48px}
 main .usecases,main .pgrid,main .dgrid,main .why-grid,main .role-grid,main .feat-grid,main .fit-grid,main .fit3{grid-template-columns:minmax(0,1fr)}
 main .imported-modules .spanel{grid-template-columns:minmax(0,1fr);padding:16px}
 main .ent-board,main .reply-zone,main .conversation-stage{min-width:0;max-width:100%}
 main .ent-row{overflow-wrap:anywhere}
 .pf-home .pf-modules{grid-template-columns:minmax(0,1fr);gap:28px}
 .pf-home .pf-module:nth-child(n){padding:0;border-left:0}
 .pf-home .pf-module>p{min-height:0}
 .pf-home .pf-compare-layout,.pf-home .pf-compare-box,.pf-home .pf-compare-panel{min-width:0;max-width:100%}
 .pf-home #pf-panel-legacy,.pf-home #pf-panel-chatgpt{padding:20px 14px}
 .pf-home #what-makes-us-different .pf-table-hint{display:none}
 .pf-home #what-makes-us-different .pf-table-scroll{overflow:visible;border:0;background:none}
 .pf-home #what-makes-us-different .pf-feature-table{display:block;min-width:0;width:100%;table-layout:auto;font-size:14px}
 .pf-home #what-makes-us-different .pf-feature-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .pf-home #what-makes-us-different .pf-feature-table tbody{display:block;width:100%}
 .pf-home #what-makes-us-different .pf-feature-table tr{display:block;margin:0 0 16px;border:1px solid #ded3ee;border-radius:10px;overflow:hidden}
 .pf-home #what-makes-us-different .pf-feature-table th,.pf-home #what-makes-us-different .pf-feature-table td{display:block;width:100%;box-sizing:border-box;padding:14px;text-align:left;white-space:normal;overflow-wrap:anywhere}
 .pf-home #what-makes-us-different .pf-feature-table tbody th{background:#ece5f7}
 .pf-home #what-makes-us-different .pf-feature-table td::before{content:attr(data-column);display:block;font-size:14px;font-weight:750;color:#4d2f83;margin-bottom:8px}
 .pf-home #what-makes-us-different .pf-feature-table b,.pf-home #what-makes-us-different .pf-feature-table small{font-size:14px;line-height:1.5}
 .pf-home #what-makes-us-different .pf-comparison-note{font-size:12px;line-height:1.5}
}

/* Module headings without artwork must not retain the desktop art column. */
main .mod-sec .mod-head.no-art,
main .imported-modules .mod-sec .mod-head.no-art{
 grid-template-columns:minmax(0,1fr);grid-template-areas:"h" "p";gap:14px;min-width:0
}
main .mod-head.no-art>*{min-width:0;max-width:100%}
main .mod-head.no-art .lede{width:auto;margin:0}
@media(max-width:1000px){
 main .mod-sec .mod-head,main .imported-modules .mod-sec .mod-head{grid-template-columns:minmax(0,1fr);grid-template-areas:"h" "p" "a";gap:18px}
 main .mod-sec .mod-head.no-art,main .imported-modules .mod-sec .mod-head.no-art{grid-template-areas:"h" "p"}
 main .explorer,main .explorer>*{min-width:0;max-width:100%}
 main .explorer .spanel{grid-template-columns:minmax(0,1fr);padding:20px;gap:20px}
 main .explorer .spanel>*{min-width:0;max-width:100%}
 main .pts li>div{min-width:0}
 main .dpanel .apanel,main .dpanel .art{width:100%;max-width:100%;height:auto}
}
@media(max-width:600px){
 main .module-nodes{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 main .module-nodes b{font-size:15px;line-height:1.4}
 main .module-nodes small{font-size:12px;line-height:1.4}
 main .mod-tabbar .mtab .ml b{font-size:14px;line-height:1.4}
 main .mod-head.no-art .lede{font-size:16px;line-height:1.65}
 main .explorer .spanel{padding:16px}
 main .explorer .stabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}
 main .explorer .stab{min-width:0;width:100%;white-space:normal;padding:12px;min-height:48px}
 main .explorer .stab b{font-size:14px;line-height:1.4}
 main .metrics{grid-template-columns:minmax(0,1fr)}
 main .foundation .metrics>div{border-left:0;border-bottom:1px solid #ffffff30}
 main .pf-ready-card dl>div{gap:12px;flex-wrap:wrap}
}
/* Keep the overview destination explicit and visible above the module links. */
.pf-site-header .mega-dropdown>a.platform-overview-link{
 display:block;grid-column:1/-1;order:-1;margin:0;padding:12px 14px;
 color:#5731a2;background:#f2ebfc;border:1px solid #ded2ed;border-radius:8px;
 font-size:16px;font-weight:700;line-height:1.5;white-space:normal
}
@media(max-width:600px){
 .pf-site-header .mega-dropdown{grid-template-columns:minmax(0,1fr);gap:16px}
 .pf-site-header .menu-column h3{min-height:0;flex-direction:row;align-items:center}
 .pf-site-header .menu-column a{font-size:14px;line-height:1.5;padding-block:10px}
 .pf-site-header .pf-nav-inner{gap:8px}
 .pf-site-header .brand{flex-basis:140px;width:140px}
 .pf-site-header .brand img{width:140px}
}

/* Keep pricing overflow in the table scroller, never the page viewport. */
@media(max-width:900px){
 html:has(.matrix-wrap){overflow-x:clip}
 .matrix-wrap{max-width:100%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
}
