

.ppd-hero{
  position:relative;overflow:hidden;
  padding:clamp(34px,4.2vw,58px) 0 clamp(40px,4.6vw,64px);
  background:
    radial-gradient(760px 380px at 88% -8%,rgba(55,168,106,.14),transparent 62%),
    radial-gradient(620px 320px at 4% 12%,rgba(200,163,92,.12),transparent 58%),
    linear-gradient(180deg,#f7fbf8 0%,#eef5f0 100%);
}
.ppd-hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(16,40,28,.12),transparent);
}
.ppd-crumb{display:flex;align-items:center;gap:9px;font-size:13px;color:#4d5a53;flex-wrap:wrap}
.ppd-crumb a{color:#333333;text-decoration:none;transition:color .25s}
.ppd-crumb a:hover{color:var(--primary)}
.ppd-crumb i{font-style:normal;opacity:.4}
.ppd-crumb span{color:var(--fx-title);font-weight:600}

.ppd-hero-grid{
  display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(24px,3vw,48px);align-items:center;margin-top:26px;
}
.ppd-badge{
  display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;
  background:linear-gradient(135deg,#f6ecd4,#eee0c0);color:#7d6129;
  font-size:12.5px;font-weight:800;letter-spacing:.1em;
}
.ppd-badge svg{width:13px;height:13px}
.ppd-title{
  margin:16px 0 0;font-size:clamp(27px,3.4vw,44px);line-height:1.24;font-weight:800;
  letter-spacing:-.6px;color:var(--fx-title);
}
.ppd-title em{
  font-style:normal;background:linear-gradient(120deg,#1f7d4d,#37a86a 62%,#1f7d4d);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.ppd-lead{margin:16px 0 0;font-size:15px;line-height:2;color:#1a1a1a;max-width:640px}
.ppd-tags{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0}
.ppd-tags span{
  display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:9px;
  background:#fff;border:1px solid #e2ece6;font-size:12.5px;font-weight:600;color:#26332c;
}
.ppd-tags svg{width:13px;height:13px;color:var(--primary)}
.ppd-facts{display:flex;flex-wrap:wrap;gap:26px;margin:26px 0 0;padding:0;list-style:none}
.ppd-fact{border-left:2px solid #d9e9df;padding-left:14px}
.ppd-fact b{display:block;font-size:22px;font-weight:800;color:var(--fx-title);letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.ppd-fact b small{font-size:12.5px;font-weight:600;color:#4d5a53;margin-left:2px}
.ppd-fact i{display:block;margin-top:4px;font-style:normal;font-size:12.5px;color:#5f6b64}
.ppd-hero-act{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 0}

.ppd-visual{position:relative}
.ppd-media{
  position:relative;border-radius:20px;overflow:hidden;min-height:330px;
  background:
    radial-gradient(80% 60% at 70% 10%,rgba(55,168,106,.5),transparent 62%),
    linear-gradient(155deg,#0d2a20,#17452f 58%,#1f5a3a);
  box-shadow:0 30px 60px -34px rgba(16,40,28,.6);
  display:grid;place-items:center;
}
.ppd-media img{width:100%;height:100%;min-height:330px;object-fit:cover;display:block}
.ppd-media-fallback{position:relative;width:100%;height:100%;min-height:330px;display:grid;place-items:center}
.ppd-media-fallback::before{
  content:"";position:absolute;inset:0;opacity:.35;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(circle at 60% 40%,#000,transparent 76%);
  -webkit-mask-image:radial-gradient(circle at 60% 40%,#000,transparent 76%);
}
.ppd-media-fallback svg{width:132px;height:132px;color:rgba(255,255,255,.5);position:relative}
.ppd-media-tip{position:absolute;left:18px;bottom:16px;font-size:12px;color:rgba(255,255,255,.55);letter-spacing:.04em}
.ppd-media-tag{
  position:absolute;top:16px;left:16px;padding:6px 12px;border-radius:999px;
  background:rgba(8,26,18,.55);border:1px solid rgba(255,255,255,.18);
  color:#fff;font-size:12px;font-weight:700;backdrop-filter:blur(6px);
}
.ppd-price-chip{
  position:absolute;right:16px;bottom:16px;padding:12px 18px;border-radius:14px;
  background:rgba(255,255,255,.94);box-shadow:0 18px 34px -18px rgba(16,40,28,.5);
  backdrop-filter:blur(8px);text-align:right;
}
.ppd-price-chip b{display:block;font-size:24px;font-weight:800;color:var(--fx-title);letter-spacing:-1px;font-variant-numeric:tabular-nums}
.ppd-price-chip b i{font-style:normal;font-size:13px;font-weight:700;color:var(--primary);margin-right:2px}
.ppd-price-chip span{display:block;font-size:11.5px;color:#4d5a53;margin-top:2px}

.ppd-main{padding:clamp(46px,5vw,78px) 0 clamp(56px,6vw,92px);background:#fff}
.ppd-layout{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(300px,.86fr);gap:clamp(24px,3vw,44px);align-items:start}
.ppd-blocks{min-width:0}

.ppd-block{margin:0 0 clamp(38px,4vw,58px);scroll-margin-top:96px}
.ppd-block:last-child{margin-bottom:0}
.ppd-bhead{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.ppd-no{
  flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(140deg,#eef7f1,#dcefe2);border:1px solid #dbebe1;
  font-size:13px;font-weight:800;color:var(--primary-dark);font-variant-numeric:tabular-nums;
}
.ppd-bhead h2{margin:0;font-size:clamp(20px,2.2vw,26px);font-weight:800;color:var(--fx-title);letter-spacing:-.3px}
.ppd-bhead p{margin:4px 0 0;font-size:12.5px;color:#5f6b64;letter-spacing:.02em}
.ppd-text{margin:0 0 14px;font-size:14.5px;line-height:2;color:#1a1a1a}
.ppd-text strong{color:var(--fx-title);font-weight:700}

.ppd-kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0 0}
.ppd-kpi-item{padding:16px 14px;border-radius:13px;background:#f7fbf8;border:1px solid #e8f1eb}
.ppd-kpi-item b{display:block;font-size:19px;font-weight:800;color:var(--fx-title);letter-spacing:-.4px;font-variant-numeric:tabular-nums}
.ppd-kpi-item b small{font-size:12px;font-weight:600;color:#4d5a53;margin-left:1px}
.ppd-kpi-item i{display:block;margin-top:5px;font-style:normal;font-size:12px;color:#5f6b64}

.ppd-table-wrap{border:1px solid #e6efe9;border-radius:16px;overflow:hidden;background:#fff}
.ppd-table-scroll{overflow-x:auto}
.ppd-table{width:100%;border-collapse:collapse;font-size:14px;min-width:620px}
.ppd-table thead th{
  padding:13px 16px;text-align:left;background:#f5faf7;border-bottom:1px solid #e6f0ea;
  font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#4d5a53;white-space:nowrap;
}
.ppd-table tbody td{padding:14px 16px;border-bottom:1px solid #f1f6f2;color:#1a1a1a;vertical-align:middle}
.ppd-table tbody tr:hover td{background:#fbfdfb}
.ppd-table .td-name{font-weight:700;color:var(--fx-title)}
.ppd-table .td-qty{font-weight:800;color:var(--primary-dark);font-variant-numeric:tabular-nums;white-space:nowrap}
.ppd-table tfoot td{padding:15px 16px;background:#f6fbf8;border-top:1px solid #e2efe7;font-weight:800;color:var(--fx-title)}
.ppd-table tfoot td span{font-weight:600;font-size:12px;color:#4d5a53}
.ppd-table-note{margin:12px 0 0;font-size:12.5px;line-height:1.85;color:#5f6b64}

.ppd-flow{margin:0;padding:0;list-style:none;display:grid;gap:0}
.ppd-flow li{position:relative;padding:0 0 22px 44px}
.ppd-flow li::before{
  content:"";position:absolute;left:13px;top:26px;bottom:0;width:1px;
  background:linear-gradient(180deg,#cfe4d8,rgba(207,228,216,0));
}
.ppd-flow li:last-child{padding-bottom:0}
.ppd-flow li:last-child::before{display:none}
.ppd-flow .step-dot{
  position:absolute;left:0;top:2px;width:27px;height:27px;border-radius:50%;
  display:grid;place-items:center;background:#fff;border:1.5px solid #cfe4d8;
  font-size:11.5px;font-weight:800;color:var(--primary-dark);font-variant-numeric:tabular-nums;
}
.ppd-flow h3{margin:0 0 6px;font-size:15px;font-weight:800;color:var(--fx-title)}
.ppd-flow p{margin:0;font-size:13.8px;line-height:1.9;color:#222222}
.ppd-flow .step-time{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:6px;background:#f1f8f3;font-size:11.5px;font-weight:700;color:var(--primary-dark);vertical-align:1px}

.ppd-density{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ppd-density-card{padding:20px 18px;border-radius:14px;border:1px solid #e6efe9;background:linear-gradient(180deg,#fbfdfc,#f6faf8)}
.ppd-density-card h3{margin:0 0 6px;font-size:14.5px;font-weight:800;color:var(--fx-title)}
.ppd-density-card .dv{font-size:19px;font-weight:800;color:var(--primary-dark);font-variant-numeric:tabular-nums}
.ppd-density-card p{margin:8px 0 0;font-size:12.8px;line-height:1.8;color:#333333}

.ppd-addons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ppd-addon{
  position:relative;display:block;padding:18px 16px 16px;border-radius:14px;border:1px solid #e6efe9;background:#fff;
  cursor:pointer;transition:border-color .26s,box-shadow .26s,transform .26s;
}
.ppd-addon:hover{border-color:#c8e0d2;box-shadow:0 14px 28px -22px rgba(16,40,28,.32);transform:translateY(-2px)}
.ppd-addon input{position:absolute;opacity:0;pointer-events:none}
.ppd-addon input:checked ~ .ppd-addon-box{border-color:#1f7d4d;box-shadow:0 0 0 2px rgba(31,125,77,.14) inset}
.ppd-addon-box{position:absolute;inset:0;border-radius:14px;pointer-events:none;transition:border-color .26s,box-shadow .26s}
.ppd-addon h3{position:relative;margin:0 0 6px;font-size:14px;font-weight:800;color:var(--fx-title)}
.ppd-addon p{position:relative;margin:0;font-size:12.5px;line-height:1.75;color:#333333}
.ppd-addon .ad-price{position:relative;display:block;margin-top:10px;font-size:13px;font-weight:800;color:var(--primary-dark);font-variant-numeric:tabular-nums}
.ppd-addon .ad-check{
  position:absolute;top:14px;right:14px;width:18px;height:18px;border-radius:6px;
  border:1.5px solid #cfe0d6;background:#fff;display:grid;place-items:center;transition:all .2s;
}
.ppd-addon input:checked ~ .ad-check{background:var(--primary);border-color:var(--primary)}
.ppd-addon input:checked ~ .ad-check::after{
  content:"";width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;
  transform:rotate(-45deg) translateY(-1px);
}

.ppd-std{width:100%;border-collapse:collapse;font-size:13.8px}
.ppd-std th,.ppd-std td{padding:12px 14px;border:1px solid #e9f1ec;text-align:left;vertical-align:top}
.ppd-std thead th{background:#f5faf7;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#4d5a53;font-weight:800}
.ppd-std tbody th{width:170px;background:#fbfdfc;font-weight:700;color:var(--fx-title);white-space:nowrap}
.ppd-std td{color:#1a1a1a;line-height:1.85}

.ppd-faq{display:grid;gap:10px}
.ppd-faq-item{border:1px solid #e6efe9;border-radius:12px;background:#fff;overflow:hidden;transition:border-color .26s,box-shadow .26s}
.ppd-faq-item[open]{border-color:#c6ded1;box-shadow:0 12px 26px -22px rgba(16,40,28,.3)}
.ppd-faq-item summary{
  display:flex;align-items:center;gap:10px;padding:15px 18px;cursor:pointer;list-style:none;
  font-size:14px;font-weight:700;color:var(--fx-title);line-height:1.6;
}
.ppd-faq-item summary::-webkit-details-marker{display:none}
.ppd-faq-item summary::after{
  content:"+";margin-left:auto;flex:none;width:21px;height:21px;border-radius:50%;
  display:grid;place-items:center;font-size:14px;font-weight:700;color:var(--primary);
  background:#eff8f2;border:1px solid #dcece2;transition:transform .26s;
}
.ppd-faq-item[open] summary::after{content:"−";transform:rotate(180deg)}
.ppd-faq-a{padding:0 18px 16px;font-size:13.5px;line-height:1.95;color:#222222}

.ppd-rel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ppd-rel-card{
  display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:12px;
  border:1px solid #e6efe9;background:#fff;text-decoration:none;transition:all .26s;
}
.ppd-rel-card:hover{border-color:#bfdcc9;background:#f8fdf9;transform:translateY(-2px)}
.ppd-rel-card b{font-size:14px;font-weight:800;color:var(--fx-title)}
.ppd-rel-card span{font-size:12.5px;color:#4d5a53}
.ppd-rel-card em{font-style:normal;font-size:15px;font-weight:800;color:var(--primary-dark);font-variant-numeric:tabular-nums}
.ppd-rel-card.is-current{border-color:#1f7d4d;box-shadow:0 0 0 2px rgba(31,125,77,.1) inset}

.ppd-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:14px}
.ppd-quote{
  border-radius:18px;overflow:hidden;color:#fff;
  background:
    radial-gradient(420px 240px at 100% 0%,rgba(200,163,92,.24),transparent 62%),
    linear-gradient(155deg,#0d2a1f 0%,#103024 54%,#174530 100%);
  box-shadow:0 26px 54px -30px rgba(16,40,28,.62);
}
.ppd-q-head{padding:22px 22px 16px;border-bottom:1px solid rgba(255,255,255,.1)}
.ppd-q-kicker{font-size:11px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:#e2c791}
.ppd-q-price{display:flex;align-items:baseline;gap:4px;margin-top:9px}
.ppd-q-price i{font-style:normal;font-size:18px;font-weight:700;color:#e2c791}
.ppd-q-price b{font-size:42px;line-height:1;font-weight:800;letter-spacing:-1.8px;font-variant-numeric:tabular-nums}
.ppd-q-price span{font-size:12.5px;color:rgba(255,255,255,.6)}
.ppd-q-sub{margin:7px 0 0;font-size:12px;color:rgba(255,255,255,.55)}
.ppd-q-rows{padding:14px 22px 2px}
.ppd-qrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px dashed rgba(255,255,255,.13);font-size:13px}
.ppd-qrow:last-child{border-bottom:0}
.ppd-qrow .k{color:rgba(255,255,255,.6)}
.ppd-qrow .v{font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.ppd-qrow .v.gold{color:#f0dfae}

.ppd-calc{padding:16px 22px 0;border-top:1px solid rgba(255,255,255,.1)}
.ppd-calc h3{margin:0 0 10px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.ppd-calc-area{display:flex;align-items:center;gap:8px}
.ppd-calc-area input{
  width:100%;height:38px;padding:0 12px;border-radius:9px;border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.07);color:#fff;font-size:13.5px;font-weight:600;outline:none;
  font-variant-numeric:tabular-nums;
}
.ppd-calc-area input::placeholder{color:rgba(255,255,255,.4)}
.ppd-calc-area input:focus{border-color:rgba(226,199,145,.6);background:rgba(255,255,255,.1)}
.ppd-calc-area span{flex:none;font-size:12.5px;color:rgba(255,255,255,.5)}
.ppd-calc-result{margin:10px 0 0;font-size:12.5px;line-height:1.7;color:rgba(255,255,255,.72)}
.ppd-calc-result b{color:#f0dfae;font-weight:800}
.ppd-q-foot{padding:14px 22px 22px}
.ppd-q-foot .ppd-btn{width:100%}
.ppd-q-foot .ppd-btn + .ppd-btn{margin-top:9px}
.ppd-q-trust{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.ppd-q-trust span{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);font-size:11px;color:rgba(255,255,255,.7)}
.ppd-q-trust svg{width:11px;height:11px;color:#8fd6a9}

.ppd-side-card{
  padding:18px 20px;border-radius:14px;border:1px solid #e6efe9;background:#f8fcf9;
}
.ppd-side-card h3{margin:0 0 10px;font-size:13px;font-weight:800;color:var(--fx-title);letter-spacing:.02em}
.ppd-side-card ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.ppd-side-card li{display:flex;align-items:flex-start;gap:8px;font-size:12.8px;line-height:1.7;color:#222222}
.ppd-side-card li svg{width:13px;height:13px;flex:none;margin-top:3px;color:var(--primary)}
.ppd-side-card .tel{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:15px;font-weight:800;color:var(--primary-dark);text-decoration:none}
.ppd-side-card .tel svg{width:15px;height:15px}

.ppd-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;
  border-radius:10px;font-size:14px;font-weight:700;text-decoration:none;border:1px solid transparent;
  cursor:pointer;transition:all .26s ease;
}
.ppd-btn.solid{color:#fff;background:linear-gradient(135deg,#1f7d4d,#2a9d63);box-shadow:0 10px 22px -12px rgba(31,125,77,.9)}
.ppd-btn.solid:hover{transform:translateY(-1px);box-shadow:0 16px 28px -14px rgba(31,125,77,.95)}
.ppd-btn.ghost{color:var(--primary-dark);background:#f4faf6;border-color:#d9ebe0}
.ppd-btn.ghost:hover{background:#eaf6ee;border-color:#bfdcc9}
.ppd-btn.gold{background:linear-gradient(135deg,#d9b972,#c8a35c);color:#2a1f0c;box-shadow:0 12px 26px -14px rgba(200,163,92,.9)}
.ppd-btn svg{width:15px;height:15px}

.ppd-cta{
  position:relative;overflow:hidden;border-radius:20px;padding:clamp(28px,3.6vw,46px);color:#fff;
  background:
    radial-gradient(560px 300px at 92% -12%,rgba(200,163,92,.26),transparent 62%),
    linear-gradient(140deg,#0d2a20 0%,#123728 52%,#194a33 100%);
  display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;
}
.ppd-cta h2{position:relative;margin:0;font-size:clamp(21px,2.4vw,28px);font-weight:800;line-height:1.36}
.ppd-cta p{position:relative;margin:10px 0 0;font-size:13.8px;line-height:1.9;color:rgba(255,255,255,.7);max-width:620px}
.ppd-cta-act{position:relative;display:flex;flex-wrap:wrap;gap:11px}
.ppd-cta-act .ppd-btn{height:46px;padding:0 24px}
.ppd-cta-act .ppd-btn.ghost{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.ppd-cta-act .ppd-btn.ghost:hover{background:rgba(255,255,255,.15)}

.ppd-reveal{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s cubic-bezier(.4,0,.2,1)}
.ppd-reveal.ppd-in{opacity:1;transform:none}

@media(max-width:1200px){
  .ppd-layout{grid-template-columns:1fr}
  .ppd-side{position:static;flex-direction:row;flex-wrap:wrap}
  .ppd-quote{flex:1 1 340px}
  .ppd-side-card{flex:1 1 260px}
  .ppd-hero-grid{grid-template-columns:1fr}
  .ppd-visual{order:-1}
}
@media(max-width:900px){
  .ppd-kpi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ppd-density,.ppd-addons,.ppd-rel{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:768px){
  .ppd-hero{padding:26px 0 34px}
  .ppd-media-tip{display:none}
  .ppd-title{font-size:26px}
  .ppd-lead{font-size:14px}
  .ppd-facts{gap:16px}
  .ppd-fact b{font-size:19px}
  .ppd-media,.ppd-media img,.ppd-media-fallback{min-height:230px}
  .ppd-media-fallback svg{width:88px;height:88px}
  .ppd-main{padding:38px 0 50px}
  .ppd-bhead{gap:11px}
  .ppd-no{width:32px;height:32px;font-size:12px}
  .ppd-kpi{gap:9px}
  .ppd-density,.ppd-addons,.ppd-rel{grid-template-columns:1fr}
  .ppd-std tbody th{width:120px;white-space:normal}
  .ppd-side{flex-direction:column}
  .ppd-cta{padding:24px 20px;border-radius:16px}
  .ppd-cta-act{width:100%}
  .ppd-cta-act .ppd-btn{flex:1}
}
@media(prefers-reduced-motion:reduce){
  .ppd-addon,.ppd-rel-card,.ppd-btn{transition:none}
}
