/* One presentation layer for both PMS and dynamic-pricing pages. */
body .directory-layout-content>main.design-preview {--design-gap:20px}
body .directory-layout-content>main.design-preview .hero.compact{padding:28px 0 20px}
body .directory-layout-content>main.design-preview .hero.compact .eyebrow{display:none}
body .directory-layout-content>main.design-preview .hero.compact h1{font-size:40px;line-height:1.12;letter-spacing:-.04em;margin:0 0 12px}
body .directory-layout-content>main.design-preview .hero.compact .intro{font-size:16px;line-height:1.55;margin:0;max-width:780px}
body .directory-layout-content>main.design-preview .portfolio-bar{margin:0 0 20px;padding:12px 16px;gap:12px}
body .directory-layout-content>main.design-preview .portfolio-bar>p:not(.portfolio-range-note){display:none}
body .directory-layout-content>main.design-listing .directory-bar{padding-top:16px}
body .directory-layout-content>main.design-listing .directory-bar h2{font-size:18px}
body .directory-layout-content>main.design-listing #selection-rule{font-size:14px;margin:10px 0}
body .directory-layout-content>main.design-listing .product-grid{margin:16px 0 40px;gap:16px;align-items:stretch}
body .directory-layout-content>main.design-listing .product-card{padding:20px 20px 0;transition:none}
body .directory-layout-content>main.design-listing .product-identity{margin-bottom:14px;gap:14px;min-height:52px}
body .directory-layout-content>main.design-listing .product-identity .product-logo{width:76px;height:48px;flex:0 0 76px;object-fit:contain;padding:4px}
body .directory-layout-content>main.design-listing .product-identity h3{font-size:19px;line-height:1.25;margin:0}
body .directory-layout-content>main.design-listing .product-identity .muted{display:none}
body .directory-layout-content>main.design-listing .product-card>p{font-size:16px;line-height:1.55;min-height:0;margin:0 0 8px}
body .directory-layout-content>main.design-listing .product-card details{margin:0 0 8px;flex:0}
body .directory-layout-content>main.design-listing .product-card summary{padding:10px 0;font-size:14px}
body .directory-layout-content>main.design-listing .portfolio-card-price{margin:8px 0 16px;padding-top:12px;gap:6px}
body .directory-layout-content>main.design-listing .portfolio-card-price strong{font-size:21px;line-height:1.3;letter-spacing:-.02em}
body .directory-layout-content>main.design-listing .portfolio-card-price small{font-size:14px;line-height:1.5}
body .directory-layout-content>main.design-listing .explore-product{margin-top:auto}
body .directory-layout-content>main.design-listing .compare-label{margin:14px -20px 0;padding:14px 20px;min-height:52px}
body .directory-layout-content>main.design-listing .product-card.is-selected{border-color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}
body .directory-layout-content>main.design-listing .product-card.is-selected .compare-label{background:#f0f5ff;color:#003f9e}
body .directory-layout-content>main.design-preview .profile-hero{padding:28px 0 24px}
body .directory-layout-content>main.design-preview .profile-hero h1{font-size:40px;line-height:1.12;letter-spacing:-.04em}
body .directory-layout-content>main.design-preview .profile-identity .product-logo{width:64px;height:64px;flex-basis:64px;padding:6px}
body .directory-layout-content>main.design-preview .profile-category{font-size:14px}
body .directory-layout-content>main.design-preview .profile-category-links a{min-height:44px}
body .directory-layout-content>main.design-preview .profile-dek{font-size:16px;line-height:1.6;margin-top:16px}
body .directory-layout-content>main.design-preview .product-profile{gap:20px}
body .directory-layout-content>main.design-preview .profile-section-nav{gap:0 4px;padding:4px 0}
body .directory-layout-content>main.design-preview .profile-section-nav a{font-size:14px;padding:8px;min-height:44px}
body .directory-layout-content>main.design-preview .profile-columns{grid-template-areas:'main rail';gap:28px}
body .directory-layout-content>main.design-preview .profile-main{grid-area:main;gap:28px}
body .directory-layout-content>main.design-preview .profile-pricing-rail{grid-area:rail;padding:20px;gap:20px}
body .directory-layout-content>main.design-preview .profile-pricing-rail .price-item>strong{display:block;font-size:25px;line-height:1.25}
body .directory-layout-content>main.design-preview .profile-pricing-rail .price-item p{font-size:14px;line-height:1.55}
body .directory-layout-content>main.design-preview .design-plan-details{padding-top:24px;border-top:1px solid var(--line)}
body .directory-layout-content>main.design-preview .design-plan-details .content-card{margin:12px 0;padding:20px;border:1px solid var(--line);border-radius:8px}
body .directory-layout-content>main.design-preview .design-plan-details .content-card h3{margin:0 0 10px}
body .directory-layout-content>main.design-preview .profile-heading-row{gap:16px}
body .directory-layout-content>main.design-preview .profile-website-action{min-height:44px;padding:12px 18px}
@media(max-width:1000px){
 body .directory-layout-content>main.design-preview .profile-columns{grid-template-columns:minmax(0,1fr);grid-template-areas:'rail' 'main'}
 body .directory-layout-content>main.design-preview .profile-pricing-rail{padding:20px}
}
@media(max-width:600px){
 body .directory-layout-content>main.design-preview .hero.compact{padding:22px 0 16px}
 body .directory-layout-content>main.design-preview .hero.compact h1,body .directory-layout-content>main.design-preview .profile-hero h1{font-size:30px}
 body .directory-layout-content>main.design-preview .site-breadcrumbs{padding-top:18px}
 body .directory-layout-content>main.design-preview .portfolio-bar{padding:12px;gap:8px;margin:0 0 16px}
 body .directory-layout-content>main.design-preview .portfolio-bar>div{display:flex;justify-content:space-between;width:100%;gap:8px}
 body .directory-layout-content>main.design-preview .portfolio-bar label{font-size:14px}
 body .directory-layout-content>main.design-preview .portfolio-bar select{min-height:44px;font-size:16px;max-width:64%}
 body .directory-layout-content>main.design-listing .directory-bar h2{margin-bottom:0;font-size:17px}
 body .directory-layout-content>main.design-listing .directory-bar>.muted{display:none}
 body .directory-layout-content>main.design-listing .product-grid{margin-top:12px}
 body .directory-layout-content>main.design-listing .product-card{padding:18px 18px 0}
 body .directory-layout-content>main.design-listing .compare-label{margin-inline:-18px;padding-inline:18px}
 body .directory-layout-content>main.design-preview .profile-hero{padding:24px 0 18px}
 body .directory-layout-content>main.design-preview .profile-dek{margin-top:12px}
 body .directory-layout-content>main.design-preview .profile-identity{gap:12px}
 body .directory-layout-content>main.design-preview .profile-identity .product-logo{width:56px;height:56px;flex-basis:56px}
 body .directory-layout-content>main.design-preview .profile-website-action{width:auto}
 body .directory-layout-content>main.design-preview .product-profile h2{font-size:24px}
 body .directory-layout-content>main.design-preview .profile-main table.comparison-products-1{display:block;min-width:0;table-layout:auto}
 body .directory-layout-content>main.design-preview .profile-main table.comparison-products-1 thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 body .directory-layout-content>main.design-preview .profile-main table.comparison-products-1 tbody{display:block}
 body .directory-layout-content>main.design-preview .profile-main table.comparison-products-1 tr{display:block;border-bottom:1px solid var(--line);padding:14px 16px}
 body .directory-layout-content>main.design-preview .profile-main table.comparison-products-1 th,body .directory-layout-content>main.design-preview .profile-main table.comparison-products-1 td{display:block;width:auto;position:static;padding:4px 0;border:0;box-shadow:none;font-size:16px}
 body .directory-layout-content>main.design-preview .profile-main .table-scroll{overflow:visible}
 body .directory-layout-content>main.design-preview .profile-main .scroll-hint{display:none}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 html[data-input-mode=pointer] body .directory-layout-content>main.design-preview .button{transition:transform 120ms cubic-bezier(.23,1,.32,1)}
 html[data-input-mode=pointer] body .directory-layout-content>main.design-preview .button:active{transform:scale(.98)}
}
@media(prefers-reduced-motion:reduce){body .directory-layout-content>main.design-preview .button{transition:none!important;transform:none!important}}

body .directory-layout-content>main.design-preview>.hero.compact{padding:0;margin-bottom:20px}
body .directory-layout-content>main.design-preview>.hero.compact>h1{margin-bottom:12px}
body .directory-layout-content>main.design-preview>.portfolio-bar{margin-bottom:20px}
body .directory-layout-content>main.design-preview>.site-breadcrumbs{padding:0;margin-bottom:16px}
body .directory-layout-content>main.design-preview .profile-hero{padding-bottom:24px}
@media(max-width:600px){
 body .directory-layout-content>main.design-preview>.hero.compact{margin-bottom:16px}
 body .directory-layout-content>main.design-preview>.site-breadcrumbs{margin-bottom:12px}
 body .directory-layout-content>main.design-preview>.portfolio-bar{margin-bottom:16px}
}
