/* Website showcase: the theme's website-work pattern, populated by posts. */
.jdiws-section {
    --jdiws-paper: var(--jdi-paper, #f1faee);
    --jdiws-ink: var(--jdi-ink, #1d3557);
    --jdiws-blue: var(--jdi-blue, #a8dadc);
    background: var(--jdiws-ink); color: var(--jdiws-paper);
    padding: clamp(64px, 7vw, 108px) max(6vw, calc((100vw - 1240px) / 2));
    margin: 0;
}
.jdiws-section, .jdiws-section * { box-sizing: border-box; overflow-wrap: anywhere; }
.jdiws-inner { max-width: 1440px; margin-inline: auto; }
.jdiws-section h2 {
    font-family: var(--wp--preset--font-family--display, var(--jdi-display, 'Arial Narrow', sans-serif));
    font-size: clamp(2.8rem, 5.3vw, 5rem); font-weight: 400;
    line-height: 1.08; letter-spacing: -.025em; max-width: 1080px; margin: 18px 0 36px;
}
.jdiws-section h2 em { font-style: normal; color: var(--jdiws-blue); }
.jdiws-eyebrow { margin: 0; color: var(--jdiws-blue); font: 600 .8rem/1.6 Inter, Arial, sans-serif; letter-spacing: .035em; }
.jdiws-intro { max-width: 560px; margin: 0 0 36px; }
.jdiws-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
.jdiws-card { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.jdiws-card > * { margin: 0; }
.jdiws-image { width: 100%; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--jdiws-blue); }
.jdiws-image a { display: block; width: 100%; height: 100%; }
.jdiws-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.jdiws-label { padding-top: 14px; color: var(--jdiws-paper); font: 600 .72rem/1.6 Inter, Arial, sans-serif; letter-spacing: .035em; text-transform: uppercase; }
.jdiws-card h3 { font-family: var(--wp--preset--font-family--display, var(--jdi-display, 'Arial Narrow', sans-serif)); font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 400; line-height: 1.15; letter-spacing: -.025em; text-transform: uppercase; }
.jdiws-description { color: var(--jdiws-blue); font-size: .75rem; padding-bottom: 8px; }
.jdiws-button { display: flex; justify-content: center; align-items: center; width: 100%; min-height: 48px; margin-top: auto; padding: 15px 18px; border: 1px solid var(--jdiws-blue); background: var(--jdiws-blue); color: var(--jdiws-ink); font: 600 .85rem/1.5 Inter, Arial, sans-serif; text-align: center; text-decoration: none; }
.jdiws-button:hover, .jdiws-button:focus-visible { background: var(--jdiws-paper); border-color: var(--jdiws-paper); }
.jdiws-section a:focus-visible { outline: 3px solid var(--jdiws-blue); outline-offset: 4px; }
.jdiws-image a:focus-visible { outline-offset: -5px; }
.jdiws-section .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
html[data-jdi-theme="dark"] .jdiws-section { --jdiws-blue: #a8dadc; --jdiws-paper: #eaf0f2; --jdiws-ink: #0d1419; background: #0d1419; color: #eaf0f2; }
html[data-jdi-theme="dark"] .jdiws-card { background: #18242b; padding: 20px; }
@media(max-width:900px) { .jdiws-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(max-width:600px) { .jdiws-grid { grid-template-columns: minmax(0, 1fr); } }
@media(prefers-reduced-motion:no-preference) { .jdiws-image img { transition: transform .3s; } .jdiws-card:hover .jdiws-image img { transform: scale(1.025); } }
