/* Reusable native adoption of the established plywood module structures.
   Typography, palette, buttons and major heading bands inherit shared components. */
#de-main .jsdc-product .jsd-project-gallery__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:dense;grid-auto-rows:clamp(230px,16vw,300px);gap:10px}
#de-main .jsdc-product .jsd-project-card{min-width:0;min-height:0;margin:0;overflow:hidden;border:1px solid var(--jsdc-line);border-radius:var(--jsdc-radius);background:var(--jsdc-ink)}
#de-main .jsdc-product :is(.jsd-project-card--feature,.jsd-project-card--closing-feature){grid-column:span 2;grid-row:span 2}
#de-main .jsdc-product .jsd-project-card>a,#de-main .jsdc-product .jsd-project-card figure{display:block;width:100%;height:100%;margin:0}
#de-main .jsdc-product .jsd-project-card figure{position:relative;overflow:hidden}
#de-main .jsdc-product .jsd-project-card img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--jsdc-motion) ease}
#de-main .jsdc-product .jsd-project-card figcaption{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;padding:8px 18px;background:rgba(10,20,14,.46);color:var(--jsdc-white)}
#de-main .jsdc-product .jsd-project-card h3{margin:4px 0;color:inherit;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
#de-main .jsdc-product .jsd-project-card__meta{display:flex;justify-content:space-between;gap:8px;font-size:12px;line-height:1.35}
#de-main .jsdc-product .jsd-project-card__material{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#de-main .jsdc-product .jsd-project-card__action{font-size:13px;text-decoration:underline;text-underline-offset:4px}
#de-main .jsdc-product .jsd-project-card>a:hover img{transform:scale(1.035)}
#de-main .jsdc-product .jsd-project-gallery__actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:24px}
#de-main .jsdc-product .jsd-difference__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
#de-main .jsdc-product .jsd-difference-card{display:grid;grid-template-columns:160px minmax(0,1fr);background:var(--jsdc-white);border:1px solid var(--jsdc-line);min-width:0}
#de-main .jsdc-product .jsd-difference-card__media{grid-row:span 2;margin:0;min-width:0;overflow:hidden}
#de-main .jsdc-product .jsd-difference-card__media a{display:block;height:100%}
#de-main .jsdc-product .jsd-difference-card__media img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--jsd-image-position,center)}
#de-main .jsdc-product .jsd-difference-card__intro{padding:24px 24px 0}
#de-main .jsdc-product .jsd-difference-card__intro h3{margin:0 0 12px}
#de-main .jsdc-product .jsd-difference-card__details{padding:0 24px 24px;min-width:0}
#de-main .jsdc-product .jsd-difference-card__details p:last-child{margin-bottom:0}
#de-main .jsdc-product .jsd-founder__inner{display:grid;grid-template-columns:230px minmax(0,850px);gap:40px;max-width:1120px;margin:auto}
#de-main .jsdc-product .jsd-founder__portrait{margin:0;align-self:start}
#de-main .jsdc-product .jsd-founder__portrait img{display:block;width:100%;height:auto}
#de-main .jsdc-product .jsd-founder__portrait figcaption{padding:12px 16px;background:var(--jsdc-white);border:1px solid var(--jsdc-line)}
#de-main .jsdc-product .jsd-founder__portrait strong{display:block}
#de-main .jsdc-product .jsd-founder__copy{max-width:75ch}
#de-main .jsdc-product .jsd-founder__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
#de-main .jsdc-product .jsd-budget-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
#de-main .jsdc-product .jsd-budget-card{padding:28px;background:var(--jsdc-white);border:1px solid var(--jsdc-line);min-width:0}
#de-main .jsdc-product .jsd-budget-card--featured{border-top:3px solid var(--jsdc-green)}
#de-main .jsdc-product .jsd-budget-card__price{color:var(--jsdc-green);font-weight:600}
@media(min-width:2200px){#de-main .jsdc-product .jsdc-landing__wrap{max-width:2040px}}
@media(max-width:1199px){#de-main .jsdc-product .jsd-project-gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:270px}#de-main .jsdc-product :is(.jsd-project-card--feature,.jsd-project-card--closing-feature){grid-column:1/-1;grid-row:auto}#de-main .jsdc-product .jsd-difference-card{grid-template-columns:110px minmax(0,1fr)}#de-main .jsdc-product .jsd-budget-grid{grid-template-columns:1fr}}
@media(max-width:767px){#de-main .jsdc-product .jsd-project-gallery__grid{grid-auto-rows:190px;gap:8px}#de-main .jsdc-product :is(.jsd-project-card--feature,.jsd-project-card--closing-feature){min-height:275px}#de-main .jsdc-product .jsd-project-card figcaption{padding:9px 10px}#de-main .jsdc-product .jsd-project-card h3{font-size:15px;line-height:1.2}#de-main .jsdc-product :is(.jsd-project-card--feature,.jsd-project-card--closing-feature) h3{font-size:22px}#de-main .jsdc-product .jsd-project-card__meta{font-size:10px}#de-main .jsdc-product .jsd-project-card:not(:is(.jsd-project-card--feature,.jsd-project-card--closing-feature)) .jsd-project-card__location{display:none}#de-main .jsdc-product .jsd-project-card__action{display:none}#de-main .jsdc-product .jsd-project-gallery__actions{display:grid;grid-template-columns:1fr}#de-main .jsdc-product .jsd-project-gallery__actions a{width:100%}#de-main .jsdc-product .jsd-founder__inner{grid-template-columns:1fr}#de-main .jsdc-product .jsd-founder__portrait{width:185px;justify-self:center}#de-main .jsdc-product .jsd-founder__actions{display:grid}#de-main .jsdc-product .jsd-founder__actions a{width:100%}}
@media(max-width:374px){#de-main .jsdc-product .jsd-difference-card{grid-template-columns:85px minmax(0,1fr)}#de-main .jsdc-product .jsd-difference-card__intro{padding:16px 16px 0}#de-main .jsdc-product .jsd-difference-card__details{padding:0 16px 16px}#de-main .jsdc-product .jsd-project-card h3{font-size:14px}}
@media(prefers-reduced-motion:reduce){#de-main .jsdc-product .jsd-project-card img{transition:none}}

/* Acceptance repairs: featured cards own their row height; mobile copy keeps a full reading width. */
#de-main .jsdc-product .jsd-difference-card{grid-template-rows:min-content 1fr;align-content:start}
@media(max-width:1199px){#de-main .jsdc-product .jsd-project-gallery__grid{grid-auto-rows:auto}#de-main .jsdc-product .jsd-project-card{height:270px}#de-main .jsdc-product :is(.jsd-project-card--feature,.jsd-project-card--closing-feature){height:390px}}
@media(max-width:767px){#de-main .jsdc-product .jsd-project-card{height:190px}#de-main .jsdc-product :is(.jsd-project-card--feature,.jsd-project-card--closing-feature){height:275px}#de-main .jsdc-product .jsd-difference-card{grid-template-columns:1fr;grid-template-rows:auto}#de-main .jsdc-product .jsd-difference-card__media{grid-row:auto;height:200px}#de-main .jsdc-product .jsd-difference-card__media img{object-position:center 45%}}
#de-main .jsdc-product .jsdc-product__video{margin:0;min-width:0;align-self:center}
#de-main .jsdc-product .jsdc-product__video .wpb_video_widget{margin:0}

/* Match the canonical closing mosaic: one large right-hand tile, two small tiles to its left. */
@media(min-width:1200px){#de-main .jsdc-product .jsd-project-card--closing-feature{grid-column:2 / span 2;grid-row:span 2}}

/* Compact icon cards and embedded trust band; approved native P3 adoption. */
body.jsd-components-enabled #de-main .jsdc-product .jsdc-credentials{border-block:0;background:transparent;padding:0}
#de-main .jsdc-product .jsdc-module-icon{display:block;width:36px;height:36px;color:var(--jsdc-bronze);margin-bottom:16px}
#de-main .jsdc-product .jsdc-module-icon svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
#de-main .jsdc-product .jsd-difference__grid--icons{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
#de-main .jsdc-product .jsd-difference__grid--icons .jsd-difference-card{display:block;padding:24px}
#de-main .jsdc-product .jsd-difference__grid--icons :is(.jsd-difference-card__intro,.jsd-difference-card__details){padding:0}
#de-main .jsdc-product .jsd-difference__grid--icons .jsd-difference-card__intro h3{margin-bottom:12px}
@media(max-width:1199px){#de-main .jsdc-product .jsd-difference__grid--icons{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){#de-main .jsdc-product .jsd-difference__grid--icons{grid-template-columns:1fr;gap:16px}#de-main .jsdc-product .jsd-difference__grid--icons .jsd-difference-card{padding:20px}}



/* Exact current plywood route-card surface and spacing. */

/* Native WordPress wpautop must not become a third grid item. */

body.jsd-components-enabled #de-main .jsdc-product .jsdc-module-icon{width:36px;height:36px;background:var(--jsdc-bronze);mask:var(--jsdc-icon-src) center/contain no-repeat}
body.jsd-components-enabled #de-main .jsdc-product .jsdc-module-icon img{display:block;width:36px;height:36px;filter:none}

body.jsd-components-enabled #de-main .jsdc-product .jsdc-module-icon img{opacity:0}

@media(max-width:800px){#de-main .jsdc-product .jsd-difference__grid{grid-template-columns:1fr}#de-main .jsdc-product .jsd-founder__inner{grid-template-columns:185px minmax(0,1fr);gap:24px}#de-main .jsdc-product .jsd-difference-card__intro{padding:20px 20px 0}#de-main .jsdc-product .jsd-difference-card__details{padding:0 20px 20px}}

/* Compact comparison variant: shared typography retained, unused card height removed. */
body.jsdc-product-compact #de-main .jsdc-product :is(#budget,#planning,#project-fit)> .jsdc-landing__tint>.jsdc-landing__wrap{padding-block:26px}
body.jsdc-product-compact #de-main .jsdc-product :is(#budget,#planning,#project-fit) :is(.jsdc-landing__card-body,.jsd-budget-card){padding:22px;min-height:0}
body.jsdc-product-compact #de-main .jsdc-product :is(#budget,#planning,#project-fit) h3{margin-top:0;margin-bottom:12px}
body.jsdc-product-compact #de-main .jsdc-product :is(#budget,#planning,#project-fit) p{margin-top:0;margin-bottom:12px}
body.jsdc-product-compact #de-main .jsdc-product :is(#budget,#planning,#project-fit) p:last-child{margin-bottom:0}
body.jsdc-product-compact #de-main .jsdc-product :is(#budget,#planning,#project-fit) .jsdc-landing__actions{margin-top:18px}
/* Image masks can become cross-origin under the CSS CDN. Keep real local SVG images visible. */
body.jsd-components-enabled #de-main .jsdc-product .jsdc-module-icon{mask:none;background:none;width:30px;height:30px;margin-bottom:12px}
body.jsd-components-enabled #de-main .jsdc-product .jsdc-module-icon img{opacity:1;width:30px;height:30px;filter:invert(43%) sepia(40%) saturate(842%) hue-rotate(7deg) brightness(87%) contrast(97%)}
body.jsdc-product-compact #de-main .jsdc-product #planning .jsdc-landing__card-body>p:has(>.jsdc-module-icon){margin:0 0 12px}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.43fr);gap:24px;align-items:start}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tile{display:block;min-width:0;padding:4px;background:var(--jsdc-white);border:1px solid var(--jsdc-line);color:var(--jsdc-ink);text-decoration:none;transition:border-color var(--jsdc-motion) ease}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tile img{display:block;width:100%;height:42px;object-fit:cover;aspect-ratio:auto}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tile span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:32px;padding:4px 2px;font-size:12px;line-height:1.2}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tile:is(:hover,[aria-current]){border-color:var(--jsdc-green);box-shadow:inset 0 0 0 1px var(--jsdc-green)}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tile:focus-visible{outline:2px solid var(--jsdc-green);outline-offset:3px}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview{margin:0;min-width:0;background:var(--jsdc-white);border:1px solid var(--jsdc-line)}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview>a{display:block}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview img{display:block;width:100%;height:240px;object-fit:cover;aspect-ratio:auto}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview figcaption{padding:14px 16px}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview :is(strong,span,small){display:block}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview span{margin-top:6px;font-size:14px}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview small{margin-top:8px;color:var(--jsdc-muted);font-size:12px;line-height:1.4}
@media(max-width:1100px){body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tiles{grid-template-columns:repeat(4,minmax(0,1fr))}body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview img{height:260px}}
@media(max-width:800px){body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette{grid-template-columns:1fr;gap:16px}body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview{grid-row:1;display:grid;grid-template-columns:100px minmax(0,1fr)}body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview img{height:100%;min-height:130px}body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__preview figcaption{padding:12px}body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tile img{height:34px}body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tile span{font-size:11px;min-height:32px}body.jsdc-product-compact #de-main .jsdc-product :is(#budget,#planning,#project-fit) :is(.jsdc-landing__card-body,.jsd-budget-card){padding:18px}}
@media(prefers-reduced-motion:reduce){body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__tile{transition:none}}


/* Detailed outlined library icons, enlarged without adding empty card height. */
body.jsd-components-enabled #de-main .jsdc-product .jsdc-module-icon,body.jsd-components-enabled #de-main .jsdc-product .jsdc-module-icon img{width:44px;height:44px}
body.jsd-components-enabled #de-main .jsdc-product .jsdc-module-icon{margin-bottom:12px}

/* Permanently visible on-request swatches retain the compact main palette. */
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__additional{grid-column:1/-1;border-top:1px solid var(--jsdc-line);margin-top:8px;padding-top:8px}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__additional h3{font-size:16px;line-height:1.5;margin:0;padding:10px 8px;color:var(--jsdc-ink);font-weight:600}
body.jsdc-product-compact #de-main .jsdc-product .jsdc-palette__additional p{font-size:14px;line-height:1.5;margin:6px 8px 14px}

/* Compact mobile reading variant: preserve full-width copy and original media. */
@media(max-width:800px){body.jsdc-product-compact #de-main .jsdc-product .jsd-founder__inner{grid-template-columns:1fr;gap:24px}body.jsdc-product-compact #de-main .jsdc-product .jsd-founder__portrait{width:185px;justify-self:center}body.jsdc-product-compact #de-main .jsdc-product .jsdc-landing__feature{row-gap:24px}}
@media(max-width:600px){body.jsdc-product-compact #de-main .jsdc-product .jsdc-product__properties--benefits{grid-template-columns:1fr}body.jsdc-product-compact #de-main .jsdc-product .jsdc-product__properties--benefits .jsdc-landing__card-body{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:16px;row-gap:8px;text-align:left;padding:20px 16px}body.jsdc-product-compact #de-main .jsdc-product .jsdc-product__properties--benefits .wpb_single_image{grid-row:span 2;margin:0}body.jsdc-product-compact #de-main .jsdc-product .jsdc-product__properties--benefits img{width:48px;height:48px}body.jsdc-product-compact #de-main .jsdc-product .jsdc-product__properties--benefits :is(h3,p){grid-column:2;margin:0}}