.commerce-page { width:min(1260px,calc(100% - 48px)); margin:0 auto; padding:12px 0 42px; }
.commerce-page .breadcrumbs { padding:10px 0 16px; }
.commerce-hero { position:relative; isolation:isolate; min-height:260px; display:flex; align-items:center; overflow:hidden; padding:34px clamp(25px,5vw,54px); border:4px solid #fffef1; border-radius:25px; background:#245d3d; box-shadow:0 0 0 3px #38873c,0 12px 27px #315a3030; color:#fffdf0; }
.commerce-hero::before { position:absolute; z-index:-2; inset:0; background:url('../images/kwaakdam-havenplein-autumn-evening.webp') center 47%/cover; content:""; }
.commerce-hero::after { position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#123f35ed 0%,#174c3cc9 58%,#173f3470 100%); content:""; }
.commerce-hero > div { max-width:730px; }
.commerce-hero .hero-kicker { display:inline-flex; align-items:center; gap:9px; color:#e9f2b6; font-size:10px; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.commerce-hero .hero-kicker::before { width:20px; height:3px; border-radius:3px; background:#ffc941; content:""; }
.commerce-hero h1 { margin:10px 0 9px; color:#fffdf0; font-size:clamp(34px,4.7vw,52px); line-height:1.02; letter-spacing:-.045em; }
.commerce-hero p { max-width:650px; margin:0; color:#edf3dc; font-size:14px; line-height:1.65; }
.commerce-trust { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.commerce-trust span { display:inline-flex; align-items:center; padding:7px 10px; border:1px solid #ffffff50; border-radius:999px; background:#143d347a; color:#fffde8; font-size:10px; font-weight:800; }
.commerce-section { padding-top:32px; }
.commerce-section .section-heading h2 { color:#174e37; font-size:clamp(25px,3vw,32px); }
.commerce-section .section-heading p { color:#627c72; }
.commerce-skin-grid { margin-top:16px; grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr)); }
.commerce-package-grid { margin-top:19px; }
.commerce-package-grid .maize-package-card { min-height:274px; }
.maize-product-mark { display:block; width:80px; height:80px; margin:3px auto 8px; filter:drop-shadow(0 5px 4px #475f2425); }
.maize-product-mark img { display:block; width:100%; height:100%; object-fit:contain; }
.commerce-package-grid .maize-price { margin:6px 0 0; color:#244f34; font-size:25px; font-weight:900; }
.commerce-package-grid .maize-price small { color:#7b8a73; font-size:10px; font-weight:700; }
.maize-package-copy { min-height:34px; margin:3px 0 13px; color:#6e806e; font-size:11px; }
.commerce-package-grid .button { width:100%; min-height:40px; margin-top:auto; }
.commerce-login { margin-top:26px; padding:20px; border:1px solid #d4e2b7; border-radius:18px; background:#f4f8e6; }
.commerce-login-heading { margin:0 auto 12px; }
.commerce-login-heading h2 { margin:5px 0; color:#174e37; font-size:21px; }
.commerce-login-heading p { margin:0; color:#6b8072; font-size:12px; }
.commerce-login .shared-portal-card { max-width:830px; width:100%; }
.commerce-login[hidden] { display:none!important; }
.purchase-note { display:flex; align-items:flex-start; gap:10px; margin-top:19px; padding:13px 15px; border:1px solid #e2d18d; border-radius:13px; background:#fff4c8; color:#6f5c27; font-size:11px; line-height:1.55; }
.maize-status-refresh,.maize-shop-notice { margin-top:13px; }
@media(max-width:760px) { .commerce-page { width:calc(100% - 28px); }.commerce-hero { min-height:255px; padding:26px 22px; }.commerce-section .section-heading { align-items:flex-start; flex-direction:column; }.commerce-package-grid { grid-template-columns:1fr; }.commerce-package-grid .maize-package-card { min-height:250px; }.commerce-skin-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr)); gap:9px; } }
