/* ===========================
   GrowVPD Pro — homepage (v11, release)
   Loaded by index.html only; everything shared lives in style.css.
   =========================== */

/* --- Hero additions --- */
.hero-store{display:flex;flex-direction:column;gap:14px;max-width:470px}
.hero-notify-lead{font-size:.84rem;color:rgba(255,255,255,.55);margin:6px 0 -2px}
.hero-notify-form .notify-msg.is-error{color:#EF9A9A}
.hero-hub-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px;font-size:.86rem}
.hero-hub-pill{display:inline-flex;align-items:center;background:linear-gradient(135deg,#4CAF50,#00BFA5);color:#06140a;font-weight:800;font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:100px}
.hero-hub-line a{color:#A5D6A7;font-weight:600;border-bottom:1px solid rgba(165,214,167,.4);padding-bottom:1px;transition:color .2s,border-color .2s}
.hero-hub-line a:hover{color:#C8E6C9;border-bottom-color:#C8E6C9}
.hero-visual .phone-frame{width:290px}
@media(max-width:768px){
  .hero-store{margin:0 auto}
  .hero-hub-line{justify-content:center}
  .hero-visual .phone-frame{width:230px}
}

/* --- Store badges (state driven by js/site-config.js) --- */
.store-badges{display:flex;gap:12px;flex-wrap:wrap}
.store-badge{display:inline-flex;align-items:center;gap:11px;background:#0a0f0a;border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:9px 18px 9px 14px;color:#fff;text-decoration:none;transition:border-color .2s,transform .2s,background .2s;min-width:172px}
a.store-badge[href]:hover{border-color:rgba(76,175,80,.7);background:#0e150e;transform:translateY(-2px)}
.store-badge svg{width:26px;height:26px;flex-shrink:0}
.store-badge .sb-text{display:flex;flex-direction:column;line-height:1.12;text-align:left}
.store-badge .sb-small{font-size:.64rem;letter-spacing:.03em;opacity:.8;text-transform:uppercase}
.store-badge .sb-brand{font-size:1.06rem;font-weight:700;letter-spacing:-.01em}
.store-badge.is-soon{cursor:default;opacity:.72;border-style:dashed}
.store-badge.is-soon .sb-small{color:#A5D6A7;opacity:1}
html[dir="rtl"] .store-badge .sb-text{text-align:right}
.store-badges-light .store-badge{background:#111;border-color:#111}
@media(max-width:560px){.store-badges{justify-content:center}.store-badge{flex:1 1 0;justify-content:center;min-width:150px}}

/* --- Numbers strip --- */
.stats-strip{padding:34px 0 10px;background:#fff}
.stats-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.stat{text-align:center;padding:18px 10px;border:1px solid #ECEFF1;border-radius:16px;background:#FAFCFA}
.stat-num{display:block;font-size:2.3rem;font-weight:900;line-height:1;letter-spacing:-.02em;background:linear-gradient(135deg,#2E7D32,#00897B);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat-lbl{display:block;margin-top:8px;font-size:.8rem;line-height:1.35;color:#607D8B}
@media(max-width:1000px){.stats-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.stats-grid{grid-template-columns:repeat(2,1fr);gap:10px}.stat-num{font-size:2rem}}

/* --- Features intro --- */
.feat-intro{padding:84px 0 8px;background:#fff}
.feat-intro .section-header{margin-bottom:0}
.feat-intro .section-header p{max-width:620px}

/* --- Feature rows --- */
.feat{padding:72px 0;background:#fff}
.feat:nth-of-type(even){background:#F7FAF7}
.feat-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.feat--rev .feat-text{order:2}
.feat--rev .feat-visual{order:1}
.feat-label{display:inline-block;font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#2E7D32;background:rgba(46,125,50,.08);padding:4px 12px;border-radius:6px;margin-bottom:14px}
.feat-text h2{font-size:2.25rem;font-weight:900;line-height:1.14;letter-spacing:-.02em;color:#1a1f1a;margin-bottom:16px}
.feat-text > p{font-size:1.04rem;line-height:1.7;color:#546E7A;margin-bottom:20px;max-width:560px}
.feat-list{display:flex;flex-direction:column;gap:11px;margin-bottom:18px}
.feat-list li{position:relative;padding-left:30px;font-size:.95rem;line-height:1.55;color:#37474F}
.feat-list li::before{content:'';position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:#E8F5E9 url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='%232E7D32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.5 12L2 7.5l1.4-1.4L6.5 9.2l6.1-6.1L14 4.5 6.5 12z'/%3E%3C/svg%3E") no-repeat center/11px}
html[dir="rtl"] .feat-list li{padding-left:0;padding-right:30px}
html[dir="rtl"] .feat-list li::before{left:auto;right:0}
.feat-link{display:inline-flex;align-items:center;gap:6px;color:#2E7D32;font-weight:700;font-size:.95rem;border-bottom:2px solid rgba(46,125,50,.25);padding-bottom:2px;transition:border-color .2s,color .2s}
.feat-link:hover{color:#1B5E20;border-bottom-color:#2E7D32}
.feat-note{font-size:.86rem;color:#78909C;margin-top:4px}

.feat-visual{display:flex;justify-content:center;position:relative}
.feat-visual::before{content:'';position:absolute;width:78%;height:70%;top:14%;left:11%;background:radial-gradient(circle,rgba(76,175,80,.20),transparent 70%);filter:blur(40px);z-index:0}
.feat-phones{display:flex;gap:22px;align-items:flex-start;position:relative;z-index:1}
.feat-phones .phone-frame{width:265px;box-shadow:0 30px 70px rgba(20,40,20,.28),inset 0 1px 0 rgba(255,255,255,.08)}
.feat-phones.duo .phone-frame{width:236px}
.feat-phones.duo .phone-frame:nth-child(2){margin-top:56px}

@media(max-width:980px){
  .feat-grid{grid-template-columns:1fr;gap:40px}
  .feat--rev .feat-text,.feat--rev .feat-visual{order:0}
  .feat-text{text-align:left}
  .feat-text h2{font-size:1.9rem}
}
@media(max-width:560px){
  .feat{padding:56px 0}
  .feat-text h2{font-size:1.65rem}
  .feat-phones .phone-frame{width:220px}
  .feat-phones.duo{gap:12px}
  .feat-phones.duo .phone-frame{width:calc(50vw - 30px);max-width:190px;border-radius:26px;padding:6px}
  .feat-phones.duo .phone-screen{border-radius:21px}
  .feat-phones.duo .phone-frame:nth-child(2){margin-top:36px}
}

/* --- Brand chips (feeding) --- */
.brand-block{margin-top:6px}
.brand-caption{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.09em;color:#90A4AE;margin-bottom:10px}
.brand-chips{display:flex;flex-wrap:wrap;gap:7px}
.brand-chip{display:inline-block;font-size:.78rem;font-weight:600;color:#37474F;background:#fff;border:1px solid #DDE5DD;border-radius:100px;padding:5px 11px;white-space:nowrap}
.brand-note{font-size:.72rem;color:#9EAAB0;margin-top:10px;line-height:1.5}

/* --- Verified hardware note (automation) --- */
.verified-note{margin-top:6px;padding:14px 16px;border-left:3px solid #4CAF50;background:#F1F8E9;border-radius:0 12px 12px 0;font-size:.86rem;line-height:1.6;color:#455A64}
.verified-note strong{color:#1B5E20}
html[dir="rtl"] .verified-note{border-left:none;border-right:3px solid #4CAF50;border-radius:12px 0 0 12px}

/* --- Sync & hubs (dark) --- */
.hub-spotlight{position:relative;padding:96px 0;background:linear-gradient(180deg,#080C08 0%,#0c130c 100%);color:#fff;overflow:hidden}
.hub-spotlight-glow{position:absolute;top:-180px;right:-120px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(46,125,50,.30),transparent 70%);filter:blur(110px);pointer-events:none}
.hub-spotlight .container{position:relative;z-index:1}
.every-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:72px}
.every-card{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:24px 22px}
.every-card .ec-ico{width:40px;height:40px;border-radius:12px;background:rgba(76,175,80,.12);border:1px solid rgba(76,175,80,.24);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.every-card .ec-ico svg{width:22px;height:22px;stroke:#81C784}
.every-card h3{font-size:1.02rem;font-weight:800;margin-bottom:6px;color:#fff}
.every-card p{font-size:.9rem;line-height:1.6;color:rgba(255,255,255,.6)}
.hub-spotlight-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center}
.hub-spotlight-label{display:inline-flex;align-items:center;gap:8px;background:rgba(76,175,80,.12);border:1px solid rgba(76,175,80,.25);color:#81C784;padding:5px 14px;border-radius:100px;font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:18px}
.hub-spotlight-dot{width:7px;height:7px;border-radius:50%;background:#4CAF50;animation:pulse 2s infinite}
.hub-spotlight-text h2{font-size:2.4rem;font-weight:900;line-height:1.12;letter-spacing:-.02em;color:#fff;margin-bottom:16px}
.hub-spotlight-sub{font-size:1.04rem;line-height:1.7;color:rgba(255,255,255,.66);margin-bottom:24px;max-width:560px}
.hub-spotlight-bullets{display:flex;flex-direction:column;gap:14px;margin-bottom:28px}
.hub-spotlight-bullets li{display:flex;gap:14px;align-items:flex-start}
.hsb-ico{flex-shrink:0;width:38px;height:38px;border-radius:11px;background:rgba(76,175,80,.12);border:1px solid rgba(76,175,80,.22);display:flex;align-items:center;justify-content:center}
.hsb-ico svg{width:19px;height:19px;stroke:#81C784}
.hub-spotlight-bullets li > span:last-child{display:flex;flex-direction:column;gap:2px}
.hub-spotlight-bullets strong{color:#fff;font-size:.98rem;font-weight:700}
.hub-spotlight-bullets li > span:last-child > span{color:rgba(255,255,255,.6);font-size:.9rem;line-height:1.55}
.hub-spotlight-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.hub-spotlight-cta .btn-primary{background:linear-gradient(135deg,#2E7D32,#00897B);border-color:transparent;box-shadow:0 10px 36px rgba(46,125,50,.35)}
.hub-spotlight-cta .btn-primary:hover{background:linear-gradient(135deg,#1B5E20,#00695C)}
.hub-spotlight-note{font-size:.82rem;color:rgba(255,255,255,.45);line-height:1.6}
.hub-spotlight-shots{display:flex;flex-direction:column;gap:14px}
.hub-shot-main,.hub-shot-mini{display:block;position:relative;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.1);background:#0e160e;box-shadow:0 18px 50px rgba(0,0,0,.45);transition:transform .25s,border-color .25s,box-shadow .25s}
.hub-shot-main:hover,.hub-shot-mini:hover{transform:translateY(-4px);border-color:rgba(76,175,80,.45);box-shadow:0 24px 60px rgba(0,0,0,.55)}
.hub-shot-main img,.hub-shot-mini img{width:100%;display:block;aspect-ratio:16/10;object-fit:cover;object-position:top left;cursor:zoom-in}
.hub-shot-row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.hub-shot-cap{position:absolute;left:0;right:0;bottom:0;padding:18px 12px 8px;font-size:.74rem;font-weight:600;color:#fff;background:linear-gradient(0deg,rgba(6,12,8,.88),transparent);text-align:center}
.hub-shot-mini .hub-shot-cap{font-size:.68rem;padding:14px 8px 6px}
.hub-lightbox{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;background:rgba(6,10,6,.94);padding:4vmin;cursor:zoom-out}
.hub-lightbox.open{display:flex}
.hub-lightbox img{max-width:96vw;max-height:92vh;border-radius:10px;box-shadow:0 24px 80px rgba(0,0,0,.65);cursor:default}
.hub-lightbox-close{position:absolute;top:18px;right:22px;width:44px;height:44px;border:none;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}
.hub-lightbox-close:hover{background:rgba(255,255,255,.24)}
html[dir="rtl"] .hub-lightbox-close{right:auto;left:22px}
@media(max-width:980px){.hub-spotlight-grid{grid-template-columns:1fr;gap:40px}.hub-spotlight-text h2{font-size:2rem}.every-grid{grid-template-columns:1fr;margin-bottom:56px}}
@media(max-width:560px){.hub-spotlight{padding:72px 0}.hub-shot-row{grid-template-columns:1fr}.hub-spotlight-cta .btn{width:100%;justify-content:center}}

/* --- More tools --- */
.tools{padding:84px 0;background:#fff}
.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tool-card{border:1px solid #ECEFF1;border-radius:18px;padding:22px 22px 20px;background:#FAFCFA;transition:border-color .2s,transform .2s,box-shadow .2s}
.tool-card:hover{border-color:#C8E6C9;transform:translateY(-3px);box-shadow:0 14px 40px rgba(46,125,50,.08)}
.tool-card .tc-ico{width:42px;height:42px;border-radius:12px;background:#E8F5E9;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.tool-card .tc-ico svg{width:22px;height:22px;stroke:#2E7D32}
.tool-card h3{font-size:1rem;font-weight:800;color:#1a1f1a;margin-bottom:6px}
.tool-card p{font-size:.9rem;line-height:1.6;color:#607D8B}
@media(max-width:900px){.tools-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tools-grid{grid-template-columns:1fr}}

/* --- Pricing (release) --- */
.pricing-features-split .pf-col ul li{align-items:flex-start;line-height:1.45}
.pricing-features-split .pf-col ul li::before{margin-top:1px}
.pricing-honesty{max-width:640px;margin:30px auto 0;font-size:.86rem;line-height:1.65;color:#607D8B;background:#F7FAF7;border-left:3px solid #2E7D32;padding:14px 18px;border-radius:0 12px 12px 0}
.pricing-card-cta .btn{width:100%;justify-content:center}

/* --- FAQ more link --- */
.faq-more{text-align:center;margin-top:22px}
.faq-more a{color:#2E7D32;font-weight:700;border-bottom:2px solid rgba(46,125,50,.25);padding-bottom:2px}

/* --- Final CTA --- */
.cta-final{position:relative;padding:88px 0;background:radial-gradient(900px 400px at 80% 0%,rgba(0,191,165,.18),transparent 60%),linear-gradient(135deg,#0b1a0d,#10301a);color:#fff;text-align:center;overflow:hidden}
.cta-final h2{font-size:2.4rem;font-weight:900;letter-spacing:-.02em;margin-bottom:12px}
.cta-final p{color:rgba(255,255,255,.66);max-width:560px;margin:0 auto 28px;font-size:1.04rem;line-height:1.65}
.cta-final .store-badges{justify-content:center;margin-bottom:18px}
.cta-final .btn-ghost{margin-top:4px}
@media(max-width:560px){.cta-final h2{font-size:1.8rem}}

/* --- Footer (home) --- */
.footer-tagline{font-size:.84rem;color:rgba(255,255,255,.4);margin-top:6px}
.footer-mini-sub .sub-msg.is-error{color:#EF9A9A}
.hero-notify-hint a{color:rgba(255,255,255,.7);text-decoration:underline}
.hero-notify-hint a:hover{color:#fff}
