/* GrowthPro Page — 6 Themes */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700&family=Playfair+Display:wght@700&family=Cormorant+Garamond:wght@700&family=Lora:wght@700&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

.gpp-wrap{min-height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased;position:relative;overflow:hidden}
.gpp-inner{width:100%;max-width:480px;padding:40px 20px 60px;display:flex;flex-direction:column;align-items:center;position:relative;z-index:2}

/* Hero */
.gpp-hero{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;min-height:100%}
.gpp-hero-overlay{position:absolute;inset:0}

/* Avatar */
.gpp-avatar-wrap{margin-bottom:14px}
.gpp-avatar{width:86px;height:86px;border-radius:50%;object-fit:cover;display:block}
.gpp-avatar-ph{width:86px;height:86px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px}

/* Name & Tagline */
.gpp-name{font-size:22px;font-weight:700;text-align:center;margin-bottom:6px;line-height:1.2}
.gpp-tagline{font-size:13px;text-align:center;margin-bottom:28px;opacity:.7}

/* Links */
.gpp-links{width:100%;display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.gpp-btn{width:100%;display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:12px;text-decoration:none;font-size:14px;font-weight:500;transition:all .18s;position:relative}
.gpp-btn span{flex:1}
.gpp-chevron{font-size:14px;opacity:.5}
.gpp-btn:hover{transform:translateY(-1px)}
.gpp-btn:active{transform:scale(.98)}

/* Socials */
.gpp-socials{display:flex;gap:20px;margin-bottom:28px}
.gpp-si{font-size:22px;text-decoration:none;transition:opacity .15s}
.gpp-si:hover{opacity:.7}

/* Powered by */
.gpp-powered{font-size:11px;opacity:.4;text-align:center}
.gpp-powered strong{font-weight:600}

/* ══════════════════════════════════════════════
   THEME 1 — DARK ELEGANCE
══════════════════════════════════════════════ */
.gpp-dark_elegance{background:#0a0a0a;color:#f0f0f0}
.gpp-dark_elegance .gpp-hero-overlay{background:rgba(0,0,0,.65)}
.gpp-dark_elegance .gpp-avatar{border:2px solid #c9a84c}
.gpp-dark_elegance .gpp-avatar-ph{background:#1a1a1a;color:#c9a84c;border:2px solid #c9a84c}
.gpp-dark_elegance .gpp-name{font-family:'Playfair Display',serif;color:#fff}
.gpp-dark_elegance .gpp-tagline{color:#888}
.gpp-dark_elegance .gpp-btn{background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.25);color:#e0e0e0}
.gpp-dark_elegance .gpp-btn i:first-child{color:#c9a84c}
.gpp-dark_elegance .gpp-btn:hover{background:rgba(201,168,76,.13);border-color:rgba(201,168,76,.5)}
.gpp-dark_elegance .gpp-btn-accent{background:#c9a84c;border-color:#c9a84c;color:#0a0a0a}
.gpp-dark_elegance .gpp-btn-accent i{color:#0a0a0a!important}
.gpp-dark_elegance .gpp-si{color:#555}
.gpp-dark_elegance .gpp-si:hover{color:#c9a84c}

/* ══════════════════════════════════════════════
   THEME 2 — MEDITERRANEAN
══════════════════════════════════════════════ */
.gpp-mediterranean{background:linear-gradient(160deg,#1a3a5c 0%,#0d2137 100%);color:#fff}
.gpp-mediterranean .gpp-hero-overlay{background:rgba(13,33,55,.65)}
.gpp-mediterranean .gpp-avatar{border:3px solid rgba(255,255,255,.8)}
.gpp-mediterranean .gpp-avatar-ph{background:#2a5a8c;color:#fff;border:3px solid rgba(255,255,255,.5)}
.gpp-mediterranean .gpp-name{font-family:'Cormorant Garamond',serif;font-size:26px;color:#fff}
.gpp-mediterranean .gpp-tagline{color:rgba(255,255,255,.6)}
.gpp-mediterranean .gpp-btn{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:99px}
.gpp-mediterranean .gpp-btn i:first-child{color:rgba(255,255,255,.8)}
.gpp-mediterranean .gpp-btn:hover{background:rgba(255,255,255,.18)}
.gpp-mediterranean .gpp-btn-accent{background:#e05c2a;border-color:#e05c2a;color:#fff}
.gpp-mediterranean .gpp-si{color:rgba(255,255,255,.45)}
.gpp-mediterranean .gpp-si:hover{color:#fff}

/* ══════════════════════════════════════════════
   THEME 3 — WARM MINIMAL
══════════════════════════════════════════════ */
.gpp-warm_minimal{background:#faf7f4;color:#2d1f17}
.gpp-warm_minimal .gpp-hero-overlay{background:rgba(250,247,244,.75)}
.gpp-warm_minimal .gpp-avatar{border:none;box-shadow:0 2px 12px rgba(0,0,0,.1)}
.gpp-warm_minimal .gpp-avatar-ph{background:#e8ddd5;color:#8b6f5e}
.gpp-warm_minimal .gpp-name{color:#1a0f08}
.gpp-warm_minimal .gpp-tagline{color:#9b7b6e}
.gpp-warm_minimal .gpp-btn{background:#fff;border:1px solid #e0d5cc;color:#2d1f17;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.gpp-warm_minimal .gpp-btn i:first-child{color:#c4785a}
.gpp-warm_minimal .gpp-btn:hover{border-color:#c4a090;box-shadow:0 3px 10px rgba(0,0,0,.08)}
.gpp-warm_minimal .gpp-btn-accent{background:#c4785a;border-color:#c4785a;color:#fff}
.gpp-warm_minimal .gpp-btn-accent i{color:#fff!important}
.gpp-warm_minimal .gpp-si{color:#c4a99a}
.gpp-warm_minimal .gpp-si:hover{color:#c4785a}

/* ══════════════════════════════════════════════
   THEME 4 — NEON NIGHT
══════════════════════════════════════════════ */
.gpp-neon_night{background:#06060f;color:#e8e8ff}
.gpp-neon_night .gpp-hero-overlay{background:rgba(6,6,15,.7)}
.gpp-neon_night .gpp-avatar{border:2px solid #00ffcc}
.gpp-neon_night .gpp-avatar-ph{background:#0d1a15;color:#00ffcc;border:2px solid #00ffcc}
.gpp-neon_night .gpp-name{font-family:'DM Sans',sans-serif;font-weight:700;color:#fff;letter-spacing:-.3px}
.gpp-neon_night .gpp-tagline{color:#00ffcc;opacity:.6}
.gpp-neon_night .gpp-btn{background:rgba(0,255,204,.05);border:1px solid rgba(0,255,204,.2);color:#e8e8ff}
.gpp-neon_night .gpp-btn i:first-child{color:#00ffcc}
.gpp-neon_night .gpp-btn:hover{background:rgba(0,255,204,.1);border-color:rgba(0,255,204,.4)}
.gpp-neon_night .gpp-btn-accent{background:#00ffcc;border-color:#00ffcc;color:#06060f}
.gpp-neon_night .gpp-btn-accent i{color:#06060f!important}
.gpp-neon_night .gpp-si{color:rgba(0,255,204,.4)}
.gpp-neon_night .gpp-si:hover{color:#00ffcc}

/* ══════════════════════════════════════════════
   THEME 5 — SAKURA
══════════════════════════════════════════════ */
.gpp-sakura{background:#fff5f8;color:#2d0a17}
.gpp-sakura .gpp-hero-overlay{background:rgba(255,245,248,.7)}
.gpp-sakura .gpp-avatar{border:2px solid #f9a8c9}
.gpp-sakura .gpp-avatar-ph{background:#fde8ef;color:#d4527a;border:2px solid #f9a8c9}
.gpp-sakura .gpp-name{font-family:'Cormorant Garamond',serif;font-size:24px;color:#2d0a17}
.gpp-sakura .gpp-tagline{color:#c07090}
.gpp-sakura .gpp-btn{background:#fff;border:1px solid #f9a8c9;color:#2d0a17;border-radius:99px}
.gpp-sakura .gpp-btn i:first-child{color:#d4527a}
.gpp-sakura .gpp-btn:hover{background:#fde8ef;border-color:#d4527a}
.gpp-sakura .gpp-btn-accent{background:#d4527a;border-color:#d4527a;color:#fff;border-radius:99px}
.gpp-sakura .gpp-btn-accent i{color:#fff!important}
.gpp-sakura .gpp-si{color:#f9a8c9}
.gpp-sakura .gpp-si:hover{color:#d4527a}

/* ══════════════════════════════════════════════
   THEME 6 — FOREST
══════════════════════════════════════════════ */
.gpp-forest{background:#f4f7f2;color:#0d2015}
.gpp-forest .gpp-hero-overlay{background:rgba(244,247,242,.7)}
.gpp-forest .gpp-avatar{border:2px solid #4a8c5c}
.gpp-forest .gpp-avatar-ph{background:#e0eee5;color:#2d7a45;border:2px solid #4a8c5c}
.gpp-forest .gpp-name{font-family:'Lora',serif;color:#0d2015}
.gpp-forest .gpp-tagline{color:#5a8a6a}
.gpp-forest .gpp-btn{background:#fff;border:1px solid #b8d4c0;color:#0d2015}
.gpp-forest .gpp-btn i:first-child{color:#2d7a45}
.gpp-forest .gpp-btn:hover{border-color:#4a8c5c;background:#f0f8f3}
.gpp-forest .gpp-btn-accent{background:#2d7a45;border-color:#2d7a45;color:#fff}
.gpp-forest .gpp-btn-accent i{color:#fff!important}
.gpp-forest .gpp-si{color:#7ab88a}
.gpp-forest .gpp-si:hover{color:#2d7a45}

/* Mobile optimizations */
@media(max-width:480px){
  .gpp-inner{padding:32px 16px 48px}
  .gpp-name{font-size:20px}
  .gpp-btn{padding:13px 16px}
}