*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:#0c1728;background:#fff;line-height:1.55}.container{width:min(1180px,calc(100% - 36px));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);backdrop-filter:blur(16px);border-bottom:1px solid rgba(15,23,42,.08)}.nav-wrap{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#101828}.brand-mark{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#1f69ff,#65a2ff);display:grid;place-items:center;color:#fff;font-weight:900;box-shadow:0 10px 26px rgba(31,105,255,.24)}.brand-copy{display:flex;flex-direction:column}.brand-copy b{font-size:14px}.brand-copy small{font-size:10px;color:#7a8494}.nav{display:flex;align-items:center;gap:26px}.nav a{font-size:13px;font-weight:700;color:#3a4657;text-decoration:none}.nav a:hover{color:#2267f2}.nav-cta{padding:11px 17px!important;border-radius:12px;background:#0c1728;color:#fff!important}.nav-toggle{display:none;border:0;background:#f0f4fa;width:42px;height:42px;border-radius:12px;font-size:20px}.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#f7faff 0%,#fff 100%);padding:96px 0 78px}.hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:70px;align-items:center}.eyebrow,.kicker{font-size:11px;font-weight:900;letter-spacing:.16em;color:#2d69f2;text-transform:uppercase}.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid #dfe9ff;border-radius:999px;background:#fff}.eyebrow span{width:7px;height:7px;border-radius:50%;background:#2d69f2;box-shadow:0 0 0 5px #edf3ff}.hero h1{font-size:clamp(46px,6vw,76px);line-height:.98;letter-spacing:-.055em;margin:22px 0}.hero h1 em{font-style:normal;color:#2a68f4}.hero-lead{font-size:18px;color:#5e6b7c;max-width:660px}.hero-actions{display:flex;gap:12px;margin-top:30px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 20px;border-radius:14px;text-decoration:none;font-weight:800;font-size:14px;border:1px solid transparent}.btn-primary{background:#2467f2;color:#fff;box-shadow:0 15px 34px rgba(36,103,242,.25)}.btn-ghost{color:#17233a;border-color:#dbe2eb;background:#fff}.hero-trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:28px}.hero-trust div{display:flex;align-items:center;gap:7px;font-size:12px;color:#5b6675}.hero-trust b{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#edf3ff;color:#2467f2}.hero-visual{position:relative;min-height:560px;display:grid;place-items:center}.dashboard-card{width:min(470px,100%);padding:20px;border-radius:30px;background:#0b1526;color:#fff;box-shadow:0 38px 80px rgba(8,19,33,.24);transform:rotate(1.5deg)}.dash-top{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#cbd5e1}.dash-top>div{display:flex;align-items:center;gap:8px}.dot{width:9px;height:9px;border-radius:50%;background:#3ce28c}.online{color:#74eaaa}.scanner-preview{height:260px;margin:18px 0;border-radius:22px;background:linear-gradient(160deg,#14233b,#0b111d);position:relative;overflow:hidden;display:grid;place-items:center}.scan-lines{position:absolute;inset:0;background:linear-gradient(transparent 49%,rgba(41,103,242,.14) 50%,transparent 51%);background-size:100% 10px}.scan-focus{position:absolute;width:76%;height:55%;border:2px solid #4b82ff;border-radius:18px;box-shadow:0 0 0 999px rgba(0,0,0,.16)}.barcode{display:flex;gap:5px;align-items:center;height:95px;z-index:2}.barcode i{display:block;width:5px;height:100%;background:#fff;border-radius:1px}.barcode i:nth-child(3n){width:10px}.result-card{background:#fff;color:#111827;border-radius:20px;padding:18px}.result-label{font-size:9px;font-weight:900;color:#1eae68;letter-spacing:.12em}.result-card h3{margin:6px 0 11px;font-size:20px}.result-row{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#6a7482;font-size:12px}.result-row b{font-size:19px;color:#2467f2}.floating-card{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 15px;border-radius:17px;background:#fff;box-shadow:0 18px 45px rgba(15,23,42,.15);font-size:12px}.floating-card span{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#eef4ff}.floating-card small{display:block;color:#7b8696}.floating-card b{font-size:15px}.floating-one{left:-20px;top:90px}.floating-two{right:-10px;bottom:80px}.hero-glow{position:absolute;border-radius:50%;opacity:.7}.hero-glow-a{width:380px;height:380px;background:#dce9ff;right:-120px;top:60px}.hero-glow-b{width:240px;height:240px;background:#e8f7ff;left:-80px;bottom:-80px}.logo-strip{border-top:1px solid #eef1f5;border-bottom:1px solid #eef1f5;padding:22px 0;text-align:center;color:#7b8696;font-size:12px;letter-spacing:.08em}.section{padding:100px 0}.section-head{text-align:center;max-width:760px;margin:0 auto 48px}.section-head h2{font-size:clamp(34px,4vw,52px);line-height:1.06;letter-spacing:-.04em;margin:12px 0}.section-head p{color:#667085;font-size:16px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature-card{border:1px solid #e5eaf1;border-radius:24px;padding:26px;background:#fff;box-shadow:0 12px 30px rgba(15,23,42,.035)}.feature-card.featured{grid-row:span 2;background:linear-gradient(180deg,#0d182a,#101e34);color:#fff}.feature-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#edf3ff;color:#2467f2;font-size:21px;margin-bottom:20px}.featured .feature-icon{background:rgba(255,255,255,.08);color:#7db0ff}.feature-card h3{font-size:20px;margin:0 0 10px}.feature-card p{color:#697585;font-size:14px}.featured p{color:#b9c4d4}.mini-ui{margin-top:38px;background:#fff;border-radius:18px;color:#111827;padding:16px;display:flex;flex-direction:column;gap:6px}.mini-ui span{font-size:10px;color:#7d8794}.mini-ui b{font-size:14px}.mini-ui strong{font-size:26px;color:#2467f2}.dark-section{background:#081321;color:#fff}.section-head.light p{color:#aeb9c9}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.steps article{padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:22px;background:rgba(255,255,255,.04)}.steps article>span{font-size:12px;color:#6e9cff;font-weight:900}.steps h3{font-size:18px}.steps p{font-size:13px;color:#a9b5c6}.showcase{display:grid;grid-template-columns:.78fr 1.22fr;gap:32px;align-items:center}.showcase-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}.showcase-tabs button{border:1px solid #e1e7ef;background:#fff;padding:10px 13px;border-radius:11px;font-weight:800;color:#536071}.showcase-tabs button.active{background:#0d182a;color:#fff}.showcase-text{display:none}.showcase-text.active{display:block}.showcase-text>span{color:#2467f2;font-size:12px;font-weight:900}.showcase-text h3{font-size:34px;line-height:1.08;letter-spacing:-.035em}.showcase-text p{color:#657181}.showcase-text ul{padding-left:18px;color:#394659}.showcase-screen{min-height:520px;border-radius:28px;padding:12px;background:#eff3f8;overflow:hidden;display:grid;place-items:center}.screen-img{display:none;width:100%;height:100%;max-height:510px;object-fit:contain;border-radius:20px}.screen-img.active{display:block}.mobile-shot{width:auto;max-width:85%}.stats-section{padding-top:30px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stats-grid article{padding:24px;border-radius:20px;background:#f7f9fc;border:1px solid #e7ebf1}.stats-grid b{font-size:34px;color:#2467f2;display:block}.stats-grid span{font-size:13px;font-weight:900}.stats-grid p{font-size:12px;color:#6b7686}.security-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px}.security-grid h2{font-size:48px;line-height:1.04;letter-spacing:-.04em}.security-lead{color:#667085}.security-list{display:grid;gap:10px;margin-top:26px}.security-list>div{display:flex;gap:14px;padding:14px;border:1px solid #e6eaf0;border-radius:16px}.security-list>div>b{color:#2467f2}.security-list span{display:flex;flex-direction:column}.security-list small{color:#7a8493}.security-visual{min-height:450px;border-radius:30px;background:linear-gradient(145deg,#081321,#122746);position:relative;display:grid;place-items:center;overflow:hidden}.radar{width:300px;height:300px;border-radius:50%;position:relative;display:grid;place-items:center}.radar-ring{position:absolute;border:1px solid rgba(96,156,255,.3);border-radius:50%}.r1{width:100%;height:100%}.r2{width:68%;height:68%}.r3{width:36%;height:36%}.radar-center{width:70px;height:70px;border-radius:22px;background:#2c6cf5;color:#fff;display:grid;place-items:center;font-weight:900;box-shadow:0 0 50px rgba(44,108,245,.55)}.radar-dot{position:absolute;width:12px;height:12px;background:#5af0a4;border-radius:50%;box-shadow:0 0 0 7px rgba(90,240,164,.12)}.d1{top:54px;right:70px}.d2{bottom:56px;left:78px}.security-badge{position:absolute;bottom:26px;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.08);color:#cfe1ff;font-size:12px}.pricing-section{background:#f7f9fc}.pricing-card{display:grid;grid-template-columns:1.1fr 1fr auto;gap:30px;align-items:center;padding:34px;border-radius:28px;background:#fff;border:1px solid #e4e9f0;box-shadow:0 16px 44px rgba(15,23,42,.05)}.pricing-label{font-size:10px;color:#2467f2;font-weight:900;letter-spacing:.12em}.pricing-card h3{font-size:27px;margin:6px 0}.pricing-card p{color:#6b7585}.pricing-features{display:grid;grid-template-columns:1fr 1fr;gap:9px;font-size:12px;color:#435063}.cta-section{padding:30px 0 100px}.cta-card{background:linear-gradient(135deg,#2467f2,#1047ba);border-radius:30px;padding:44px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px}.cta-card h2{font-size:38px;line-height:1.05;margin:10px 0}.cta-card p{max-width:670px;color:#dbe8ff}.cta-actions{display:grid;gap:10px;min-width:220px}.btn-white{background:#fff;color:#1956d0}.btn-outline-white{border-color:rgba(255,255,255,.45);color:#fff}.footer-grid{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:30px;padding:34px 0;border-top:1px solid #e8ecf1}.footer-grid p{color:#7b8491;font-size:12px}.footer-links{display:flex;gap:16px}.footer-links a{font-size:12px;color:#4b5665;text-decoration:none}.footer-bottom{padding:15px 0 30px;color:#9aa2ad;font-size:11px}.footer-brand .brand-mark{width:38px;height:38px}
@media(max-width:980px){.nav{display:none;position:absolute;top:78px;left:18px;right:18px;flex-direction:column;align-items:stretch;background:#fff;border:1px solid #e5eaf1;border-radius:18px;padding:15px;box-shadow:0 18px 48px rgba(15,23,42,.14)}.nav.open{display:flex}.nav-toggle{display:grid;place-items:center}.hero-grid,.showcase,.security-grid{grid-template-columns:1fr}.hero-visual{min-height:480px}.feature-grid{grid-template-columns:1fr 1fr}.featured{grid-row:auto}.steps{grid-template-columns:1fr 1fr}.stats-grid{grid-template-columns:1fr 1fr}.pricing-card{grid-template-columns:1fr}.cta-card{flex-direction:column;align-items:flex-start}.cta-actions{width:100%;grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr;text-align:center}.footer-brand{justify-content:center}.footer-links{justify-content:center}}
@media(max-width:620px){.container{width:min(100% - 24px,1180px)}.nav-wrap{height:68px}.nav{top:68px}.hero{padding:65px 0 48px}.hero h1{font-size:48px}.hero-lead{font-size:15px}.hero-actions{flex-direction:column}.hero-actions .btn{width:100%}.hero-trust{display:grid;grid-template-columns:1fr 1fr}.hero-visual{min-height:390px}.dashboard-card{padding:14px;border-radius:24px}.scanner-preview{height:210px}.floating-card{display:none}.section{padding:70px 0}.feature-grid,.steps,.stats-grid{grid-template-columns:1fr}.showcase-screen{min-height:320px}.security-grid h2{font-size:36px}.pricing-features{grid-template-columns:1fr}.cta-card{padding:28px}.cta-card h2{font-size:30px}.cta-actions{grid-template-columns:1fr}}
/* v2 — motion system */
:root{--ease-out:cubic-bezier(.22,1,.36,1);--ease-soft:cubic-bezier(.4,0,.2,1)}
body{overflow-x:hidden}
/* Generic scroll reveal */
.reveal{opacity:0;transform:translate3d(0,34px,0);transition:opacity .82s var(--ease-out),transform .82s var(--ease-out);will-change:opacity,transform}
.reveal.reveal-left{transform:translate3d(-38px,0,0)}
.reveal.reveal-right{transform:translate3d(38px,0,0)}
.reveal.reveal-scale{transform:translate3d(0,22px,0) scale(.965)}
.reveal.is-visible{opacity:1;transform:translate3d(0,0,0) scale(1)}
/* Hero enters */
.hero-copy{animation:heroCopyIn .9s var(--ease-out) both}
.hero-visual{animation:heroVisualIn 1.05s .08s var(--ease-out) both}
.dashboard-card{animation:dashboardFloat 6s ease-in-out 1.15s infinite;transform-origin:center center;will-change:transform}
.floating-card{opacity:0;will-change:transform,opacity}
.floating-one{animation:floatCardInLeft .85s .7s var(--ease-out) forwards,floatCardBobA 4.4s 1.7s ease-in-out infinite}
.floating-two{animation:floatCardInRight .85s .95s var(--ease-out) forwards,floatCardBobB 4.8s 1.95s ease-in-out infinite}
.scan-focus{animation:scanFocusPulse 3.2s ease-in-out infinite}
.scan-lines{animation:scanLineMove 7s linear infinite}
.barcode{animation:barcodeBreathe 3.8s ease-in-out infinite}
.online,.dot{animation:onlinePulse 2.1s ease-in-out infinite}
.hero-glow-a{animation:glowDriftA 9s ease-in-out infinite}
.hero-glow-b{animation:glowDriftB 11s ease-in-out infinite}
/* Cards */
.feature-card,.steps article,.stats-grid article,.security-list>div,.pricing-card{transition:transform .35s var(--ease-soft),box-shadow .35s var(--ease-soft),border-color .35s ease}
.feature-card:hover,.steps article:hover,.stats-grid article:hover{transform:translateY(-6px);box-shadow:0 20px 46px rgba(15,23,42,.09);border-color:#d5ddea}
.security-list>div:hover{transform:translateX(5px);border-color:#cfdaf0}
/* Step reveal stagger is added by JS using transition-delay */
.steps article{overflow:hidden;position:relative}
.steps article::after{content:"";position:absolute;inset:auto -35% -70% auto;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(72,125,255,.11),transparent 65%);pointer-events:none;transition:transform .6s var(--ease-out)}
.steps article:hover::after{transform:translate(-18px,-18px) scale(1.15)}
/* Security radar */
.radar{will-change:transform;animation:radarBreath 5s ease-in-out infinite}
.radar-ring{animation:ringPulse 3.6s ease-in-out infinite;transform-origin:center}
.radar-ring.r2{animation-delay:.55s}.radar-ring.r3{animation-delay:1.1s}
.radar-center{animation:centerPulse 2.8s ease-in-out infinite;will-change:transform,box-shadow}
.radar-dot{top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;margin:-6px 0 0 -6px;will-change:transform,opacity;animation:dotPulse 1.5s ease-in-out infinite}
.radar-dot.d2{animation-delay:.65s}
.security-badge{animation:badgeFloat 3.6s ease-in-out infinite}
/* Buttons and screenshots */
.btn{transition:transform .25s var(--ease-soft),box-shadow .25s var(--ease-soft),background .25s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary:hover{box-shadow:0 20px 40px rgba(36,103,242,.32)}
.showcase-screen{transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
.showcase-screen:hover{transform:translateY(-5px);box-shadow:0 24px 55px rgba(15,23,42,.09)}
.screen-img.active{animation:screenSwap .55s var(--ease-out) both}
@keyframes heroCopyIn{from{opacity:0;transform:translate3d(-34px,16px,0)}to{opacity:1;transform:none}}
@keyframes heroVisualIn{from{opacity:0;transform:translate3d(40px,24px,0) scale(.96)}to{opacity:1;transform:none}}
@keyframes dashboardFloat{0%,100%{transform:rotate(1.5deg) translate3d(0,0,0)}50%{transform:rotate(.5deg) translate3d(0,-10px,0)}}
@keyframes floatCardInLeft{from{opacity:0;transform:translate3d(-36px,16px,0) scale(.9)}to{opacity:1;transform:none}}
@keyframes floatCardInRight{from{opacity:0;transform:translate3d(36px,16px,0) scale(.9)}to{opacity:1;transform:none}}
@keyframes floatCardBobA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(6px,-9px,0)}}
@keyframes floatCardBobB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-7px,8px,0)}}
@keyframes scanFocusPulse{0%,100%{border-color:#4b82ff;box-shadow:0 0 0 999px rgba(0,0,0,.16),0 0 0 rgba(75,130,255,0)}50%{border-color:#7aa3ff;box-shadow:0 0 0 999px rgba(0,0,0,.14),0 0 28px rgba(75,130,255,.22)}}
@keyframes scanLineMove{from{background-position:0 0}to{background-position:0 80px}}
@keyframes barcodeBreathe{0%,100%{transform:scale(.985);opacity:.92}50%{transform:scale(1.015);opacity:1}}
@keyframes onlinePulse{0%,100%{opacity:.72}50%{opacity:1}}
@keyframes glowDriftA{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-28px,22px,0) scale(1.08)}}
@keyframes glowDriftB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(32px,-24px,0)}}
@keyframes radarBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.018)}}
@keyframes ringPulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.035)}}
@keyframes centerPulse{0%,100%{transform:scale(1);box-shadow:0 0 50px rgba(44,108,245,.45)}50%{transform:scale(1.07);box-shadow:0 0 75px rgba(44,108,245,.7)}}
@keyframes dotPulse{0%,100%{opacity:.75;box-shadow:0 0 0 5px rgba(90,240,164,.1)}50%{opacity:1;box-shadow:0 0 0 10px rgba(90,240,164,.12)}}
@keyframes badgeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes screenSwap{from{opacity:0;transform:translate3d(20px,0,0) scale(.985)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
.reveal{opacity:1!important;transform:none!important}
}
/* v3 content refinements */
.floating-two{bottom:135px}
.price-flow{margin-top:18px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:10px;color:#617086}.price-flow span,.price-flow strong{padding:7px 9px;border-radius:9px;background:#f3f6fb}.price-flow strong{background:#eaf1ff;color:#2467f2}.price-flow i{font-style:normal;color:#9aa6b5}
.geo-explainer{display:flex;gap:14px;align-items:flex-start;margin:24px 0 16px;padding:17px 18px;border-radius:18px;background:linear-gradient(135deg,#f5f8ff,#fff);border:1px solid #dfe8f8;box-shadow:0 10px 26px rgba(36,103,242,.05)}.geo-explainer-icon{width:42px;height:42px;flex:0 0 42px;border-radius:13px;display:grid;place-items:center;background:#2467f2;color:#fff;font-size:18px;box-shadow:0 8px 18px rgba(36,103,242,.2)}.geo-explainer strong{font-size:14px}.geo-explainer p{margin:5px 0 0;color:#667085;font-size:12px;line-height:1.55}
#todayScanCount{display:inline-block;min-width:44px;font-variant-numeric:tabular-nums;transition:color .3s ease,transform .3s var(--ease-out)}#todayScanCount.tick{color:#2467f2;transform:translateY(-2px) scale(1.04)}
@media(max-width:980px){.floating-two{bottom:125px}}
/* v68 portfolio integration */
.btn-play{color:#17233a;border:1px solid #dbe2eb;background:#fff}.playIcon{width:28px;height:28px;border-radius:50%;background:#2467f2;color:#fff;display:grid;place-items:center;font-size:10px}.portfolioTariffGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.portfolioTariffCard{background:#fff;border:1px solid #e4e9f0;border-radius:24px;padding:26px;box-shadow:0 14px 34px rgba(15,23,42,.05);display:flex;flex-direction:column}.portfolioTariffCard h3{font-size:24px;margin:8px 0}.tariffPrice{font-size:28px;color:#2467f2;margin-bottom:8px}.portfolioTariffCard p{color:#6b7585;min-height:44px}.tariffMeta{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 20px}.tariffMeta span{padding:7px 9px;border-radius:10px;background:#f2f6ff;color:#4b5d78;font-size:11px}.portfolioTariffCard .btn{margin-top:auto}@media(max-width:900px){.portfolioTariffGrid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.portfolioTariffGrid{grid-template-columns:1fr}.hero-actions{display:grid}.btn-play{width:100%}}
/* v70 — managed showcase 6:3 ratio + smooth auto slides */
.showcase{align-items:center}.showcase-screen{position:relative;min-height:0!important;aspect-ratio:6/3!important;border-radius:28px;padding:16px;background:linear-gradient(145deg,#eef3f8,#f8fafc);overflow:hidden;display:block}.showcase-screen .screen-img{position:absolute;inset:16px;width:calc(100% - 32px)!important;height:calc(100% - 32px)!important;max-height:none!important;object-fit:contain!important;object-position:center;border-radius:18px;opacity:0;visibility:hidden;transform:translate3d(28px,0,0) scale(.985);transition:opacity .62s var(--ease-out),transform .62s var(--ease-out),visibility 0s linear .62s}.showcase-screen .screen-img.active{display:block!important;opacity:1;visibility:visible;transform:translate3d(0,0,0) scale(1);transition-delay:0s}.showcase-text{display:block!important;position:absolute;inset:0;opacity:0;visibility:hidden;transform:translate3d(-20px,0,0);transition:opacity .55s var(--ease-out),transform .55s var(--ease-out),visibility 0s linear .55s}.showcase-text.active{opacity:1;visibility:visible;transform:none;transition-delay:0s}.showcase-copy{position:relative;min-height:300px;padding-top:62px}.showcase-tabs{position:absolute;top:0;left:0;right:0;z-index:2}.showcase-tabs button{transition:background .3s ease,color .3s ease,transform .3s var(--ease-out)}.showcase-tabs button.active{transform:translateY(-1px)}
@media(max-width:980px){.showcase-copy{min-height:270px}.showcase-screen{aspect-ratio:6/3!important}}
@media(max-width:620px){.showcase-copy{min-height:300px}.showcase-screen{aspect-ratio:6/3!important;padding:9px}.showcase-screen .screen-img{inset:9px;width:calc(100% - 18px)!important;height:calc(100% - 18px)!important}}
/* v71 — professional 16:9 screenshot stage, full image + blurred fill */
.showcase-screen{
position:relative!important;
aspect-ratio:16/9!important;
min-height:0!important;
padding:0!important;
border-radius:28px!important;
overflow:hidden!important;
background:#e9eef5!important;
box-shadow:0 22px 54px rgba(15,23,42,.10);
}
.screen-frame{
position:absolute;
inset:0;
display:grid;
place-items:center;
opacity:0;
visibility:hidden;
transform:translate3d(30px,0,0) scale(.985);
transition:opacity .62s var(--ease-out),transform .62s var(--ease-out),visibility 0s linear .62s;
overflow:hidden;
isolation:isolate;
}
.screen-frame::before{
content:"";
position:absolute;
inset:-24px;
background-image:var(--screen-bg);
background-position:center;
background-size:cover;
filter:blur(24px) saturate(.75);
opacity:.28;
transform:scale(1.08);
z-index:-2;
}
.screen-frame::after{
content:"";
position:absolute;
inset:0;
background:rgba(245,248,252,.64);
z-index:-1;
}
.screen-frame.active{
opacity:1;
visibility:visible;
transform:translate3d(0,0,0) scale(1);
transition-delay:0s;
}
.showcase-screen .screen-frame .screen-img{
position:relative!important;
inset:auto!important;
display:block!important;
width:100%!important;
height:100%!important;
max-width:100%!important;
max-height:100%!important;
object-fit:contain!important;
object-position:center!important;
border-radius:0!important;
opacity:1!important;
visibility:visible!important;
transform:none!important;
transition:none!important;
box-shadow:none!important;
}
@media(max-width:980px){.showcase-screen{aspect-ratio:16/9!important}}
@media(max-width:620px){.showcase-screen{aspect-ratio:16/9!important;border-radius:20px!important}}
/* v72 — portfolio showcase dots + swipe, no overflowing tab buttons */
#interfeys .showcase{position:relative;grid-template-columns:.72fr 1.28fr;align-items:center;padding-bottom:48px;touch-action:pan-y}
#interfeys .showcase-copy{position:relative;min-height:270px;padding-top:0!important;overflow:hidden}
#interfeys .showcase-text{position:absolute!important;inset:0!important;display:flex!important;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;transform:translate3d(-28px,0,0);transition:opacity .55s var(--ease-out),transform .55s var(--ease-out),visibility 0s linear .55s;padding:4px 4px 4px 0}
#interfeys .showcase-text.active{opacity:1;visibility:visible;transform:translate3d(0,0,0);transition-delay:0s}
#interfeys .showcase-label{display:inline-flex!important;align-self:flex-start;width:auto!important;max-width:100%;padding:9px 13px;border-radius:11px;background:#0d182a;color:#fff!important;font-size:12px!important;font-weight:850!important;letter-spacing:0!important;margin-bottom:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#interfeys .showcase-text h3{margin:0 0 18px;font-size:clamp(30px,3vw,42px);line-height:1.08;letter-spacing:-.035em;max-width:520px}
#interfeys .showcase-text p{margin:0;color:#657181;font-size:16px;line-height:1.7;max-width:520px}
#interfeys .showcase-screen{position:relative;min-height:0!important;aspect-ratio:16/9!important;border-radius:28px!important;overflow:hidden!important;padding:0!important;background:#eef3f8!important;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y}
#interfeys .showcase-screen:active{cursor:grabbing}
#interfeys .screen-frame{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translate3d(28px,0,0) scale(.988);transition:opacity .62s var(--ease-out),transform .62s var(--ease-out),visibility 0s linear .62s;display:grid;place-items:center;overflow:hidden;background:#eef3f8}
#interfeys .screen-frame::before{content:"";position:absolute;inset:-22px;background-image:var(--screen-bg);background-position:center;background-size:cover;filter:blur(22px) saturate(.85);opacity:.22;transform:scale(1.08)}
#interfeys .screen-frame::after{content:"";position:absolute;inset:0;background:rgba(246,249,252,.72)}
#interfeys .screen-frame.active{opacity:1;visibility:visible;transform:translate3d(0,0,0) scale(1);transition-delay:0s}
#interfeys .screen-frame .screen-img{position:relative!important;z-index:2;display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important;border-radius:0!important;pointer-events:none}
#interfeys .showcase-dots{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:8px;height:30px;z-index:5}
#interfeys .showcase-dots button{appearance:none;border:0;padding:0;width:8px;height:8px;border-radius:999px;background:#cbd5e1;cursor:pointer;transition:width .35s var(--ease-out),background .35s ease,transform .35s var(--ease-out);box-shadow:none;outline:none}
#interfeys .showcase-dots button:hover{background:#9db7ef;transform:scale(1.15)}
#interfeys .showcase-dots button.active{width:30px;background:#2467f2;transform:none}
@media(max-width:980px){#interfeys .showcase{grid-template-columns:1fr;padding-bottom:46px;gap:20px}#interfeys .showcase-copy{min-height:220px}#interfeys .showcase-text{justify-content:flex-end}#interfeys .showcase-screen{aspect-ratio:16/9!important}}
@media(max-width:620px){#interfeys .showcase-copy{min-height:190px}#interfeys .showcase-label{margin-bottom:13px;padding:7px 10px;font-size:10px!important}#interfeys .showcase-text h3{font-size:28px;margin-bottom:10px}#interfeys .showcase-text p{font-size:14px;line-height:1.55}#interfeys .showcase-screen{border-radius:20px!important}}
/* v131 — tariff card line breaks + fixed bottom action group */
.portfolioTariffCard{
display:flex;
flex-direction:column;
min-height:100%;
}
.portfolioTariffCard .tariffDescription{
color:#6b7585;
white-space:pre-line;
overflow-wrap:anywhere;
line-height:1.6;
margin:14px 0 18px;
min-height:0;
}
.portfolioTariffCard .tariffCardFooter{
margin-top:auto;
display:grid;
gap:14px;
}
.portfolioTariffCard .tariffMeta{
display:flex;
flex-wrap:wrap;
gap:7px;
margin:0;
}
.portfolioTariffCard .tariffCardFooter .btn{
margin-top:0;
width:100%;
}