.port-hero{
  padding:clamp(80px,10vw,140px) 0 clamp(40px,5vw,80px);
  text-align:center;
}
.port-hero .eyebrow{margin-bottom:16px}
.port-hero h1{font-family:var(--display);font-size:clamp(2.2rem,5vw,4rem);font-weight:500;letter-spacing:-.02em;line-height:1.05;margin-bottom:20px}
.port-hero h1 em{font-style:italic;color:var(--accent);font-weight:400}
.port-hero p{color:var(--muted);font-size:1.1rem;max-width:48ch;margin:0 auto}

.port-filters{
  display:flex;gap:12px;flex-wrap:wrap;justify-content:center;
  padding:32px 0 48px;
}
.port-filter{
  padding:10px 20px;border-radius:999px;border:1px solid var(--border);
  font-weight:500;font-size:.9rem;color:var(--muted);cursor:pointer;
  transition:all .2s;
}
.port-filter:hover{border-color:var(--accent);color:var(--accent)}
.port-filter.active{background:var(--accent);color:#fff;border-color:var(--accent)}

.port-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
  padding-bottom:clamp(60px,8vw,120px);
}
@media(max-width:900px){.port-grid{grid-template-columns:1fr}}

.port-card{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius);
  padding:30px;display:flex;flex-direction:column;gap:14px;
  cursor:pointer;transition:all .35s ease;
}
.port-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--accent)}
.port-card .industry{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.port-card h3{font-family:var(--display);font-size:1.25rem;font-weight:500;margin-top:-4px}
.port-card > p{color:var(--muted);font-size:.92rem;line-height:1.5;flex:1}
.port-tags{display:flex;gap:8px;flex-wrap:wrap}
.port-tags .tag{
  font-size:.75rem;font-weight:600;padding:5px 10px;border-radius:999px;
  background:rgba(0,191,255,.1);color:var(--accent);
}
.port-card .case-result{
  padding:12px 14px;border-radius:10px;
  background:rgba(0,191,255,.1);color:var(--accent);
  font-weight:600;font-size:.88rem;
}
.port-cta{
  font-weight:600;font-size:.9rem;color:var(--accent);
  display:flex;align-items:center;gap:6px;
  transition:gap .2s;
}
.port-card:hover .port-cta{gap:12px}

.port-modal{
  position:fixed;inset:0;z-index:100;
  background:rgba(11,18,32,.6);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  padding:24px;overflow-y:auto;
}
.port-modal[hidden]{display:none}
.port-modal[hidden]*{display:none}
.port-modal-inner{
  background:#fff;border-radius:20px;max-width:700px;width:100%;
  max-height:90vh;overflow-y:auto;position:relative;
  box-shadow:var(--shadow-lg);
}
.port-modal-close{
  position:sticky;top:0;background:#fff;padding:20px 24px;
  display:flex;justify-content:flex-end;border-bottom:1px solid var(--border);z-index:1;
}
.port-modal-close button{
  width:36px;height:36px;border-radius:50%;border:1px solid var(--border);
  display:grid;place-items:center;color:var(--muted);cursor:pointer;
  transition:all .2s;
}
.port-modal-close button:hover{border-color:var(--accent);color:var(--accent)}
.port-modal-body{padding:32px}
.port-modal-industry{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.port-modal-title{font-family:var(--display);font-size:1.8rem;font-weight:500;margin-bottom:24px}
.port-modal-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:28px}
.port-modal-photos img{width:100%;border-radius:10px;border:1px solid var(--border)}
.port-modal-section{margin-bottom:24px}
.port-modal-section h4{font-family:var(--display);font-size:1rem;font-weight:600;margin-bottom:12px;color:var(--text)}
.port-modal-section p{color:var(--muted);font-size:.95rem;line-height:1.6}
.port-modal-list{list-style:none;display:flex;flex-direction:column;gap:10px}
.port-modal-list li{display:flex;align-items:center;gap:10px;color:var(--text);font-size:.95rem}
.port-modal-list li::before{content:"✓";color:var(--accent);font-weight:700}
.port-modal-result{
  padding:16px 20px;border-radius:12px;
  background:rgba(0,191,255,.1);color:var(--accent);
  font-weight:700;font-size:1rem;text-align:center;margin-bottom:28px;
}
.port-modal-testimonial{
  border-top:1px solid var(--border);padding-top:24px;margin-top:8px;
}
.port-modal-testimonial .stars{color:#F59E0B;font-size:.9rem;letter-spacing:2px;margin-bottom:12px}
.port-modal-testimonial blockquote{font-family:var(--display);font-size:1.05rem;line-height:1.5;font-weight:400;margin-bottom:16px;color:var(--text)}
.port-modal-testimonial cite{font-style:normal;color:var(--muted);font-size:.88rem}
.port-modal-cta{margin-top:24px}