/* WebFusion Digital — Portfólio demonstrativo v6 / Clientes v1 */
.wf-showcase-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
.wf-showcase-card{min-width:0}
.wf-showcase-card__surface{height:100%;border-radius:24px;background:var(--c-bg);border:1px solid var(--c-border);overflow:hidden;box-shadow:0 15px 38px rgba(0,0,0,.07);transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}
.wf-showcase-media{position:relative;height:258px;overflow:hidden;background:radial-gradient(circle at 85% 12%,rgba(255,255,255,.8),transparent 48%),linear-gradient(135deg,var(--wf-project-tint,#e2e8f0),#e7edf2);border-bottom:1px solid rgba(0,0,0,.055)}
.wf-showcase-browser-frame{position:absolute;left:15px;top:28px;width:84%;height:auto;aspect-ratio:1.55;border:5px solid #253341;border-bottom-width:4px;border-radius:11px;overflow:hidden;box-shadow:0 22px 38px rgba(10,22,34,.21),0 0 0 1px rgba(255,255,255,.28);background:#fff}
.wf-showcase-browser-top{height:21px;display:flex;align-items:center;gap:8px;background:#253341;color:#d7e2eb;padding:0 8px;font:500 8px/1 Inter,sans-serif;white-space:nowrap;overflow:hidden}
.wf-showcase-browser-top>span:last-child{overflow:hidden;text-overflow:ellipsis}
.wf-showcase-dots{display:flex;gap:3px;flex:0 0 auto}.wf-showcase-dots i{height:5px;width:5px;border-radius:50%;background:#9eb1be}.wf-showcase-dots i:first-child{background:#e58c85}.wf-showcase-dots i:nth-child(2){background:#d7c681}
.wf-showcase-browser-frame img{display:block;width:100%;height:auto;aspect-ratio:1440/900;object-fit:cover;object-position:top;background:white;transition:transform .35s ease}
.wf-showcase-phone{position:absolute;top:45px;right:12px;width:90px;height:189px;background:#1f2c38;border:4px solid #1f2c38;border-radius:16px;overflow:hidden;box-shadow:0 17px 29px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.42);z-index:2;pointer-events:none}
.wf-showcase-phone__speaker{position:absolute;top:2px;left:50%;transform:translateX(-50%);width:23px;height:5px;border-radius:0 0 8px 8px;background:#17222e;z-index:2}
.wf-showcase-phone__screen{position:absolute;inset:5px 1px 6px;background:#fff;border-radius:8px;overflow:hidden}
.wf-showcase-phone__screen img{display:block;width:100%;height:auto;object-fit:initial;max-width:none;background:#fff}
.wf-showcase-phone__home{position:absolute;bottom:1px;left:50%;transform:translateX(-50%);width:22px;height:2px;border-radius:2px;background:#98a9b7}
.wf-showcase-demo-tag{position:absolute;bottom:12px;left:14px;z-index:3;background:#fff;color:#294358;border:1px solid rgba(33,55,73,.1);border-radius:30px;padding:7px 10px;font:800 9px/1 Inter,sans-serif;letter-spacing:.025em;box-shadow:0 6px 17px rgba(20,35,48,.13)}
.wf-showcase-brandrow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 21px 14px;border-bottom:1px solid var(--c-border)}
.wf-showcase-logo-frame{width:178px;height:55px;max-width:calc(100% - 52px);padding:5px 9px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:10px;border:1px solid #e8edf1}
.wf-showcase-logo{display:block;width:100%;height:100%;object-fit:contain}
.wf-showcase-card__number{font:700 11px Inter,sans-serif;white-space:nowrap;color:var(--c-text-faint)}
.wf-showcase-card__body{padding:22px 21px 24px;min-height:245px}
.wf-showcase-card__body h3{font-size:clamp(22px,2vw,27px);margin:9px 0 4px;line-height:1.17}
.wf-showcase-card__body .wf-project-card__brand{font-size:11px;font-weight:600;line-height:1.5}
.wf-showcase-card__body .wf-project-card__desc{font-size:13px;line-height:1.6;margin:12px 0 22px;max-width:none}
.wf-showcase-card__actions{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:auto;flex-wrap:wrap}
.wf-showcase-card__actions .wf-project-card__cta{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;text-decoration:none;color:var(--c-text);font-size:11px;line-height:1.3;min-height:39px}
.wf-showcase-card__actions .wf-project-card__cta svg{width:15px;height:15px}
.wf-showcase-preview{min-height:38px;display:inline-flex;align-items:center;gap:5px;border:1px solid var(--c-border);border-radius:99px;background:var(--c-bg-panel);color:var(--c-text);padding:0 11px;font:700 11px/1 Inter,sans-serif;cursor:pointer;transition:border-color .2s,background-color .2s,transform .2s}
.wf-showcase-preview svg{width:14px;height:14px}
@media(hover:hover){.wf-showcase-card__surface:hover{transform:translateY(-4px);border-color:rgba(0,153,235,.35);box-shadow:0 22px 50px rgba(0,0,0,.13)}.wf-showcase-card__surface:hover .wf-showcase-browser-frame img{transform:scale(1.015)}.wf-showcase-preview:hover{border-color:#3394cf;transform:translateY(-1px)}}
.wf-showcase-preview:focus-visible,.wf-showcase-view:focus-visible,.wf-preview-dialog button:focus-visible,.wf-preview-dialog a:focus-visible{outline:3px solid #138fef;outline-offset:3px}
.wf-clients-ribbon{padding:62px 0;border-bottom:1px solid var(--c-border);background:var(--c-bg)}
.wf-clients-ribbon .wf-portfolio-shell{display:flex;justify-content:space-between;align-items:center;gap:28px}
.wf-clients-ribbon h2{font:700 clamp(24px,3vw,35px)/1.16 Syne,sans-serif;margin:10px 0;color:var(--c-text)}
.wf-clients-ribbon p{color:var(--c-text-muted);font:400 14px/1.7 Inter,sans-serif;max-width:675px;margin:0}
.wf-clients-ribbon .wf-portfolio-btn{white-space:nowrap}
.wf-preview-dialog{position:fixed;inset:4vh 3vw;max-width:1120px;width:min(1120px,94vw);max-height:92vh;margin:auto;padding:0;border:1px solid rgba(150,170,185,.34);border-radius:19px;background:var(--c-bg);color:var(--c-text);box-shadow:0 28px 110px rgba(0,0,0,.45);overflow:hidden}
.wf-preview-dialog[open]{display:flex;flex-direction:column}.wf-preview-dialog::backdrop{background:rgba(3,11,19,.82);backdrop-filter:blur(5px)}
.wf-preview-dialog__head{padding:17px 22px 10px;display:flex;align-items:flex-start;justify-content:space-between;gap:15px;border-bottom:1px solid var(--c-border)}
.wf-preview-dialog__head .wf-eyebrow{font-size:9px;letter-spacing:.13em}.wf-preview-dialog__head h2{font:700 clamp(20px,3vw,28px)/1.16 Syne,sans-serif;margin:6px 0;color:var(--c-text)}
.wf-preview-close{background:var(--c-bg-panel);border:1px solid var(--c-border);color:var(--c-text);border-radius:10px;cursor:pointer;flex:0 0 36px;width:36px;height:36px;font:500 27px/1 Arial,sans-serif}
.wf-preview-dialog__tabs{display:flex;gap:8px;padding:10px 22px 12px;border-bottom:1px solid var(--c-border)}
.wf-preview-dialog__tabs button{border:1px solid var(--c-border);border-radius:40px;padding:10px 18px;background:var(--c-bg-panel);color:var(--c-text);cursor:pointer;font:700 12px Inter,sans-serif}
.wf-preview-dialog__tabs button.is-active{background:#0055ff;border-color:#0055ff;color:#fff}
.wf-preview-dialog__stage{flex:1;min-height:0;overflow:auto;text-align:center;background:#e7ebf0;padding:16px}
.wf-preview-dialog__stage img{display:block;width:100%;max-width:1030px;height:auto;margin:0 auto;object-fit:contain;box-shadow:0 5px 23px rgba(13,24,38,.2);background:white}
.wf-preview-dialog.is-mobile .wf-preview-dialog__stage img{max-width:390px}
.wf-preview-dialog__foot{display:flex;justify-content:flex-end;padding:11px 22px;border-top:1px solid var(--c-border)}
.wf-preview-dialog__foot a{color:var(--c-text);font:700 12px Inter,sans-serif;text-decoration:underline;text-underline-offset:4px}
/* A página de clientes não inventa cases. O estado inicial é explícito e publicamente claro. */
.wf-clients-page{min-height:100vh;background:var(--c-bg);color:var(--c-text)}
.wf-clients-hero{padding:168px 0 88px;position:relative;overflow:hidden;background:radial-gradient(circle at 83% 20%,rgba(0,229,255,.09),transparent 40%),radial-gradient(circle at 14% 70%,rgba(0,85,255,.13),transparent 38%),var(--c-bg)}
.wf-clients-hero__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.wf-clients-hero h1{font:800 clamp(43px,5vw,70px)/1.04 Syne,sans-serif;letter-spacing:-.045em;margin:18px 0 24px;max-width:780px}
.wf-clients-hero h1 span{background:linear-gradient(120deg,#0055ff,#00add9);-webkit-background-clip:text;background-clip:text;color:transparent}
.wf-clients-hero p{font:400 16px/1.75 Inter,sans-serif;color:var(--c-text-muted);max-width:650px}
.wf-clients-hero__actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:30px}
.wf-clients-visual{padding:25px;border:1px solid var(--c-border);border-radius:25px;background:var(--c-bg-panel);box-shadow:0 22px 48px rgba(0,0,0,.12)}
.wf-clients-visual__top{font:700 11px/1.6 Inter,sans-serif;letter-spacing:.12em;color:var(--c-text-muted);margin-bottom:15px}
.wf-clients-visual__frame{min-height:250px;border:1px dashed rgba(108,148,188,.5);border-radius:17px;display:grid;place-content:center;justify-items:center;gap:20px;padding:28px;text-align:center;background:linear-gradient(140deg,var(--c-bg),var(--c-bg-panel))}
.wf-clients-visual__frame img{width:210px;max-width:100%;height:auto;object-fit:contain}
.wf-clients-visual__frame p{font-size:13px;max-width:290px;margin:0;line-height:1.6}
.wf-clients-explainer{padding:62px 0 105px;border-top:1px solid var(--c-border)}
.wf-clients-explainer h2{font:700 clamp(29px,3vw,40px)/1.2 Syne,sans-serif;letter-spacing:-.035em;max-width:800px;margin:12px 0}
.wf-clients-explainer p{color:var(--c-text-muted);line-height:1.8;max-width:700px}
@media(max-width:1180px){.wf-showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wf-showcase-media{height:278px}.wf-showcase-browser-frame{width:82%}.wf-showcase-phone{right:18px;width:97px;height:205px}}
@media(max-width:800px){.wf-clients-hero__grid{grid-template-columns:1fr;gap:30px}.wf-clients-hero{padding-top:134px}.wf-clients-ribbon .wf-portfolio-shell{flex-direction:column;align-items:flex-start}}
@media(max-width:680px){.wf-showcase-grid{grid-template-columns:1fr;gap:18px}.wf-showcase-media{height:clamp(230px,64vw,330px)}.wf-showcase-browser-frame{left:14px;top:24px;width:82%}.wf-showcase-phone{top:34px;right:15px;width:clamp(85px,24vw,114px);height:clamp(176px,49vw,231px)}.wf-showcase-card__body{min-height:0}.wf-showcase-card__body h3{font-size:26px}.wf-clients-ribbon{padding:49px 0}.wf-preview-dialog__stage{padding:9px}.wf-preview-dialog__head{padding:14px 12px 10px}.wf-preview-dialog__tabs{padding:9px 12px}.wf-preview-dialog__foot{padding:10px 12px}.wf-clients-hero{padding-top:116px;padding-bottom:56px}.wf-clients-visual{padding:14px}}
@media(max-width:360px){.wf-showcase-card__actions{gap:6px}.wf-showcase-card__actions .wf-project-card__cta{font-size:10px}.wf-showcase-preview{font-size:10px;padding:0 8px}}
@media(prefers-reduced-motion:reduce){.wf-showcase-card__surface,.wf-showcase-browser-frame img,.wf-showcase-preview{transition:none!important}}
