/* assets/css/products.css */
:root {
  --orange: #e8720c; --green: #5cb93c; --dark: #0e0e0e;
  --grey: #f4f4f4; --text: #1a1a1a; --muted: #666;
}

.pr-hero { background: var(--dark); padding: 130px 40px 80px; position: relative; overflow: hidden; text-align: center; }
.pr-hero__inner { position: relative; z-index: 2; max-width: 720px; margin: 0 auto; }
.pr-eyebrow { display: inline-block; font-family:'Montserrat',sans-serif; font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--green); margin-bottom:16px; }
.pr-hero__title { font-family:'Montserrat',sans-serif; font-weight:900; font-size:clamp(2.2rem,5vw,3.8rem); color:#fff; line-height:1.1; margin:0 0 20px; }
.pr-hero__title em { font-style:normal; color:var(--orange); }
.pr-hero__sub { font-family:'Montserrat',sans-serif; font-size:clamp(.95rem,2vw,1.1rem); color:rgba(255,255,255,.6); line-height:1.75; }
.pr-hero__shape { position:absolute; bottom:-1px; left:0; right:0; height:60px; background:linear-gradient(to bottom right, transparent 49%, var(--grey) 50%); }

.pr-grid-section { background:var(--grey); padding:60px 40px 80px; }
.pr-grid { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:repeat(2,1fr); gap:32px; }

.pr-card { background:#fff; border-radius:12px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 4px 24px rgba(0,0,0,.07); position:relative; transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s; }
.pr-card:hover { transform:translateY(-6px); box-shadow:0 14px 44px rgba(0,0,0,.13); }
.pr-card--soon { opacity:.8; }
.pr-ribbon { position:absolute; top:12px; right:12px; background:var(--orange); color:#fff; font-family:'Montserrat',sans-serif; font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:4px 12px; border-radius:4px; z-index:3; }

/* Browser */
.pr-browser { background:#1a1a1a; }
.pr-browser__bar { display:flex; align-items:center; gap:6px; background:#2a2a2a; padding:10px 14px; height:36px; }
.pr-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.pr-dot--r{background:#ff5f57;} .pr-dot--y{background:#ffbd2e;} .pr-dot--g{background:#27c93f;}
.pr-browser__url { flex:1; background:#3a3a3a; border-radius:4px; font-family:'Montserrat',sans-serif; font-size:10px; color:rgba(255,255,255,.35); padding:3px 10px; }
.pr-browser__screen { position:relative; display:flex; height:220px; overflow:hidden; }
.pr-ss { position:relative; overflow:hidden; height:100%; }
.pr-ss--left{width:45%;} .pr-ss--right{width:55%;}
.pr-ss img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; object-position:top; }
.pr-diag { position:absolute; top:0; left:calc(45% - 14px); width:28px; height:100%; z-index:2; background:linear-gradient(to bottom,var(--green),var(--orange)); clip-path:polygon(30% 0,100% 0,70% 100%,0% 100%); }

/* Card body */
.pr-card__body { padding:24px 24px 28px; display:flex; flex-direction:column; gap:10px; flex:1; }
.pr-card__top { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.pr-badge { font-family:'Montserrat',sans-serif; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:4px 10px; border-radius:4px; }
.pr-badge--cat { background:var(--dark); color:var(--green); }
.pr-badge--featured { background:var(--orange); color:#fff; }
.pr-price { font-family:'Montserrat',sans-serif; font-size:13px; font-weight:800; color:var(--green); white-space:nowrap; }
.pr-card__name { font-family:'Montserrat',sans-serif; font-weight:900; font-size:clamp(1.1rem,1.6vw,1.3rem); color:var(--text); margin:0; }
.pr-card__tagline { font-family:'Montserrat',sans-serif; font-size:.88rem; font-weight:700; color:var(--orange); margin:0; }
.pr-card__desc { font-family:'Montserrat',sans-serif; font-size:.85rem; color:var(--muted); line-height:1.65; margin:0; }
.pr-features { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:6px 12px; }
.pr-features li { font-family:'Montserrat',sans-serif; font-size:.82rem; font-weight:600; color:var(--text); display:flex; align-items:center; gap:6px; }
.pr-check { color:var(--green); flex-shrink:0; }
.pr-card__actions { margin-top:8px; }
.pr-btn { display:inline-block; font-family:'Montserrat',sans-serif; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:12px 24px; border-radius:0; text-decoration:none; transition:all .2s; }
.pr-btn--primary { background:var(--dark); color:#fff; }
.pr-btn--primary:hover { background:var(--orange); }
.pr-btn--disabled { background:var(--grey); color:var(--muted); cursor:default; }

.pr-empty { grid-column:1/-1; text-align:center; font-family:'Montserrat',sans-serif; color:var(--muted); padding:60px 0; }

/* Custom CTA */
.pr-custom { background:var(--dark); padding:70px 40px; }
.pr-custom__inner { max-width:1000px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap; }
.pr-custom__text h2 { font-family:'Montserrat',sans-serif; font-weight:900; font-size:clamp(1.6rem,3vw,2.2rem); color:#fff; margin:0 0 10px; }
.pr-custom__text h2 em { font-style:normal; color:var(--orange); }
.pr-custom__text p { font-family:'Montserrat',sans-serif; font-size:.9rem; color:rgba(255,255,255,.55); max-width:480px; line-height:1.7; margin:0; }
.pr-custom__btn { display:inline-block; background:var(--green); color:#fff; font-family:'Montserrat',sans-serif; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:16px 36px; text-decoration:none; white-space:nowrap; transition:background .2s; flex-shrink:0; }
.pr-custom__btn:hover { background:#4aa82f; }

@media(max-width:900px){ .pr-grid{grid-template-columns:1fr 1fr;gap:20px;} .pr-custom__inner{flex-direction:column;text-align:center;} }
@media(max-width:600px){ .pr-hero,.pr-grid-section,.pr-custom{padding-left:16px;padding-right:16px;} .pr-grid{grid-template-columns:1fr;} .pr-features{grid-template-columns:1fr;} }
@media(prefers-reduced-motion:reduce){ *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;} }