.wp-section{padding:36px 24px 48px;background:#f1f1f4}.wp-inner{max-width:1160px;margin:auto}.wp-inner h2{font-family:Geist,'Work Sans',sans-serif;font-size:clamp(23px,3vw,34px);font-weight:600;letter-spacing:-.04em;color:#172237;margin:0 0 24px;text-align:center}.wp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.wp-card{display:block;min-width:0;overflow:hidden;border-radius:18px;background:#d9efdf;color:#164b37;text-decoration:none;border:1px solid #cce3d3;box-shadow:0 8px 24px #203c4710}.wp-image{aspect-ratio:1.35;position:relative;overflow:hidden;background:#e4ebf1}.wp-image img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}.wp-image:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0d182ad9);pointer-events:none}.wp-category{position:absolute;bottom:17px;left:20px;right:20px;z-index:1;color:white;font-size:13px;font-weight:500}.wp-caption{display:flex;align-items:center;justify-content:space-between;padding:21px 22px;font-size:20px;font-weight:600;letter-spacing:-.03em}.wp-caption>span:last-child{font-size:24px}.wp-card:hover .wp-caption{background:#c4e8ce}.wp-card:focus-visible{outline:3px solid #0055ff;outline-offset:4px}.wp-inner>.mobile-carousel-controls{display:none}@media(max-width:767px){.wp-section{padding:26px 20px 32px}.wp-inner h2{text-align:left;font-size:25px}.wp-grid{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}.wp-grid::-webkit-scrollbar{display:none}.wp-card{flex:0 0 100%;width:100%;box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always}.wp-inner>.mobile-carousel-controls{display:flex}.wp-caption{padding:18px 20px;font-size:20px}}

/* Reference-style project tiles, with a light blue footer. */
.wp-card{border:0;border-radius:16px;background:#c5e3ff;box-shadow:none}
.wp-image{aspect-ratio:1.46}
.wp-image:after{inset:42% 0 0;background:linear-gradient(transparent,rgba(5,12,24,.94))}
.wp-category{left:16px;right:16px;bottom:18px;text-align:center;font-size:16px;line-height:1.25;font-weight:700;text-shadow:0 1px 4px #0005}
.wp-caption{min-height:82px;box-sizing:border-box;justify-content:center;text-align:center;padding:18px 24px;background:#c5e3ff;color:#215d8e;font-size:20px;line-height:1.25;font-weight:700;letter-spacing:0;text-transform:uppercase;text-decoration:underline;text-underline-offset:3px}
.wp-caption>span:last-child{display:none}
.wp-card:hover .wp-caption{background:#b3d9fc;color:#124776}
@media(max-width:767px){.wp-caption{font-size:20px;padding:18px 20px;min-height:80px}.wp-category{font-size:15px}}

/* Lighter previews, more space between cards. */
.wp-grid{gap:32px}
.wp-card{border:2px solid #a9cfee;box-sizing:border-box}
.wp-image:after{inset:50% 0 0;background:linear-gradient(transparent,rgba(5,12,24,.68))}
@media(max-width:767px){.wp-grid{gap:20px}}

.wp-category.wp-result{font-size:clamp(32px,3.2vw,44px);font-weight:800;letter-spacing:-.04em;line-height:1.1;bottom:20px}

/* v3: evenly dark scrim so the result number is always readable (like the reference), calmer footer */
.wp-image img{filter:saturate(.92) brightness(.97)}
.wp-image:after{inset:0;background:linear-gradient(to top,rgba(8,14,28,.94) 0%,rgba(8,14,28,.76) 20%,rgba(8,14,28,.34) 44%,rgba(8,14,28,.07) 66%,transparent 86%)}
.wp-category.wp-result{left:14px;right:14px;bottom:22px;font-size:clamp(34px,3.4vw,48px);text-shadow:0 2px 16px rgba(0,0,0,.4)}
.wp-approx{font-size:.6em;font-weight:700;opacity:.78;margin-right:.1em;vertical-align:.2em}
.wp-caption{font-size:18px;letter-spacing:.01em;text-decoration-thickness:2px;text-underline-offset:5px}
.wp-card{transition:transform .2s,box-shadow .2s}
.wp-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(33,93,142,.18)}
@media(max-width:767px){.wp-category.wp-result{font-size:34px;bottom:18px}.wp-caption{font-size:17px}}

/* v4: no tilde, cleaner footer (name + arrow, underline only on hover), softer card */
.wp-card{border-radius:20px;border:2px solid #b5d6f2;box-shadow:0 10px 28px rgba(33,93,142,.10)}
.wp-caption{display:flex;align-items:center;justify-content:center;gap:10px;min-height:76px;background:linear-gradient(180deg,#d4e9ff,#c2dffc);color:#1d5384;font-size:17px;font-weight:800;letter-spacing:.06em;text-decoration:none}
.wp-caption>span:last-child{display:inline-block;font-size:1.25em;line-height:1;font-weight:700;transition:transform .2s}
.wp-card:hover .wp-caption{background:linear-gradient(180deg,#c9e3fe,#b4d6fa);color:#123f68}
.wp-card:hover .wp-caption>span:first-child{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.wp-card:hover .wp-caption>span:last-child{transform:translate(3px,-3px)}
.wp-category.wp-result{letter-spacing:-.045em;font-weight:800}
@media(max-width:767px){.wp-caption{min-height:64px;font-size:16px}}

/* v5: the portfolio is its own dark band, with room around it */
.wp-section{position:relative;margin-top:72px;padding:100px 24px 112px;background:linear-gradient(180deg,#0d1630 0%,#15204a 100%);overflow:hidden;isolation:isolate}
.wp-section:before{content:'';position:absolute;left:-10%;right:-10%;top:-20%;height:70%;background:radial-gradient(ellipse at 50% 0,rgba(76,110,255,.38),transparent 65%);z-index:-1;pointer-events:none}
.wp-eyebrow{display:block;text-align:center;font-size:13px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#8fb1ff;margin:0 0 14px}
.wp-inner h2{color:#fff;font-size:clamp(28px,3.6vw,44px);margin-bottom:52px}
.wp-grid{gap:40px}
.wp-card{border-color:rgba(255,255,255,.16);box-shadow:0 24px 60px rgba(0,0,0,.45)}
.wp-card:hover{box-shadow:0 30px 70px rgba(0,0,0,.55),0 0 0 1px rgba(143,177,255,.45)}
.wp-section + .pr-section{padding-top:100px}
@media(max-width:767px){
  .wp-section{margin-top:48px;padding:64px 18px 56px}
  .wp-inner h2{margin-bottom:34px}
  .wp-section .mobile-carousel-controls button{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);color:#fff}
  .wp-section .mobile-carousel-controls .mc-count{color:#b9c6ea}
}

/* v6: neutral gray instead of blue (cards, frames and the band) */
.wp-section{background:linear-gradient(180deg,#15171c 0%,#20232a 100%)}
.wp-section:before{background:radial-gradient(ellipse at 50% 0,rgba(255,255,255,.10),transparent 65%)}
.wp-eyebrow{color:#aeb3bf}
.wp-card{background:#e6e8ed;border:2px solid #cfd3dc;box-shadow:0 24px 60px rgba(0,0,0,.45)}
.wp-caption{background:linear-gradient(180deg,#eceef2,#dde0e6);color:#2b2f3a}
.wp-card:hover{box-shadow:0 30px 70px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.35)}
.wp-card:hover .wp-caption{background:linear-gradient(180deg,#e3e6ec,#d3d7df);color:#14161c}
@media(max-width:767px){.wp-section .mobile-carousel-controls .mc-count{color:#b4b9c5}}

/* v7: a clearly gray frame and footer (not almost-white) */
.wp-card{background:#cdd0d7;border:2px solid #b3b7c1}
.wp-caption{background:linear-gradient(180deg,#d6d9df,#c4c8d0);color:#1f222a}
.wp-card:hover .wp-caption{background:linear-gradient(180deg,#cdd0d7,#b9bdc7);color:#0f1116}
.wp-card:hover{box-shadow:0 30px 70px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.4)}

/* v8: back to the light band, descriptions instead of names */
.wp-section{background:#f1f1f4;margin-top:72px;padding:88px 24px 96px}
.wp-section:before{display:none}
.wp-eyebrow{color:#6b7280}
.wp-inner h2{color:#172237}
.wp-card{box-shadow:0 12px 30px rgba(20,24,40,.14)}
.wp-card:hover{box-shadow:0 22px 46px rgba(20,24,40,.20),0 0 0 1px rgba(20,24,40,.10)}
.wp-caption{text-transform:none;letter-spacing:0;font-size:16.5px;font-weight:700;line-height:1.35;padding:16px 22px;min-height:72px;text-align:center}
.wp-card:hover .wp-caption>span:first-child{text-decoration:none}
@media(max-width:767px){
  .wp-section{margin-top:48px;padding:56px 18px 52px}
  .wp-caption{font-size:16px;min-height:64px}
  .wp-section .mobile-carousel-controls button{background:#fff;border-color:#e1e4ee;color:#343448}
  .wp-section .mobile-carousel-controls .mc-count{color:#626779}
}

/* v9: soft light-blue footers and frames */
.wp-card{background:#d6e8fb;border:2px solid #bcd9f2}
.wp-caption{background:linear-gradient(180deg,#e1effd,#d1e5fa);color:#1f567f}
.wp-card:hover .wp-caption{background:linear-gradient(180deg,#d6e9fc,#c3dcf6);color:#143f66}
