/* SHOPIUM / EDITORIAL V2 — refined light sections; dark hero and ownership preserved */
:root{--v2-ink:#122236;--v2-border:#e1e8ec;--v2-green:#079987;--v2-mist:#eaf3f2;--v2-bg:#f3f7f7}
body{background:#f8fafb}
/* Structure: hierarchy and controlled editorial rhythm */
.section{position:relative;isolation:isolate}
.section h2{font-size:clamp(34px,3.7vw,57px);letter-spacing:-2.7px;line-height:1.13;color:var(--v2-ink)}.ownership h2{color:#fff}
.ownership-grid{grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr)}
.section h2 span{color:#22baab}
.section-intro p,.showcase-head>p,.pricing-copy>p,.faq-grid>div>p{max-width:580px;font-size:16px;line-height:1.85}
.eyebrow{font-size:10px;letter-spacing:2.3px}
/* TRUST: more visually substantial without fabricated client branding */
.trust{background:#f5faf9;border-bottom:1px solid #dbe7e5;padding:34px 0 31px;position:relative;overflow:hidden}
.trust:before{content:'';position:absolute;inset:0 auto 0 0;width:42%;background:linear-gradient(100deg,#d8f3ed66,transparent);pointer-events:none}
.trust .container{position:relative}
.trust-top p{color:#0a8878;font-size:10px}
.trust-top>span{color:#516877;font-weight:500}
.brand-marquee{overflow:hidden;margin-top:22px}
.brand-track{display:flex;width:max-content;animation:marquee-left 36s linear infinite}
.brand-set{display:flex;gap:12px;padding-right:12px}
.brand-card{flex:none;display:flex;align-items:center;justify-content:center;height:96px;padding:0 22px;border:1px solid #dce8e5;border-radius:12px;background:#fff;box-shadow:0 12px 28px #162f2707}
.brand-card img{display:block;height:48px;width:auto}
.brand-inglot{background:#000;border-color:#000}
.brand-greencell{background:#1ce283;border-color:#1ce283}
.brand-ania{background:#f2ede7;border-color:#f2ede7}
.brand-carry{background:#231f20;border-color:#231f20}
@media(prefers-reduced-motion:reduce){.brand-track{animation:none}.brand-marquee{overflow-x:auto}}
.trust-note{color:#7c8d94;line-height:1.6}
/* FEATURES: offset cards, scale, emphasis and a clean background grid */
.intro{background:radial-gradient(ellipse 57% 38% at 100% 1%,#dcefeb88,transparent 85%),linear-gradient(180deg,#fbfdfd 0%,#f3f8f7 100%);overflow:hidden;padding-block:126px 135px}
.intro:before{content:'';position:absolute;z-index:-1;inset:0;opacity:.32;background-image:linear-gradient(#ccdedc 1px,transparent 1px),linear-gradient(90deg,#ccdedc 1px,transparent 1px);background-size:90px 90px;mask-image:linear-gradient(90deg,transparent 40%,#000 100%)}
.intro .section-intro{max-width:875px;margin-bottom:58px}
.intro .section-intro:after{content:'01 / CO ZYSKUJESZ';display:block;margin-top:27px;font-size:11px;letter-spacing:2px;color:#869c9a;font-weight:800}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;border:0;border-radius:0;overflow:visible}
.feature,.feature:nth-child(3n),.feature:nth-last-child(-n+3){border:1px solid #e1e9e9;border-radius:18px;min-height:277px;padding:29px 29px 34px;background:linear-gradient(160deg,#fff 68%,#f7fbfa);box-shadow:0 12px 28px #102b2b09;position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s,border-color .25s}
.feature:hover{transform:translateY(-6px);border-color:#a8dcd3;box-shadow:0 25px 52px #102b2b14}
.feature:after{content:'↗';position:absolute;right:23px;top:22px;color:#a6bdba;font-size:19px;font-weight:500}
.feature:nth-child(1),.feature:nth-child(3),.feature:nth-child(5){background:linear-gradient(135deg,#133747,#10253b);border-color:#173e49;box-shadow:0 20px 45px #071d2a22}
.feature:nth-child(1) h3,.feature:nth-child(3) h3,.feature:nth-child(5) h3{color:#fff}.feature:nth-child(1) p,.feature:nth-child(3) p,.feature:nth-child(5) p{color:#b8cdd2}.feature:nth-child(1):after,.feature:nth-child(3):after,.feature:nth-child(5):after{color:#67dbcd}
.feature:nth-child(1) .feature-icon,.feature:nth-child(3) .feature-icon,.feature:nth-child(5) .feature-icon{background:#ffffff14;color:#7af0dd}
.feature:nth-child(4){background:linear-gradient(135deg,#e9f7f3,#fff 68%);border-color:#c7e7df}
.feature-icon{width:56px;height:56px;border-radius:15px;margin-bottom:40px;background:#e7f5f2;color:#087d73;font-size:28px}
.feature h3{font-size:18px;margin-bottom:11px}.feature p{font-size:13px;line-height:1.85;max-width:290px}
/* SHOWCASE: dark-on-light gallery treatment that feels like a portfolio publication */
.showcase{background:radial-gradient(ellipse 70% 100% at 85% 15%,#dff1ed 0%,transparent 70%),#fff;padding-block:64px 48px;overflow:hidden}
.showcase-head{margin-bottom:47px;align-items:flex-end}
.showcase-head>p{font-size:15px;max-width:355px}
.showcase-grid{gap:25px}
.showcase-card{border:1px solid #d7e3e4;border-radius:20px;box-shadow:0 18px 36px #152d3a17;transition:transform .25s,box-shadow .25s}
.showcase-card:hover{transform:translateY(-7px);box-shadow:0 26px 55px #152d3a27}
.showcase-rows{height:calc(100svh - 250px);min-height:460px;display:flex;flex-direction:column;gap:16px;margin:6px 0 28px;overflow:hidden}
.showcase-rows .marquee{flex:1;min-height:0}
.showcase-rows .marquee-track{height:100%;align-items:stretch}
.showcase-rows .marquee-card{height:100%;width:auto;aspect-ratio:16/10;border-width:5px;box-shadow:none;background:transparent}.showcase-rows .shot-image{background:none}
.showcase-card .shot-image{height:340px;background:linear-gradient(130deg,#e2dace,#acc8c4)}
.showcase-card .shot-caption{background:#fff;padding:24px 27px;gap:10px}
.shot-caption strong{font-size:18px;letter-spacing:-.5px}.shot-caption span{text-transform:uppercase;letter-spacing:1.4px;font-size:10px;font-weight:800;color:#199183}
.showcase-bottom{border-top:1px solid #cddadd;margin-top:43px;padding-top:24px}
.link-button{padding:13px 0;border-bottom:2px solid #148a7c}
/* PROCESS: bring editorial cards and a timeline on off-white */
.process{background:linear-gradient(180deg,#f9fbfb 0%,#edf5f4 100%);overflow:hidden;padding-block:125px 140px}
.process:before{content:'SHOPIUM';position:absolute;right:-20px;top:150px;font:800 clamp(125px,23vw,350px)/1 var(--display);letter-spacing:-22px;color:#cce1dd27;z-index:-1;pointer-events:none}
.process .section-intro{max-width:780px;margin-bottom:70px}.process .section-intro.center p{margin-inline:auto;text-align:center}
.steps{position:relative;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.steps:before{content:'';position:absolute;top:41px;left:8%;right:8%;height:2px;background:linear-gradient(90deg,#83d5ca,#d5e6e3);z-index:-1}
.steps article{background:#fff;border:1px solid #dfe9e8;box-shadow:0 19px 37px #112b360b;border-radius:20px;padding:32px 27px 35px;min-height:295px;transition:transform .25s}
.steps article:hover{transform:translateY(-5px)}
.steps article::after{display:none}
.step-num{font:800 12px var(--display);color:#069583;letter-spacing:2px}
.step-icon{width:62px;height:62px;border:1px solid #b8e9e0;background:linear-gradient(135deg,#e6fcf5,#d8f2ee);color:#087b70;font-size:30px;border-radius:17px;margin:25px 0}
.steps h3{font-size:17px;line-height:1.3}
.steps p{font-size:13px;line-height:1.8}
/* FOUNDER: high-authority typography and portrait composition */
.founder{background:linear-gradient(135deg,#f0f4f5,#f8fbfa 70%);padding-block:126px;overflow:hidden}
.founder:after{content:'';position:absolute;right:-190px;bottom:-300px;width:760px;height:760px;border:1px solid #dae5e5;border-radius:50%;z-index:-1;box-shadow:0 0 0 80px #d5e5e41c,0 0 0 160px #d5e5e419}
.founder-grid{grid-template-columns:1fr 2fr;gap:67px;align-items:center}
.founder-image{position:relative;padding:0 16px 32px 0}
.founder-image:after{content:'';position:absolute;z-index:-1;inset:24px -5px 12px 30px;border:1px solid #91beb8;border-radius:24px}
.portrait{display:block;width:100%;aspect-ratio:4/4.6;object-fit:cover;object-position:center 42%;border-radius:21px;box-shadow:0 32px 56px #0d263329}
.modal-avatar{display:block;object-fit:cover;object-position:center 28%}
.portrait-label{padding:14px 0 0;text-align:right}
.founder-text .experience{padding:24px 0;margin:23px 0;border-top:1px solid #cedbdc;border-bottom:1px solid #cedbdc}
.experience strong{font-size:88px;color:#22baab}.experience span{font-size:15px;max-width:265px}
.founder-text p{font-size:14px;line-height:1.94;max-width:630px}
.founder-text .btn{margin-top:24px;padding:19px 25px}
/* PRICING: dark card on calm luminous light surface */
.pricing{background:radial-gradient(ellipse 70% 100% at 85% 15%,#dff1ed 0%,transparent 70%),#fff;padding-block:132px 140px}
.pricing-grid{grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:55px}
.pricing-copy h2{font-size:clamp(36px,3.5vw,53px)}
.pricing-note{border:1px solid #c9e6df;border-radius:16px;background:#e8f6f1;padding:27px;box-shadow:0 15px 34px #0e58420a}
.price-card{background:linear-gradient(155deg,#182c40,#0c192a 68%);color:#fff;border:1px solid #395068;border-radius:24px;padding:42px;box-shadow:0 33px 70px #0b283636;position:relative;overflow:hidden}
.price-card:before{content:'';position:absolute;border:1px solid #ffffff14;border-radius:50%;height:320px;width:320px;right:-130px;top:-150px;box-shadow:0 0 0 50px #ffffff07,0 0 0 100px #ffffff04;pointer-events:none}
.price-card-top{position:relative;color:#afc1ce}.available{color:#79e7cf}.price-value{position:relative}
.price-value small,.price-value p,.price-value sup{color:#adbecd}
.price-value strong{font-size:clamp(36px,3.4vw,49px);letter-spacing:-2.2px}
.price-card ul{position:relative;border-color:#ffffff24}.price-card li{color:#e0e8ee;font-size:13px;padding-block:11px}.price-card li:before{color:#59decb}
.price-card .btn{position:relative}.price-legal{position:relative;color:#b1bfce}
/* FAQ: column separation, clearer contrast and substantial accordion */
.faq{background:#f1f5f6;padding-block:125px 135px}
.faq-grid{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:58px}
.faq-grid>div:first-child{border-left:3px solid #0eb2a0;padding-left:26px;align-self:start}
.faq-list{padding-right:0;background:#fff;border:1px solid #dce7e8;border-radius:20px;box-shadow:0 22px 45px #1730460c;overflow:hidden}
.faq-list details{border-bottom:1px solid #e6eeef;padding:0 26px}
.faq-list details:last-child{border-bottom:0}
.faq-list summary{font-size:15px;padding:25px 38px 25px 0}.faq-list details[open]{background:#f9fcfb}
.faq-list p{font-size:13px;line-height:1.85;color:#526878}
/* Scaled mobile art direction */
@media(max-width:1050px){.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.founder-grid{gap:35px}.pricing-grid{gap:32px}.price-card{padding:31px}}
@media(max-width:980px){.pricing-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:760px){.section{padding-block:83px}.section h2{font-size:clamp(34px,8vw,44px);letter-spacing:-1.9px}.intro .section-intro{margin-bottom:30px}.intro .section-intro:after{margin-top:17px}.trust{padding:27px 0}.brand-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.brand-row span{min-width:0;padding:17px 8px;font-size:13px}.brand-row span:last-child:nth-child(odd){grid-column:1/-1}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.feature,.feature:nth-child(3n),.feature:nth-last-child(-n+3),.feature:nth-child(2n),.feature:nth-last-child(-n+2){border:1px solid #dfe9e8;min-height:270px;padding:19px 16px 24px;border-radius:15px}.feature-icon{width:45px;height:45px;margin-bottom:27px}.feature h3{font-size:15px}.feature p{font-size:12px}.showcase-head{margin-bottom:30px}.showcase-grid{gap:12px}.showcase-card:nth-child(2),.showcase-card:nth-child(3){margin-top:0}.showcase-card{border-radius:14px}.showcase-card .shot-image{height:200px}.showcase-card .shot-caption{padding:16px 13px}.shot-caption strong{font-size:14px}.steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.steps:before{display:none}.steps article{min-height:270px;padding:20px 16px}.step-icon{margin:16px 0;width:51px;height:51px}.steps h3{font-size:14px}.steps p{font-size:12px}.founder-grid,.pricing-grid,.faq-grid{grid-template-columns:1fr;gap:34px}.founder-image{width:min(100%,420px)}.portrait-placeholder{min-height:0}.founder-text .experience{margin:20px 0}.experience strong{font-size:75px}.pricing-note{margin-top:25px}.price-card{padding:25px}.price-value strong{font-size:clamp(31px,8.5vw,45px)}.faq-grid>div:first-child{padding-left:18px}.faq-list details{padding-inline:18px}.faq-list summary{font-size:14px}}
@media(max-width:390px){.feature-grid{grid-template-columns:1fr}.feature,.feature:nth-child(3n),.feature:nth-last-child(-n+3),.feature:nth-child(2n),.feature:nth-last-child(-n+2){min-height:0;padding:23px}.feature-icon{margin-bottom:18px}.showcase-grid{grid-template-columns:1fr}.showcase-card .shot-image{height:270px}.steps{grid-template-columns:1fr}.steps article{min-height:0}.brand-row span{font-size:12px}}
@media(prefers-reduced-motion:reduce){.feature,.steps article,.showcase-card,.brand-row span{transition:none}}
@media(max-width:1100px){.showcase-rows{height:calc(100svh - 210px);gap:12px}}
@media(max-width:760px){.showcase{padding-block:40px 28px}.showcase-rows{height:calc(100svh - 168px);min-height:360px;gap:8px;margin-bottom:18px}.showcase-rows .marquee-card{border-width:3px;border-radius:9px}}
.feature:nth-child(1),.feature:nth-child(3),.feature:nth-child(5){border-color:#173e49}

/* Katalog funkcji — ciemna sekcja jak ownership, białe boxy bez zmian */
.shopium-features{background:#122037;color:#fff;overflow:hidden}
.shopium-features .sf-head{max-width:800px;margin:0 0 48px}
.shopium-features h2{color:#fff}
.shopium-features h2 em{font-style:normal;color:var(--teal)}
.shopium-features .sf-head p{font-size:15px;line-height:1.85;color:#bac5d2;max-width:650px;margin:0}
.sf-desktop{display:grid;grid-template-columns:330px minmax(0,1fr);gap:22px}
.sf-nav{padding:12px;border:1px solid #dce6e7;border-radius:22px;background:#fff;box-shadow:0 20px 55px rgba(20,64,67,.045)}
.sf-nav button{width:100%;border:0;background:transparent;display:flex;gap:14px;align-items:center;text-align:left;padding:15px 16px;border-radius:12px;color:#52636b;cursor:pointer;transition:.2s}
.sf-nav button:hover{background:#edf7f6}
.sf-nav button[aria-selected=true]{background:#e0f4f1;color:#087e83;font-weight:700}
.sf-symbol{width:27px;height:27px;display:grid;place-items:center;font-size:18px;flex:none}
.sf-nav-label{flex:1;font-size:14px}
.sf-count{font-size:11px;opacity:.66}
.sf-panel{border:1px solid #d9e5e5;background:#fff;border-radius:24px;padding:36px 38px;min-height:560px;box-shadow:0 22px 70px rgba(18,59,63,.055);color:#172c36}
.sf-panel-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e5eded;padding-bottom:22px;margin-bottom:28px;gap:12px}
.sf-panel-title{font:800 26px/1.3 Manrope,sans-serif;letter-spacing:-.035em;color:#172c36}
.sf-panel-counter{font-size:12px;color:#7b8a90;background:#f1f6f5;padding:8px 12px;border-radius:50px;white-space:nowrap}
.sf-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 24px}
.sf-feature{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.5;color:#405761}
.sf-tick{display:inline-grid;place-items:center;flex:none;width:21px;height:21px;border-radius:7px;background:#def5f0;color:#008f8c;font-size:13px;font-weight:800}
.sf-mobile{display:none}
.sf-bottom{background:transparent;border:1px solid #ffffff1f;border-radius:20px;margin-top:24px;padding:28px 34px;display:flex;align-items:center;justify-content:space-between;gap:25px;color:#fff}
.sf-bottom div{display:flex;flex-direction:column;gap:7px}
.sf-bottom strong{font:700 17px Manrope,sans-serif}
.sf-bottom span{color:#afc4ca;font-size:12px;line-height:1.5}
.sf-cta{background:#0fc1bd;color:#052f32;border:0;border-radius:12px;padding:16px 22px;cursor:pointer;font-weight:800;white-space:nowrap;transition:transform .2s,background .2s}
.sf-cta:hover{background:#44d9d0;transform:translateY(-2px)}
.sf-cta span{color:inherit;font-size:18px;margin-left:8px}
@media(max-width:800px){
  .shopium-features .sf-head{margin-bottom:30px}
  .shopium-features .sf-head p{font-size:15px}
  .sf-desktop{display:none}
  .sf-mobile{display:flex;flex-direction:column;gap:10px}
  .sf-accordion-item{background:#fff;border:1px solid #dce6e7;border-radius:15px;overflow:hidden;box-shadow:0 6px 20px rgba(19,59,63,.025)}
  .sf-accordion-item.sf-open{border-color:#aedbd6;box-shadow:0 12px 35px rgba(11,130,133,.08)}
  .sf-accordion-trigger{background:transparent;border:0;padding:17px;display:flex;align-items:center;text-align:left;gap:12px;width:100%;cursor:pointer;color:#172c36}
  .sf-accordion-trigger .sf-label{display:flex;flex:1;flex-direction:column;gap:4px}
  .sf-accordion-trigger strong{font-size:14px;font-weight:700}
  .sf-accordion-trigger small{font-size:11px;color:#87969c}
  .sf-arrow{font-size:23px;color:#6e8489;transition:transform .2s}
  .sf-open .sf-arrow{transform:rotate(180deg);color:#0b9292}
  .sf-accordion-content{border-top:1px solid #e6eded;padding:19px 21px 23px;background:#fbfefd}
  .sf-accordion-content .sf-list{grid-template-columns:1fr;gap:15px}
  .sf-bottom{padding:25px;flex-direction:column;align-items:stretch}
  .sf-cta{white-space:normal;width:100%}
}
/* PrestaShop w liczbach — niski jasny pas między sekcjami granatowymi */
.stats{background:#fff;padding:52px 0 56px}
.stats h2{margin:0 0 14px;text-align:center;font-size:clamp(28px,3vw,40px);letter-spacing:-1.4px}
.stats h2 span{white-space:nowrap}
.stats p{max-width:760px;margin:0 auto 32px;text-align:center;font-size:15px;line-height:1.7;color:#516877}
.stats-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0}
.stats-row>div{position:relative;text-align:center;padding:2px 22px}
.stats-row>div+div:before{content:'';position:absolute;left:0;top:6px;bottom:6px;width:1px;background:#e1e8ec}
.stats-row dt{margin:0;font:800 clamp(28px,3.1vw,46px)/1 Manrope,sans-serif;letter-spacing:-1.6px;color:#122037;white-space:nowrap}
.stats-row dd{margin:12px 0 0;font-size:14px;line-height:1.45;color:#122236}
.stats-row dd span{color:#22baab}
@media(max-width:860px){
  .stats{padding:40px 0 44px}
  .stats h2{margin-bottom:12px}
  .stats p{margin-bottom:26px;font-size:14px}
  .stats-row{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
  .stats-row>div+div:before{display:none}
  .stats-row>div:nth-child(2n):before{display:block}
}
@media(max-width:420px){
  .stats-row>div{padding-inline:10px}
  .stats-row dt{font-size:26px;letter-spacing:-1.2px}
  .stats-row dd{font-size:13px}
}
/* Integracje — białe tło, ten sam układ menu / akordeon co funkcjonalności */
.integrations{background:#fff;padding-block:126px 118px}
.integrations .sf-head{max-width:860px;margin:0 0 56px}
.integrations h2 span{display:block}
.integrations .sf-head p{max-width:740px;margin:18px 0 0;font-size:16px;line-height:1.85;color:#516877}
.integrations .sf-desktop{grid-template-columns:minmax(280px,380px) minmax(0,1fr);gap:28px;align-items:start}
.integrations .sf-nav-label{line-height:1.35}
.integrations .sf-panel{min-height:0;padding:36px 44px 18px}
.ig-lead{margin:0 0 6px;max-width:680px;font-size:15px;line-height:1.75;color:#516877}
.ig-card{display:grid;grid-template-columns:168px minmax(0,1fr);gap:28px;align-items:center;padding:26px 0;border-top:1px solid #e7eeee}
.ig-card:first-child{border-top:0;padding-top:18px}
.ig-logo{height:76px;display:grid;place-items:center;padding:8px 12px;border:1px solid #e3ebea;border-radius:16px;background:#fff;box-shadow:0 10px 24px #102b2b08}
.ig-logo svg{display:block;width:132px;height:44px}
.ig-card h3{margin:0 0 8px;font:700 18px/1.3 Manrope,sans-serif;letter-spacing:-.03em;color:#122236}
.ig-card p{margin:0;font-size:14.5px;line-height:1.75;color:#516877}
.ig-note{margin:28px 0 0;padding:22px 26px;border:1px solid #d7ebe6;border-radius:16px;background:#f4faf8;color:#3d5560;font-size:14px;line-height:1.7}
.ig-note strong{color:#122236}
@media(max-width:800px){
  .integrations{padding-block:83px}
  .integrations .sf-head{margin-bottom:30px}
  .integrations .sf-panel{padding:28px 22px 12px}
  .ig-card{grid-template-columns:1fr;gap:14px;align-items:start;padding:22px 0}
  .ig-logo{width:168px;height:76px}
  .ig-note{padding:18px 18px}
}