﻿.itts-portfolio-skip{position:absolute;left:-9999px;top:0;z-index:200;padding:12px 18px;border-radius:0 0 8px 0;background:#101d35;color:#fff;font-weight:700}
    .itts-portfolio-skip:focus{left:0}

    .itts-portfolio-hero{position:relative;overflow:hidden;padding:86px 0;background:linear-gradient(118deg,#0b1528,#122c4d 58%,#134a63);color:#fff}
    .itts-portfolio-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:52px}
    .itts-portfolio-hero h1{margin:18px 0;color:#fff;font-size:clamp(2.3rem,4.6vw,3.6rem)}
    .itts-portfolio-hero .eyebrow{color:#75e6ee;font-size:.75rem;font-weight:800;letter-spacing:.13em}
    .itts-portfolio-hero-copy p{max-width:600px;margin-bottom:28px;color:#c9d7e6;font-size:1.06rem}
    .itts-portfolio-hero-actions{display:flex;gap:13px;flex-wrap:wrap}
    .itts-portfolio-hero-collage{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .itts-portfolio-hero-shot{margin:0;overflow:hidden;border:1px solid #ffffff26;border-radius:14px;background:#0d1c33;box-shadow:0 18px 44px rgba(0,0,0,.35)}
    .itts-portfolio-hero-shot img{display:block;width:100%;height:132px;object-fit:cover;object-position:top center}
    .itts-portfolio-hero-shot.wide{grid-column:span 2}
    .itts-portfolio-hero-shot.wide img{height:176px}

    .itts-portfolio-grid .project-image:before,
    .itts-portfolio-grid .project-image:after{display:none}
    .itts-portfolio-shot{display:block;width:100%;height:100%}
    .itts-portfolio-shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .35s ease}
    .project:hover .itts-portfolio-shot img{transform:scale(1.04)}
    .itts-portfolio-status{display:inline-block;margin:0 0 10px;padding:3px 9px;border-radius:999px;background:#fff1d6;color:#7a4b00;font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
    .itts-portfolio-tech{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0 !important;padding-top:12px;border-top:1px solid var(--line)}
    .itts-portfolio-tech span{padding:3px 9px;border:1px solid var(--line);border-radius:999px;background:var(--light);color:#4e5c72;font-size:.72rem;font-weight:650}
    .itts-portfolio-links{margin-top:14px !important}
    .itts-portfolio-visit{display:inline-flex;gap:6px;color:var(--blue);font-size:.88rem;font-weight:800}
    .itts-portfolio-visit:hover{text-decoration:underline}
    .itts-portfolio-pending{color:var(--muted);font-size:.85rem;font-weight:600}

    .itts-portfolio-count{margin:0 0 26px;text-align:center;color:var(--muted);font-size:.88rem}
    .itts-portfolio-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .itts-portfolio-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
    .itts-portfolio-chip{padding:5px 11px;border-radius:999px;background:#eaf2ff;color:#1c5aa8;font-size:.78rem;font-weight:700}
    .itts-portfolio-avatar{display:grid;place-items:center;width:54px;height:54px;margin-bottom:16px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;font-weight:900;letter-spacing:.02em}
    .itts-portfolio-note{margin:28px 0 0;padding:16px 18px;border:1px dashed #c9d5e5;border-radius:12px;background:#fbfcfe;color:#5a6a80;font-size:.86rem}
    .itts-portfolio-note strong{color:var(--ink)}
    .itts-portfolio-page .service-card p{min-height:0}
    .itts-portfolio-page .service-card h3{margin-bottom:10px}

    :focus-visible{outline:3px solid #1b6fd6;outline-offset:2px}
    .itts-portfolio-hero :focus-visible,.cta-band :focus-visible{outline-color:#7fe3ef}

    @media (max-width:1050px){
      .itts-portfolio-hero-grid{grid-template-columns:1fr;gap:34px}
    }

    @media (max-width:780px){
      .itts-portfolio-hero{padding:64px 0}
      .itts-portfolio-grid-3{grid-template-columns:1fr 1fr}
    }

    @media (max-width:520px){
      .itts-portfolio-grid-3{grid-template-columns:1fr}
    }

    @media (prefers-reduced-motion:reduce){
      html{scroll-behavior:auto}
      *,*:before,*:after{transition-duration:.01ms !important;animation-duration:.01ms !important;animation-iteration-count:1 !important}
    }
