.portfolio-page { background: #fff; }
.portfolio-hero { position: relative; overflow: hidden; padding: 168px 0 94px; background: linear-gradient(135deg, #061c24 0%, #0a2a35 58%, #103b47 100%); color: #fff; }
.portfolio-grid-bg { position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(to bottom,#000,transparent 92%); }
.portfolio-orb { position:absolute; border-radius:50%; filter:blur(10px); opacity:.25; }
.portfolio-orb-one { width:380px; height:380px; right:-120px; top:40px; background:#3cb3b0; }
.portfolio-orb-two { width:260px; height:260px; left:-120px; bottom:-80px; background:#86e0dc; }
.portfolio-hero-layout { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(390px,.82fr); gap:70px; align-items:center; }
.portfolio-hero-copy h1 { max-width:720px; margin-bottom:24px; font-family:"Montserrat",sans-serif; font-size:clamp(2.8rem,5.6vw,5.1rem); line-height:1.02; letter-spacing:-.055em; }
.portfolio-hero-copy h1 span { color:var(--home-aqua); }
.portfolio-hero-copy>p:not(.home-eyebrow) { max-width:690px; color:rgba(255,255,255,.72); font-size:1.08rem; }
.portfolio-hero-showcase { position:relative; }
.portfolio-showcase-window { overflow:hidden; border:1px solid rgba(255,255,255,.16); border-radius:28px; background:rgba(255,255,255,.08); box-shadow:0 30px 90px rgba(0,0,0,.3); backdrop-filter:blur(20px); transform:rotate(1.2deg); }
.portfolio-window-bar,.portfolio-browser-bar { display:flex; align-items:center; gap:7px; min-height:42px; padding:0 16px; background:rgba(255,255,255,.09); }
.portfolio-window-bar span,.portfolio-browser-bar span { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.4); }
.portfolio-window-bar small { margin-left:auto; color:rgba(255,255,255,.55); font-size:.68rem; }
.portfolio-showcase-content { padding:30px; }
.portfolio-showcase-title { display:grid; gap:8px; }
.portfolio-showcase-title span { color:var(--home-aqua); font-size:.72rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.portfolio-showcase-title strong { font:700 1.42rem/1.2 "Montserrat",sans-serif; }
.portfolio-capability-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:28px 0; }
.portfolio-capability-grid span { padding:18px; border:1px solid rgba(255,255,255,.1); border-radius:15px; background:rgba(255,255,255,.055); color:rgba(255,255,255,.82); font-weight:700; }
.portfolio-capability-grid span:first-child { background:var(--home-aqua); color:var(--home-blue); }
.portfolio-showcase-note { display:flex; justify-content:space-between; gap:16px; padding-top:18px; border-top:1px solid rgba(255,255,255,.12); font-size:.8rem; }
.portfolio-showcase-note span { color:rgba(255,255,255,.58); }
.portfolio-intro { padding-top:72px; padding-bottom:72px; background:var(--home-light); }
.portfolio-intro-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; align-items:end; }
.portfolio-intro-grid h2 { max-width:560px; font:700 clamp(2rem,4vw,3.2rem)/1.08 "Montserrat",sans-serif; letter-spacing:-.04em; }
.portfolio-intro-grid>p { max-width:650px; margin:0; color:var(--home-text); font-size:1.05rem; }
.portfolio-featured { padding-top:110px; }
.portfolio-feature-grid { display:grid; gap:42px; }
.portfolio-feature-card { display:grid; grid-template-columns:1.12fr .88fr; min-height:570px; overflow:hidden; border:1px solid var(--home-border); border-radius:30px; background:#fff; box-shadow:var(--home-shadow); }
.portfolio-feature-card:nth-child(even) { grid-template-columns:.88fr 1.12fr; }
.portfolio-feature-card:nth-child(even) .portfolio-feature-visual { order:2; }
.portfolio-feature-visual { display:grid; place-items:center; padding:52px; background:#eef6f6; }
.portfolio-ofj .portfolio-feature-visual { background:linear-gradient(145deg,#14191e,#29323a); }
.portfolio-scep .portfolio-feature-visual { background:linear-gradient(145deg,#e8f2fb,#d9ebde); }
.portfolio-browser { width:min(100%,650px); overflow:hidden; border-radius:18px; background:#fff; box-shadow:0 28px 70px rgba(0,0,0,.24); transform:perspective(1000px) rotateY(-3deg) rotateX(1deg); }
.portfolio-feature-card:nth-child(even) .portfolio-browser { transform:perspective(1000px) rotateY(3deg) rotateX(1deg); }
.portfolio-browser-bar { background:#dfe7e8; }
.portfolio-browser-bar span { background:#9eacad; }
.portfolio-ofj-site { min-height:350px; background:#fff; }
.portfolio-ofj-nav { display:flex; align-items:center; padding:22px 26px; background:#21272f; color:#fff; font:800 .86rem "Montserrat",sans-serif; letter-spacing:.08em; }
.portfolio-ofj-nav i { width:70px; height:8px; margin-left:auto; border-radius:9px; background:#ee4834; }
.portfolio-ofj-hero { min-height:214px; display:flex; flex-direction:column; justify-content:center; padding:34px; background:linear-gradient(110deg,rgba(33,39,47,.96),rgba(33,39,47,.75)),linear-gradient(135deg,#38434f,#12171c); color:#fff; }
.portfolio-ofj-hero small { color:#ee4834; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.portfolio-ofj-hero strong { max-width:410px; margin:13px 0 22px; font:700 clamp(1.35rem,3vw,2rem)/1.15 "Montserrat",sans-serif; }
.portfolio-ofj-hero span { width:120px; height:30px; border-radius:999px; background:#ee4834; }
.portfolio-ofj-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; padding:20px 24px; }
.portfolio-ofj-cards i { height:60px; border-radius:8px; background:#e8ecee; }
.portfolio-scep-site { min-height:350px; background:#fff; }
.portfolio-scep-nav { display:flex; align-items:baseline; gap:7px; padding:19px 25px; color:#003b7a; }
.portfolio-scep-nav b { font:800 1.2rem "Montserrat",sans-serif; }
.portfolio-scep-nav small { color:#3a8f38; font-weight:800; }
.portfolio-scep-nav i { width:80px; height:8px; margin-left:auto; border-radius:9px; background:#fb860c; }
.portfolio-scep-hero { min-height:225px; display:grid; grid-template-columns:140px 1fr; gap:24px; align-items:center; padding:32px; background:linear-gradient(135deg,#003b7a,#0057b8); color:#fff; }
.portfolio-robot-head { position:relative; width:115px; height:100px; border:8px solid #7fb933; border-radius:28px 28px 18px 18px; background:#2e3135; }
.portfolio-robot-head:before,.portfolio-robot-head:after { content:""; position:absolute; top:32px; width:18px; height:18px; border-radius:50%; background:#fb860c; }
.portfolio-robot-head:before { left:22px; }.portfolio-robot-head:after { right:22px; }
.portfolio-scep-hero small { color:#bfe989; font-weight:800; }
.portfolio-scep-hero strong { display:block; margin-top:12px; font:700 clamp(1.25rem,2.8vw,1.85rem)/1.15 "Montserrat",sans-serif; }
.portfolio-scep-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; padding:20px 24px; }
.portfolio-scep-stats i { height:55px; border-radius:8px; background:#e7eff6; border-bottom:5px solid #7fb933; }
.portfolio-feature-copy { align-self:center; padding:58px; }
.portfolio-category { margin-bottom:13px; color:var(--home-aqua); font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.portfolio-feature-copy h3 { margin-bottom:18px; font:700 clamp(2rem,4vw,3rem)/1.05 "Montserrat",sans-serif; letter-spacing:-.04em; }
.portfolio-feature-copy>p:not(.portfolio-category) { color:var(--home-text); }
.portfolio-feature-copy ul { display:grid; gap:10px; margin:24px 0 28px; padding:0; list-style:none; }
.portfolio-feature-copy li:before { content:"✓"; margin-right:10px; color:var(--home-aqua); font-weight:800; }
.portfolio-feature-copy a { color:var(--home-blue); font-weight:800; text-decoration:none; }
.portfolio-feature-copy a:hover { color:#228b89; }
.portfolio-collection { background:var(--home-light); }
.portfolio-card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.portfolio-card { overflow:hidden; border:1px solid var(--home-border); border-radius:22px; background:#fff; box-shadow:0 14px 36px rgba(10,42,53,.07); transition:transform .22s ease,box-shadow .22s ease; }
.portfolio-card:hover { transform:translateY(-6px); box-shadow:var(--home-shadow); }
.portfolio-miniature { position:relative; min-height:230px; overflow:hidden; padding:28px; }
.portfolio-card>div:last-child { padding:26px 28px 30px; }
.portfolio-card p { margin-bottom:8px; color:var(--home-aqua); font-size:.7rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.portfolio-card h3 { margin-bottom:12px; font:700 1.25rem/1.25 "Montserrat",sans-serif; }
.portfolio-card div:last-child span { color:var(--home-text); font-size:.92rem; }
.portfolio-mini-brand { background:#0a2a35; color:#fff; }
.portfolio-mini-brand span { font:800 2.4rem "Montserrat",sans-serif; }
.portfolio-mini-brand i { position:absolute; bottom:28px; width:58px; height:58px; border-radius:50%; }
.portfolio-mini-brand i:nth-of-type(1){left:28px;background:#3cb3b0}.portfolio-mini-brand i:nth-of-type(2){left:96px;background:#fff}.portfolio-mini-brand i:nth-of-type(3){left:164px;background:#7ad6d2}
.portfolio-mini-campaign { background:#f2e5dc; color:#21272f; }
.portfolio-mini-campaign span { color:#ee4834; font-weight:800; letter-spacing:.11em; }.portfolio-mini-campaign strong { display:block; max-width:220px; margin-top:20px; font:800 2rem/1.05 "Montserrat",sans-serif; }.portfolio-mini-campaign i { position:absolute; width:180px; height:180px; right:-45px; bottom:-55px; border:26px solid #ee4834; border-radius:50%; }
.portfolio-mini-report { background:#e8f1f5; color:#0a2a35; }.portfolio-mini-report span { font:800 3rem "Montserrat",sans-serif; }.portfolio-mini-report strong { display:block; font:700 1.3rem "Montserrat",sans-serif; }.portfolio-mini-report i { display:block; width:75%; height:8px; margin-top:16px; border-radius:8px; background:#adc9d1; }.portfolio-mini-report i:nth-of-type(2){width:60%}.portfolio-mini-report i:nth-of-type(3){width:82%}
.portfolio-mini-event { background:linear-gradient(135deg,#33294d,#a3447e); color:#fff; }.portfolio-mini-event span { font-size:.72rem;font-weight:800;letter-spacing:.12em}.portfolio-mini-event strong { display:block; max-width:260px; margin-top:38px; font:800 2rem/1.05 "Montserrat",sans-serif; }.portfolio-mini-event i { position:absolute; width:120px;height:120px;right:20px;bottom:-35px;border:20px solid #f3b94e;border-radius:50%; }
.portfolio-mini-education { background:#edf5e7;color:#003b7a}.portfolio-mini-education span { padding:7px 10px;border-radius:6px;background:#fb860c;color:#fff;font-weight:800}.portfolio-mini-education strong { display:block;margin:22px 0;font:800 1.6rem "Montserrat",sans-serif}.portfolio-mini-education i { display:block;width:85%;height:7px;margin-top:13px;border-radius:8px;background:#b5cbb5}.portfolio-mini-education i:nth-of-type(2){width:68%}.portfolio-mini-education i:nth-of-type(3){width:76%}
.portfolio-mini-content { background:#f3f7f7;color:#0a2a35}.portfolio-mini-content span { color:#3cb3b0;font-weight:800;letter-spacing:.12em}.portfolio-mini-content strong { display:block;margin-top:28px;font:800 2rem/1.05 "Montserrat",sans-serif}.portfolio-mini-content i { position:absolute;right:25px;bottom:25px;width:78px;height:78px;border:16px solid #3cb3b0;border-radius:50%}
.portfolio-method { padding-bottom:120px; }
.portfolio-centered-heading { max-width:760px; margin:0 auto 48px; text-align:center; }
.portfolio-centered-heading h2 { font:700 clamp(2.1rem,4vw,3.4rem)/1.08 "Montserrat",sans-serif; letter-spacing:-.04em; }
.portfolio-centered-heading>p:last-child { color:var(--home-text); }
.portfolio-method-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.portfolio-method-grid article { padding:30px; border:1px solid var(--home-border); border-radius:20px; background:#fff; }
.portfolio-method-grid span { color:var(--home-aqua); font:800 .76rem "Montserrat",sans-serif; }
.portfolio-method-grid h3 { margin:17px 0 12px; font:700 1.1rem/1.25 "Montserrat",sans-serif; }
.portfolio-method-grid p { margin:0; color:var(--home-text); font-size:.9rem; }
.portfolio-cta-section { padding-top:0; }
@media (max-width:1020px){.portfolio-hero-layout,.portfolio-intro-grid,.portfolio-feature-card,.portfolio-feature-card:nth-child(even){grid-template-columns:1fr}.portfolio-feature-card:nth-child(even) .portfolio-feature-visual{order:0}.portfolio-card-grid{grid-template-columns:repeat(2,1fr)}.portfolio-method-grid{grid-template-columns:repeat(2,1fr)}.portfolio-hero-showcase{max-width:700px}.portfolio-feature-copy{padding:42px}.portfolio-feature-visual{padding:36px}}
@media (max-width:680px){.portfolio-hero{padding:138px 0 72px}.portfolio-hero-layout{gap:44px}.portfolio-showcase-content{padding:22px}.portfolio-capability-grid{grid-template-columns:1fr}.portfolio-showcase-note{display:grid}.portfolio-intro-grid{gap:22px}.portfolio-feature-card{min-height:0}.portfolio-feature-visual{padding:20px}.portfolio-browser{transform:none!important}.portfolio-ofj-site,.portfolio-scep-site{min-height:285px}.portfolio-scep-hero{grid-template-columns:85px 1fr;padding:20px}.portfolio-robot-head{width:75px;height:68px;border-width:6px}.portfolio-robot-head:before,.portfolio-robot-head:after{top:21px;width:12px;height:12px}.portfolio-robot-head:before{left:14px}.portfolio-robot-head:after{right:14px}.portfolio-feature-copy{padding:32px 25px}.portfolio-card-grid,.portfolio-method-grid{grid-template-columns:1fr}.portfolio-miniature{min-height:210px}}
