/* hp:clone-css:start */
:root{
--dark-green:#1b5e20;
--mid-green:#2e7d32;
--accent-green:#28a745;
--light-green-bg:#e8f5e9;
--text-gray:#333;
--muted-gray:#667;
}
*{box-sizing:border-box;}
body{
font-family:Arial,sans-serif;
margin:0;
background:#f4f6f8;
color:#333;
}
header{
background:#0f3d13;
color:#fff;
padding:16px 20px;
text-align:center;
font-size:14px;
letter-spacing:.5px;
}
header p{
margin:2px 0 0;
opacity:.85;
font-size:12px;
}
.container{
max-width:960px;
margin:auto;
padding:0 20px 40px;
}
h1,h2{
text-align:center;
}
/* ===== HERO BANNER ===== */
.hero-banner{
position:relative;
overflow:hidden;
background:linear-gradient(135deg,#0f3d13 0%,#1b5e20 45%,#2e7d32 100%);
padding:70px 20px 90px;
text-align:center;
color:#fff;
}
.hero-banner::before{
content:"";
position:absolute;
top:-120px;
right:-120px;
width:420px;
height:420px;
border-radius:50%;
background:rgba(255,255,255,0.06);
}
.hero-banner::after{
content:"";
position:absolute;
bottom:-160px;
left:-100px;
width:380px;
height:380px;
border-radius:50%;
background:rgba(40,167,69,0.18);
}
.hero-inner{
position:relative;
z-index:2;
max-width:760px;
margin:0 auto;
}
.hero-badge{
display:inline-block;
background:rgba(255,255,255,0.12);
border:1px solid rgba(255,255,255,0.3);
color:#fff;
font-size:12px;
letter-spacing:1px;
text-transform:uppercase;
padding:6px 16px;
border-radius:20px;
margin-bottom:22px;
}
.hero-banner h1{
font-size:38px;
line-height:1.25;
margin:0 0 18px;
text-shadow:0 2px 10px rgba(0,0,0,.15);
}
.hero-banner p.lead{
font-size:17px;
line-height:1.6;
color:rgba(255,255,255,0.92);
max-width:600px;
margin:0 auto 26px;
}
.trust-row{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:10px;
margin:26px 0 6px;
}
.trust-pill{
display:flex;
align-items:center;
gap:6px;
background:rgba(255,255,255,0.1);
border:1px solid rgba(255,255,255,0.25);
color:#fff;
font-size:12.5px;
padding:7px 14px;
border-radius:20px;
}
.price{
font-size:44px;
color:#fff;
font-weight:bold;
margin:22px 0 8px;
}
.price span{
font-size:16px;
font-weight:normal;
opacity:.8;
display:block;
margin-top:2px;
}
.button{
display:inline-block;
background:#28a745;
color:#fff;
padding:16px 40px;
text-decoration:none;
border-radius:6px;
font-weight:bold;
font-size:16px;
box-shadow:0 6px 18px rgba(0,0,0,.25);
}
.hero-wave{
position:absolute;
bottom:-1px;
left:0;
width:100%;
line-height:0;
}
/* ===== SECTIONS ===== */
.section-wrap{
padding:44px 0 4px;
}
.section-label{
text-align:center;
color:var(--accent-green);
font-size:12.5px;
letter-spacing:1.5px;
text-transform:uppercase;
font-weight:bold;
margin-bottom:6px;
}
h2{
margin-top:0;
}
.box{
background:#fff;
padding:28px;
margin:20px 0;
border-radius:10px;
box-shadow:0 2px 10px rgba(0,0,0,.07);
}
ul{
padding-left:20px;
}
/* Included list as cards */
.included-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:12px;
list-style:none;
padding:0;
margin:0;
}
.included-grid li{
display:flex;
align-items:flex-start;
gap:10px;
background:var(--light-green-bg);
padding:12px 14px;
border-radius:8px;
font-size:14.5px;
}
.included-grid li .check{
color:var(--dark-green);
font-weight:bold;
}
/* How it works steps */
.steps-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
margin-top:18px;
}
.step-card{
text-align:center;
padding:10px;
}
.step-num{
width:42px;
height:42px;
border-radius:50%;
background:var(--dark-green);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-weight:bold;
margin:0 auto 12px;
font-size:16px;
}
.step-card h3{
font-size:15px;
color:var(--dark-green);
margin:0 0 6px;
}
.step-card p{
font-size:13.5px;
color:#555;
line-height:1.5;
margin:0;
}
/* Research section */
.research-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
margin-top:10px;
}
.stat-card{
background:#fff;
border:1px solid #e3e8e4;
border-radius:10px;
padding:20px 16px;
text-align:center;
}
.stat-num{
font-size:28px;
font-weight:bold;
color:var(--dark-green);
margin-bottom:4px;
}
.stat-label{
font-size:12.5px;
color:#555;
line-height:1.4;
margin-bottom:10px;
}
.stat-source{
font-size:10.5px;
color:#999;
text-transform:uppercase;
letter-spacing:.5px;
}
.research-note{
font-size:12.5px;
color:#777;
text-align:center;
margin-top:18px;
line-height:1.6;
}
/* Who it's for */
.audience-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:12px;
margin-top:14px;
}
.audience-card{
display:flex;
gap:10px;
align-items:flex-start;
background:#fafafa;
border-left:3px solid var(--accent-green);
padding:12px 14px;
border-radius:6px;
font-size:14px;
}
/* Final CTA */
.final-cta{
background:linear-gradient(135deg,#1b5e20,#2e7d32);
border-radius:12px;
padding:44px 24px;
text-align:center;
color:#fff;
margin:36px 0 10px;
}
.final-cta h2{
color:#fff;
margin-bottom:10px;
}
.final-cta p{
color:rgba(255,255,255,.9);
max-width:520px;
margin:0 auto 22px;
}
footer{
background:#222;
color:#ccc;
padding:30px;
font-size:13px;
margin-top:40px;
}
footer a{
color:#fff;
text-decoration:none;
margin-right:15px;
}
/* Guarantee box */
.guarantee-box{
display:flex;
align-items:center;
gap:20px;
background:#fff;
border:2px solid var(--light-green-bg);
border-radius:12px;
padding:26px 28px;
margin:20px 0;
}
.guarantee-icon{
flex-shrink:0;
width:64px;
height:64px;
border-radius:50%;
background:var(--light-green-bg);
display:flex;
align-items:center;
justify-content:center;
}
.guarantee-icon svg{
width:32px;
height:32px;
}
.guarantee-box h3{
margin:0 0 6px;
color:var(--dark-green);
font-size:17px;
}
.guarantee-box p{
margin:0;
font-size:14px;
color:#555;
line-height:1.55;
}
/* Accordion (legal sections) */
.legal-wrap{
margin:36px 0 10px;
}
.legal-wrap-title{
text-align:center;
font-size:13px;
color:#888;
text-transform:uppercase;
letter-spacing:1px;
margin-bottom:14px;
}
details.policy-accordion{
background:#fff;
border-radius:8px;
box-shadow:0 2px 8px rgba(0,0,0,.06);
margin-bottom:10px;
scroll-margin-top:20px;
overflow:hidden;
}
details.policy-accordion summary{
list-style:none;
cursor:pointer;
padding:16px 20px;
font-weight:bold;
color:var(--dark-green);
font-size:15px;
display:flex;
justify-content:space-between;
align-items:center;
}
details.policy-accordion summary::-webkit-details-marker{
display:none;
}
details.policy-accordion summary::after{
content:"+";
font-size:20px;
font-weight:normal;
color:var(--accent-green);
transition:transform .2s ease;
}
details.policy-accordion[open] summary::after{
transform:rotate(45deg);
}
details.policy-accordion summary:hover{
background:#fafcfa;
}
.accordion-body{
padding:0 20px 24px;
}
.accordion-body h4{
color:#1b5e20;
margin-bottom:5px;
font-size:14.5px;
}
.accordion-body p, .accordion-body li{
line-height:1.6;
font-size:14px;
color:#444;
}
.policy-section{
background:#fff;
padding:30px;
margin:20px 0;
border-radius:8px;
box-shadow:0 2px 8px rgba(0,0,0,.1);
scroll-margin-top:20px;
}
.policy-section h2{
text-align:left;
color:#1b5e20;
margin-top:0;
}
.policy-section h3{
color:#1b5e20;
margin-bottom:5px;
}
.policy-section p, .policy-section li{
line-height:1.6;
font-size:15px;
}
.back-to-top{
display:block;
text-align:right;
font-size:13px;
margin-top:10px;
}
.back-to-top a{
color:#1b5e20;
}
@media (max-width:640px){
.hero-banner h1{font-size:28px;}
.included-grid{grid-template-columns:1fr;}
.steps-grid{grid-template-columns:1fr;}
.research-grid{grid-template-columns:1fr;}
.audience-grid{grid-template-columns:1fr;}
}
html body { font-family: Arial,sans-serif; background: #f4f6f8; color: #333; }
/* hp:clone-css:end */
[data-delay-vturb] {
  display: none !important;
}